\u5728 JavaScript \u4e2d\uff0c\u51e0\u4e4e\u6240\u6709\u7684\u5bf9\u8c61\u90fd\u662f Object \u7c7b\u578b\u7684\u5b9e\u4f8b\uff0c\u5b83\u4eec\u90fd\u4f1a\u4ece Object.prototype \u7ee7\u627f\u5c5e\u6027\u548c\u65b9\u6cd5\u3002<\/p>\n
Object \u6784\u9020\u51fd\u6570\u521b\u5efa\u4e00\u4e2a\u5bf9\u8c61\u5305\u88c5\u5668\u3002<\/p>\n
Object \u6784\u9020\u51fd\u6570\uff0c\u4f1a\u6839\u636e\u7ed9\u5b9a\u7684\u53c2\u6570\u521b\u5efa\u5bf9\u8c61\uff0c\u5177\u4f53\u6709\u4ee5\u4e0b\u60c5\u51b5\uff1a<\/p>\n
- \n
- \u5982\u679c\u7ed9\u5b9a\u503c\u662f null \u6216 undefined\uff0c\u5c06\u4f1a\u521b\u5efa\u5e76\u8fd4\u56de\u4e00\u4e2a\u7a7a\u5bf9\u8c61\u3002<\/li>\n
- \u5982\u679c\u4f20\u8fdb\u53bb\u7684\u662f\u4e00\u4e2a\u57fa\u672c\u7c7b\u578b\u7684\u503c\uff0c\u5219\u4f1a\u6784\u9020\u5176\u5305\u88c5\u7c7b\u578b\u7684\u5bf9\u8c61\u3002<\/li>\n
- \u5982\u679c\u4f20\u8fdb\u53bb\u7684\u662f\u5f15\u7528\u7c7b\u578b\u7684\u503c\uff0c\u4ecd\u7136\u4f1a\u8fd4\u56de\u8fd9\u4e2a\u503c\uff0c\u7ecf\u4ed6\u4eec\u590d\u5236\u7684\u53d8\u91cf\u4fdd\u6709\u548c\u6e90\u5bf9\u8c61\u76f8\u540c\u7684\u5f15\u7528\u5730\u5740\u3002<\/li>\n
- \u5f53\u4ee5\u975e\u6784\u9020\u51fd\u6570\u5f62\u5f0f\u88ab\u8c03\u7528\u65f6\uff0cObject \u7684\u884c\u4e3a\u7b49\u540c\u4e8e new Object()\u3002<\/li>\n<\/ul>\n
1.1\u521b\u5efa\u5bf9\u8c61\u7684\u65b9\u6cd5<\/h3>\n
- \n
- \n
new Objcet<\/p>\n
person=new Object();\nperson.firstname=\"John\";\nperson.lastname=\"Doe\";\nperson.age=50;\nperson.eyecolor=\"blue\";<\/code><\/pre>\n<\/li>\n- \n
\u952e\u503c\u5bf9<\/p>\n
\/\/ \u540c\u4e0a\uff0c\u4e5f\u662f\u4f7f\u7528 Object\u6765\u521b\u5efa\u5bf9\u8c61\n\/\/ JavaScript \u5bf9\u8c61\u5c31\u662f\u4e00\u4e2a name:value \u96c6\u5408\nperson={firstname:\"John\",lastname:\"Doe\",age:50,eyecolor:\"blue\"};<\/code><\/pre>\n<\/li>\n- \n
\u4f7f\u7528\u5bf9\u8c61\u6784\u9020\u5668<\/p>\n
\/\/ \u672c\u4f8b\u4f7f\u7528\u51fd\u6570\u6765\u6784\u9020\u5bf9\u8c61\nfunction person(firstname,lastname,age,eyecolor)\n{\n this.firstname=firstname;\n this.lastname=lastname;\n this.age=age;\n this.eyecolor=eyecolor;\n}<\/code><\/pre>\n<\/li>\n<\/ol>\n1.2 \u628a\u65b9\u6cd5\u6dfb\u52a0\u5230 JavaScript \u5bf9\u8c61<\/h3>\n
\u65b9\u6cd5\u53ea\u4e0d\u8fc7\u662f\u9644\u52a0\u5728\u5bf9\u8c61\u4e0a\u7684\u51fd\u6570\u3002<\/p>\n
\u5728\u6784\u9020\u5668\u51fd\u6570\u5185\u90e8\u5b9a\u4e49\u5bf9\u8c61\u7684\u65b9\u6cd5\uff1a<\/p>\n
function person(firstname,lastname,age,eyecolor)\n{\n this.firstname=firstname;\n this.lastname=lastname;\n this.age=age;\n this.eyecolor=eyecolor;\n\n this.changeName=changeName;\n function changeName(name)\n {\n this.lastname=name;\n }\n}<\/code><\/pre>\n1.3 JavaScript \u7c7b<\/h3>\n
JavaScript \u662f\u9762\u5411\u5bf9\u8c61\u7684\u8bed\u8a00\uff0c\u4f46 JavaScript \u4e0d\u4f7f\u7528\u7c7b\u3002<\/p>\n
\u5728 JavaScript \u4e2d\uff0c\u4e0d\u4f1a\u521b\u5efa\u7c7b\uff0c\u4e5f\u4e0d\u4f1a\u901a\u8fc7\u7c7b\u6765\u521b\u5efa\u5bf9\u8c61\uff08\u5c31\u50cf\u5728\u5176\u4ed6\u9762\u5411\u5bf9\u8c61\u7684\u8bed\u8a00\u4e2d\u90a3\u6837\uff09\u3002<\/p>\n
JavaScript \u57fa\u4e8e prototype\uff0c\u800c\u4e0d\u662f\u57fa\u4e8e\u7c7b\u7684\u3002<\/p>\n
2.JS\u57fa\u7840-\u539f\u578b\u94fe<\/h2>\n
2.1 constructor \u7684\u542b\u4e49<\/h3>\n
constructor \u662f\u4e00\u79cd\u7528\u4e8e\u521b\u5efa\u548c\u521d\u59cb\u5316class\u521b\u5efa\u7684\u5bf9\u8c61\u7684\u7279\u6b8a\u65b9\u6cd5\u3002<\/em><\/strong><\/p>\n
\u5728\u4e00\u4e2a\u7c7b\u4e2d\u53ea\u80fd\u6709\u4e00\u4e2aconstructor\u65b9\u6cd5\uff0c\u672c\u8d28\u662f\u4e00\u4e2a\u6784\u9020\u51fd\u6570\uff0c\u5982\u679c\u4e00\u4e2a\u7c7b\u4e0d\u6307\u5b9a\u4e00\u4e2a\u6784\u9020\u51fd\u6570(constructor)\u65b9\u6cd5, \u5219\u4f7f\u7528\u4e00\u4e2a\u9ed8\u8ba4\u7684\u6784\u9020\u51fd\u6570(constructor)\u3002<\/p>\n
\u6240\u8c13\u201c\u6784\u9020\u51fd\u6570\u201d\uff0c\u5c31\u662f\u4e13\u95e8\u7528\u6765\u751f\u6210\u5b9e\u4f8b\u5bf9\u8c61\u7684\u51fd\u6570\u3002\u5b83\u5c31\u662f\u5bf9\u8c61\u7684\u6a21\u677f\uff0c\u63cf\u8ff0\u5b9e\u4f8b\u5bf9\u8c61\u7684\u57fa\u672c\u7ed3\u6784\u3002<\/p>\n
- \n
- \u4e00\u4e2a\u7c7b\u5fc5\u987b\u6709
constructor<\/code>\u65b9\u6cd5\uff0c\u5982\u679c\u6ca1\u6709\u663e\u793a\u5b9a\u4e49\uff0c\u4e00\u4e2a\u7a7a\u7684constructor<\/code>\u65b9\u6cd5\u4f1a\u88ab\u9ed8\u8ba4\u6dfb\u52a0\u3002<\/li>\n<\/ul>\n\u793a\u4f8b\u4ee3\u7801\uff1a<\/p>\n
\/* 1. ***************************************\/\n\/\/ \u5b9a\u4e49\u4e86\u4e00\u4e2a\u7a7a\u7684\u7c7bPoint\uff0c\nclass Point {\n \/\/ JavaScript\u5f15\u64ce\u4f1a\u81ea\u52a8\u4e3a\u5b83\u6dfb\u52a0\u4e00\u4e2a\u7a7a\u7684constructor\u65b9\u6cd5\n}\n\n\/\/ \u7b49\u540c\u4e8e\nclass Point {\n constructor() {}\n}\n\/* 2.***************************************\/\n\/\/ \u9996\u5148\u58f0\u660e\u4e00\u4e2a People \u7c7b\nclass People{\n constructor(sex,age) {\n this.name = '\u4e09\u4e0a\u60a0\u4e9a';\n this.sex = sex;\n this.age = age;\n }\n}\nconst people1= new People();\nconsole.log(people1.name); \/\/\u4e09\u4e0a\u60a0\u4e9a\npeople1.constructor \/\/ === People\n\/\/class People{\n\/\/ constructor(sex,age) {\n\/\/ this.name = '\u4e09\u4e0a\u60a0\u4e9a';\n\/\/ this.sex = sex;\n\/\/ this.age = age;\n\/\/ }\n\/\/}\n\n\/* 3.***************************************\/\nvar txt = "Hello World!";\ntxt.constructor \/\/ \u0192 String() { [native code] }<\/code><\/pre>\n- \n
constructor<\/code>\u5c5e\u6027\u8868\u793a\u539f\u578b\u5bf9\u8c61\u4e0e\u6784\u9020\u51fd\u6570\u4e4b\u95f4\u7684\u5173\u8054\u5173\u7cfb\uff0c\u5982\u679c\u4fee\u6539\u4e86\u539f\u578b\u5bf9\u8c61\uff0c\u4e00\u822c\u4f1a\u540c\u65f6\u4fee\u6539constructor<\/code>\u5c5e\u6027\uff0c\u9632\u6b62\u5f15\u7528\u7684\u65f6\u5019\u51fa\u9519\u3002<\/li>\n<\/ul>\nfunction Person(name) {\n this.name = name;\n}\n\nPerson.prototype.constructor === Person \/\/ true\n\nPerson.prototype = {\n method: function () {}\n};\n\nPerson.prototype.constructor === Person \/\/ false\nPerson.prototype.constructor === Object \/\/ true<\/code><\/pre>\n![\"image-20230522211013275\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230522211013275.png\")
<\/p>\n\u5728JavaScript\u4e2d\uff0cprototype\u5bf9\u8c61\u662f\u5b9e\u73b0\u9762\u5411\u5bf9\u8c61\u7684\u4e00\u4e2a\u91cd\u8981\u673a\u5236\u3002<\/p>\n
\u6bcf\u4e2a\u51fd\u6570\u5c31\u662f\u4e00\u4e2a\u5bf9\u8c61\uff08Function\uff09\uff0c\u51fd\u6570\u5bf9\u8c61\u90fd\u6709\u4e00\u4e2a\u5b50\u5bf9\u8c61 prototype\u5bf9\u8c61\uff0c\u7c7b\u662f\u4ee5\u51fd\u6570\u7684\u5f62\u5f0f\u6765\u5b9a\u4e49\u7684\u3002prototype\u8868\u793a\u8be5\u51fd\u6570\u7684\u539f\u578b\uff0c\u4e5f\u8868\u793a\u4e00\u4e2a\u7c7b\u7684\u6210\u5458\u7684\u96c6\u5408\u3002<\/p>\n
\u5728\u901a\u8fc7new\u521b\u5efa\u4e00\u4e2a\u7c7b\u7684\u5b9e\u4f8b\u5bf9\u8c61\u7684\u65f6\u5019\uff0cprototype\u5bf9\u8c61\u7684\u6210\u5458\u90fd\u6210\u4e3a\u5b9e\u4f8b\u5316\u5bf9\u8c61\u7684\u6210\u5458\u3002<\/p>\n
1\u3001\u8be5\u5bf9\u8c61\u88ab\u7c7b\u6240\u5f15\u7528\uff0c\u53ea\u6709\u51fd\u6570\u5bf9\u8c61\u624d\u53ef\u5f15\u7528\uff1b<\/p>\n
2\u3001\u5728new\u5b9e\u4f8b\u5316\u540e\uff0c\u5176\u6210\u5458\u88ab\u5b9e\u4f8b\u5316\uff0c\u5b9e\u4f8b\u5bf9\u8c61\u65b9\u53ef\u8c03\u7528\u3002<\/p>\n
\u540c\u65f6\uff0c\u51fd\u6570\u662f\u4e00\u4e2a\u5bf9\u8c61\uff0c\u51fd\u6570\u5bf9\u8c61\u82e5\u76f4\u63a5\u58f0\u660e\u6210\u5458\uff0c\u4e0d\u7528\u88ab\u5b9e\u4f8b\u5316\u5373\u53ef\u8c03\u7528\u3002<\/p>\n
2.2 \u539f\u578b\u5bf9\u8c61prototype<\/h3>\n
\u6211\u4eec\u9996\u5148\u603b\u7ed3\u4e00\u4e0b\u539f\u578b\u5bf9\u8c61\u7684\u4f5c\u7528\uff1a<\/p>\n
- \n
- \u539f\u578b\u5bf9\u8c61\u5c31\u76f8\u5f53\u4e8e\u4e00\u4e2a\u516c\u5171\u7684\u533a\u57df\uff0c\u6240\u6709\u540c\u4e00\u4e2a\u7c7b\u7684\u5b9e\u4f8b\u90fd\u53ef\u4ee5\u8bbf\u95ee\u5230\u8fd9\u4e2a\u539f\u578b\u5bf9\u8c61\uff0c\u6211\u4eec\u53ef\u4ee5\u5c06\u5bf9\u8c61\u4e2d\u5171\u6709\u7684\u5185\u5bb9\uff0c\u7edf\u4e00\u8bbe\u7f6e\u5230\u539f\u578b\u5bf9\u8c61\u4e2d\u53bb\u3002<\/li>\n
- \u5f53\u6211\u4eec\u8bbf\u95ee\u5bf9\u8c61\u7684\u4e00\u4e2a\u5c5e\u6027\u6216\u8005\u65b9\u6cd5\u65f6\uff0c\u5b83\u4f1a\u5148\u5728\u5bf9\u8c61\u81ea\u8eab\u4e2d\u5bfb\u627e\uff0c\u5982\u679c\u627e\u5230\u8981\u67e5\u627e\u7684\u5c5e\u6027\u6216\u8005\u65b9\u6cd5\u5c31\u4f1a\u76f4\u63a5\u4f7f\u7528\uff0c\u5982\u679c\u6ca1\u6709\u5c31\u4f1a\u53bb\u539f\u578b\u5bf9\u8c61\u4e2d\u67e5\u627e\uff0c\u627e\u5230\u4e86\u5c31\u4f1a\u76f4\u63a5\u4f7f\u7528\u3002<\/li>\n
- \u5728\u6211\u4eec\u521b\u5efa\u6784\u9020\u51fd\u6570\u65f6\uff0c\u53ef\u4ee5\u5c06\u5bf9\u8c61\u7684\u5171\u6709\u5c5e\u6027\u6216\u65b9\u6cd5\uff0c\u7edf\u4e00\u6dfb\u52a0\u5230\u6784\u9020\u51fd\u6570\u7684\u539f\u578b\u5bf9\u8c61\u4e2d\u53bb\u3002\u8fd9\u6837\u505a\u7684\u597d\u5904\u5c31\u662f\u4e0d\u7528\u5206\u522b\u4e3a\u6bcf\u4e00\u4e2a\u5bf9\u8c61\u6dfb\u52a0\u8fd9\u4e9b\u5171\u6709\u7684\u5c5e\u6027\u6216\u65b9\u6cd5\uff0c\u4e5f\u4e0d\u4f1a\u5f71\u54cd\u5230\u5168\u5c40\u4f5c\u7528\u57df\uff0c\u540c\u65f6\u6bcf\u4e2a\u5bf9\u8c61\u4e5f\u90fd\u5177\u6709\u8fd9\u4e9b\u5c5e\u6027\u548c\u65b9\u6cd5\u3002\u53ef\u4ee5\u8bf4\u7ed9\u539f\u578b\u5bf9\u8c61\u6dfb\u52a0\u5c5e\u6027\u6216\u8005\u65b9\u6cd5\uff0c\u51fd\u6570\u7684\u6240\u6709\u5b9e\u4f8b\u5bf9\u8c61\u90fd\u4f1a\u81ea\u52a8\u62e5\u6709\u539f\u578b\u4e2d\u7684\u5c5e\u6027\u548c\u65b9\u6cd5\u3002<\/li>\n<\/ol>\n
- \n
- \u666e\u904d\u6765\u8bf4\uff0c\u5bf9\u4e8e\u6240\u6709\u51fd\u6570\uff0c\u6bcf\u4e2a\u51fd\u6570\u662f\u90fd\u4f1a\u542b\u6709\u4e00\u4e2aprototype\u5c5e\u6027\uff0c\u5b83\u9ed8\u8ba4\u6307\u5411\u4e00\u4e2aobject\u7a7a\u5bf9\u8c61(\u4e5f\u79f0\u4e3a\u539f\u578b\u5bf9\u8c61)\u3002<\/li>\n
- \u539f\u578b\u5bf9\u8c61\u4e2d\u90fd\u6709\u4e00\u4e2aconstructor\u5c5e\u6027,\u5b83\u662f\u6307\u5411\u51fd\u6570\u5bf9\u8c61\u7684<\/li>\n<\/ul>\n
function fun(){\n console.log('fun')\n }\nconsole.log(fun.prototype) \/\/\u9ed8\u8ba4\u6307\u5411\u4e00\u4e2aObject\u7a7a\u5b9e\u4f8b\u5bf9\u8c61\uff0c\u6ca1\u6709\u6211\u4eec\u7684\u5c5e\u6027\n\/\/\u539f\u578b\u5bf9\u8c61\u4e2d\u90fd\u6709\u4e00\u4e2aconstructor\u5c5e\u6027\uff0c\u5b83\u6307\u5411\u51fd\u6570\u5bf9\u8c61\nconsole.log(fun.prototype.constructor === fun) \/\/true<\/code><\/pre>\n![\"image-20230522173450959\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230522173450959.png\")
<\/p>\n2.3 prototype \u548c __proto__<\/h3>\n
- \n
- \n
\u6bcf\u4e2a\u51fd\u6570\u90fd\u6709prototype(\u663e\u5f0f\u539f\u578b)\u548c
__proto__<\/code>(\u9690\u5f0f\u539f\u578b);<\/p>\n<\/li>\n- \n
\u6bcf\u4e2a\u5bf9\u8c61\/\u6784\u9020\u5668\u51fd\u6570\u7684\u5b9e\u4f8b\uff08\u8fd9\u4e2a\u4e5f\u662f\u5bf9\u8c61\uff09\u90fd\u6709
__proto__<\/code>;<\/p>\n<\/li>\n- \n
\u5b9e\u4f8b\u7684
__proto__<\/code>\u6307\u5411\u6784\u9020\u51fd\u6570\u7684prototype\u3002\u8fd9\u4e2a\u79f0\u4e3a\u6784\u9020\u51fd\u6570\u7684\u539f\u578b\u5bf9\u8c61<\/font><\/strong>\uff1b<\/p>\n<\/li>\n- \n
js\u5f15\u64ce\u4f1a\u6cbf\u7740
__proto__<\/code>->prototype\u7684\u987a\u5e8f\u4e00\u76f4\u5f80\u4e0a\u65b9\u67e5\u627e\uff0c\u627e\u5230window.Object.prototype\u4e3a\u6b62\uff0cObject\u4e3a\u539f\u751f\u5e95\u5c42\u5bf9\u8c61\uff0c\u5230\u8fd9\u91cc\u5c31\u505c\u6b62\u4e86\u67e5\u627e\uff0c\u5982\u679c\u6ca1\u6709\u627e\u5230\uff0c\u5c31\u4f1a\u62a5\u9519\u6216\u8005\u8fd4\u56deundefined\uff1b<\/p>\n![\"image-20230423214325358\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230423214325358.png\")
<\/p>\n<\/li>\n- \n
\u800c\u6784\u9020\u51fd\u6570\u7684
__proto__<\/code>\u6307\u5411Function.prototype f() {[native code]}<\/code>\u3010\u6784\u9020\u5668\u51fd\u6570\uff0c\u4f46\u8fd9\u4e2a\u53eb\u6cd5\u5e76\u4e0d\u51c6\u786e\uff0c\u5b83\u76ee\u524d\u6ca1\u6709\u4e00\u4e2a\u5408\u9002\u7684\u4e2d\u6587\u540d<\/font><\/strong>\u3011\uff1b<\/p>\n<\/li>\n- \n
__proto__\u662f\u6d4f\u89c8\u5668\u5382\u5546\u5b9e\u73b0\u7684\uff0cW3C\u89c4\u8303\u4e2d\u5e76\u6ca1\u6709\u8fd9\u4e2a\u4e1c\u897f\uff1b<\/p>\n<\/li>\n
- \n
\u6240\u6709\u5bf9\u8c61\u90fd\u5177\u6709__proto__\u662f\u8fc7\u53bb\u5177\u6709\uff0c\u672a\u6765\u5c06\u79fb\u9664\uff0c\u56e0\u4e3a\u89c4\u8303\u672a\u5b9a\u4e49\uff0c\u53ea\u662f\u6d4f\u89c8\u5668\u5b9e\u73b0\u7684\u4e00\u4e2aget\u5c5e\u6027\u3002<\/p>\n<\/li>\n<\/ol>\n
![\"image-20230423212957799\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230423212957799.png\")
<\/p>\n- \n
- \n
JS\u4ee3\u7801\u8fd8\u6ca1\u8fd0\u884c\u7684 \u65f6\u5019\uff0cJS\u73af\u5883\u91cc\u5df2\u7ecf\u6709\u4e86\u4e00\u4e2awindow\u5bf9\u8c61\u3002\u51fd\u6570\u662f\u5bf9\u8c61;<\/p>\n<\/li>\n
- \n
window\u5bf9\u8c61\u6709\u4e00\u4e2aObject\u5c5e\u6027\uff0cwindow.Object\u662f\u4e00\u4e2a\u51fd\u6570\u5bf9\u8c61;<\/p>\n<\/li>\n
- \n
window.Object\u8fd9\u4e2a\u51fd\u6570\u5bf9\u8c61\u6709\u4e00\u4e2a\u91cd\u8981\u5c5e\u6027\u662fprototype;<\/p>\n<\/li>\n
- \n
window.Object.prototype\u91cc\u9762\u6709\u4e00\u5806\u5c5e\u6027;<\/p>\n<\/li>\n
- \n
\u6240\u6709\u7684\u5b9e\u4f8b\u51fd\u6570
__proto__<\/code>\u90fd\u4f1a\u6307\u5411\u6784\u9020\u51fd\u6570\u7684prototype<\/font>;<\/p>\n<\/li>\n- \n
constructor\u662f\u53cd\u5411\u7684prototype;<\/font><\/p>\n
![\"image-20230423213622115\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230423213622115.png\")
<\/p>\n<\/li>\n<\/ol>\n![\"image-20230423221241038\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230423221241038.png\")
<\/p>\n![\"image-20230423221435980\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230423221435980.png\")
<\/p>\n![\"image-20230423221508910\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230423221508910.png\")
<\/p>\n\u518d\u590d\u6742\u4e00\u4e0b\uff0carr.valueOf() \u505a\u4e86\u4ec0\u4e48\uff1f<\/strong><\/p>\n
- \n
arr<\/code> \u81ea\u8eab\u6ca1\u6709 valueOf\uff0c\u4e8e\u662f\u53bbarr.__proto__<\/code> \u4e0a\u627e;<\/li>\narr.__proto__<\/code> \u53ea\u6709 pop\u3001push \u4e5f\u6ca1\u6709 valueOf\uff0c\u4e8e\u662f\u53bbarr.__proto__.__proto<\/code>__ \u4e0a\u627e;<\/li>\narr.__proto__.__proto<\/code>__ \u5c31\u662f window.Object.prototype;<\/li>\n- \u6240\u4ee5 arr.valueOf \u5176\u5b9e\u5c31\u662f window.Object.prototype.valueOf;<\/li>\n
- arr.valueOf() \u7b49\u4ef7\u4e8e arr.valueOf.call(arr)<\/li>\n
- arr.valueOf.call(arr) \u7b49\u4ef7\u4e8e window.Object.prototype.valueOf.call(arr)
\n![\"e524432c944ac182d74083347520909\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/e524432c944ac182d74083347520909.jpg\")
<\/p>\n3.JS\u57fa\u7840-\u51fd\u6570\u8fdb\u9636<\/h2>\n<\/li>\n<\/ul>\n
\u51fd\u6570\u5373\u5bf9\u8c61<\/h3>\n
\u9996\u5148\uff1aJS\u6240\u6709\u4e8b\u7269\u90fd\u662f\u5bf9\u8c61\uff0c\u5bf9\u8c61\u662f\u62e5\u6709\u5c5e\u6027\u548c\u65b9\u6cd5\u7684\u6570\u636e\u3002\u6240\u4ee5\u51fd\u6570\u4e5f\u662f\u5bf9\u8c61\u3002<\/p>\n
\u5f53\u521b\u952e\u4e00\u4e2a\u51fd\u6570\u7684\u65f6\u5019\uff0c\u53d1\u751f\u4e86\u4ec0\u4e48\uff1f<\/p>\n
\u5b9e\u9645\u4e0a\uff0c\u51fd\u6570\u662fFunction\u7c7b\u578b\u7684\u5b9e\u4f8b\uff0c\u6b64\u65f6\u53ef\u4ee5\u628a\u6bcf\u4e00\u4e2a\u521b\u5efa\u51fa\u6765\u7684\u51fd\u6570\uff0c\u5f53\u6210\u662fFunction\u7c7b\u578b\u7684\u5b9e\u4f8b\u5bf9\u8c61\uff0c\u6240\u4ee5\u51fd\u6570\u672c\u8eab\u62e5\u6709\u7684\u5bf9\u8c61\u5c5e\u6027\uff0c\u6765\u6e90\u4e8eFunction\u3002<\/p>\n
Fn.Contructor\u51e0\u4f4dFunction<\/p>\n
\u4f46\u662f\u4e0e\u6b64\u540c\u65f6\u8981\u6ce8\u610f\uff1a
Function.prototype.__proto__===Object.prototype<\/code><\/p>\n\u53ef\u4ee5\u7406\u89e3\u4e3a\uff1a\u6784\u9020\u5668\u51fd\u6570\u7684\u6784\u9020\u51fd\u6570\u662fObject<\/p>\n
\u4e5f\u53ef\u4ee5\u7b80\u5355\u7684\u7406\u89e3\uff1a\u51fd\u6570\u5373\u5bf9\u8c61\u3002<\/p>\n
\u6784\u9020\u51fd\u6570<\/h3>\n
- \n
- \u5728 JavaScript \u4e2d\uff0c\u7528 new \u5173\u952e\u5b57\u6765\u8c03\u7528\u7684\u51fd\u6570\uff0c\u79f0\u4e3a\u6784\u9020\u51fd\u6570\u3002\u6784\u9020\u51fd\u6570\u9996\u5b57\u6bcd\u4e00\u822c\u5927\u5199;<\/li>\n
- \u6784\u9020\u51fd\u6570\u7684\u6267\u884c\u8fc7\u7a0b:<\/li>\n<\/ol>\n
![\"image-20230424221346970\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230424221346970.png\")
<\/p>\n(1) \u5f53\u4ee5 new \u5173\u952e\u5b57\u8c03\u7528\u65f6\uff0c\u4f1a\u521b\u5efa\u4e00\u4e2a\u65b0\u7684\u5185\u5b58\u7a7a\u95f4\uff0c\u6807\u8bb0\u4e3a Animal \u7684\u5b9e\u4f8b;<\/p>\n
(2) \u51fd\u6570\u4f53\u5185\u90e8\u7684 this \u6307\u5411\u8be5\u5185\u5b58,\u6bcf\u5f53\u521b\u5efa\u4e00\u4e2a\u5b9e\u4f8b\u7684\u65f6\u5019\uff0c\u5c31\u4f1a\u521b\u5efa\u4e00\u4e2a\u65b0\u7684\u5185\u5b58\u7a7a\u95f4;<\/p>\n
(3) \u7ed9 this \u6dfb\u52a0\u5c5e\u6027\uff0c\u5c31\u76f8\u5f53\u4e8e\u7ed9\u5b9e\u4f8b\u6dfb\u52a0\u5c5e\u6027;<\/p>\n
(4) \u7531\u4e8e\u51fd\u6570\u4f53\u5185\u90e8\u7684this\u6307\u5411\u65b0\u521b\u5efa\u7684\u5185\u5b58\u7a7a\u95f4\uff0c\u9ed8\u8ba4\u8fd4\u56de this \uff0c\u5c31\u76f8\u5f53\u4e8e\u9ed8\u8ba4\u8fd4\u56de\u4e86\u8be5\u5185\u5b58\u7a7a\u95f4;<\/p>\n
\/\/\u4e3e\u4e2a\u4f8b\u5b50\uff0c\u6211\u4eec\u8981\u5f55\u5165\u4e00\u5e74\u7ea7\u4e00\u73ed\u4e2d\u6bcf\u4e00\u4f4d\u540c\u5b66\u7684\u4e2a\u4eba\u4fe1\u606f\uff0c\u90a3\u4e48\u6211\u4eec\u53ef\u4ee5\u521b\u5efa\u4e00\u4e9b\u5bf9\u8c61\uff1a\nvar p1 = {name: 'zs', age:6, gender: '\u7537', hobby: 'basketball'};\nvar p2 = {name: 'ls', age:6, gender: '\u5973', hobby: 'dancing'};\nvar p3 = {name: 'ww', age:6, gender: '\u5973', hobby: 'singing'};\nvar p4 = {name: 'zl', age:6, gender: '\u7537', hobby: 'football'};\n\/\/\u6211\u4eec\u89c2\u5bdf\u5230\uff0c\u8fd9\u56db\u4e2a\u5bf9\u8c61\u7ed3\u6784\u7c7b\u4f3c\uff0c\u751a\u81f3\u5982\u53c2\u6570age\u4e5f\u662f\u76f8\u540c\u7684\uff0c\u90a3\u4e48\uff0c\u53ef\u4ee5\u4f7f\u7528\u6784\u9020\u51fd\u6570\nfunction Person(name, gender, hobby) {\n this.name = name;\n this.gender = gender;\n this.hobby = hobby;\n this.age = 6\n}\nvar p1 = new Person('zs', '\u7537', 'baketball')<\/code><\/pre>\n\u81ea\u6267\u884c\u533f\u540d\u51fd\u6570<\/h3>\n
\u58f0\u660e\u5f0f\u4f1a\u5bfc\u81f4\u51fd\u6570\u63d0\u5347\uff0cfunction\u4f1a\u88ab\u89e3\u91ca\u5668\u4f18\u5148\u7f16\u8bd1\u3002\u5373\u6211\u4eec\u7528\u58f0\u660e\u5f0f\u5199\u51fd\u6570\uff0c\u53ef\u4ee5\u5728\u4efb\u4f55\u533a\u57df\u58f0\u660e\uff0c\u4e0d\u4f1a\u5f71\u54cd\u6211\u4eec\u8c03\u7528<\/p>\n
\/\/\u58f0\u660e\u5f0f\nfunction XXX() { }<\/code><\/pre>\n\u51fd\u6570\u8868\u8fbe\u5f0f\u51fd\u6570\u8868\u8fbe\u5f0f\u6211\u4eec\u7ecf\u5e38\u4f7f\u7528\uff0c\u800c\u51fd\u6570\u8868\u8fbe\u5f0f\u4e2d\u7684function\u5219\u4e0d\u4f1a\u51fa\u73b0\u51fd\u6570\u63d0\u5347\u3002\u800c\u662fJS\u89e3\u91ca\u5668\u9010\u884c\u89e3\u91ca\uff0c\u5230\u4e86\u8fd9\u4e00\u53e5\u624d\u4f1a\u89e3\u91ca\u3002\u56e0\u6b64\u5982\u679c\u8c03\u7528\u5728\u51fd\u6570\u8868\u8fbe\u5f0f\u4e4b\u524d\uff0c\u5219\u4f1a\u8c03\u7528\u5931\u8d25\u3002<\/p>\n
var fn1 = function(){}\n\nfn1();\n\nfunction fn1(){}\/\/\u53ef\u4ee5\u6b63\u5e38\u8c03\u7528 \n\nfn2();\n\nvar fn2 = function(){}\/\/\u65e0\u6cd5\u8c03\u7528<\/code><\/pre>\n\u533f\u540d\u51fd\u6570\u7c7b\u578b\uff1a<\/p>\n
\/\/\u666e\u901a\u533f\u540d\u51fd\u6570,\u65e0\u8fd4\u56de\u503c\n>(function () {\n alert('\u4f60\u5988\u903c')\n})()\n<undefined\n\/\/\u611f\u53f9\u53f7\u5f00\u5934\uff0c\u8fd4\u56de\u5e03\u5c14\u503c\n>!function () {\n alert('\u4f60\u5988\u903c')\n}()\n<true\n\/\/~function(){}()\n>~function(){}()\n<-1\n\/\/-function(){}()\n>-function(){}()\n<NaN\n\/\/+function(){}()\n>+function(){}()\n<NaN<\/code><\/pre>\n4.JS\u57fa\u7840-\u9762\u5411\u5bf9\u8c61<\/h2>\n
\u5c01\u88c5<\/h3>\n
\u5c01\u88c5<\/strong>\uff1a\u628a\u5ba2\u89c2\u4e8b\u7269\u5c01\u88c5\u6210\u62bd\u8c61\u7684\u7c7b\uff0c\u9690\u85cf\u5c5e\u6027\u548c\u65b9\u6cd5\uff0c\u4ec5\u5bf9\u5916\u516c\u5f00\u63a5\u53e3\u3002<\/p>\n
\u5728ES6\u4e4b\u524d\uff0c\u662f\u4e0d\u5b58\u5728class\u8fd9\u4e2a\u8bed\u6cd5\u7cd6\u7c7b\u7684\u3002\u6240\u4ee5\u5b9e\u73b0\u5927\u591a\u91c7\u7528\u539f\u578b\u5bf9\u8c61\u548c\u6784\u9020\u51fd\u6570<\/p>\n
\u79c1\u6709\u5c5e\u6027\u548c\u65b9\u6cd5<\/strong>\uff1a\u53ea\u80fd\u5728\u6784\u9020\u51fd\u6570\u5185\u8bbf\u95ee\u4e0d\u80fd\u88ab\u5916\u90e8\u6240\u8bbf\u95ee(\u5728\u6784\u9020\u51fd\u6570\u5185\u4f7f\u7528var\u58f0\u660e\u7684\u5c5e\u6027)<\/p>\n
\u516c\u6709\u5c5e\u6027\u548c\u65b9\u6cd5(\u6216\u5b9e\u4f8b\u65b9\u6cd5)<\/strong>\uff1a\u5bf9\u8c61\u5916\u53ef\u4ee5\u8bbf\u95ee\u5230\u5bf9\u8c61\u5185\u7684\u5c5e\u6027\u548c\u65b9\u6cd5(\u5728\u6784\u9020\u51fd\u6570\u5185\u4f7f\u7528this\u8bbe\u7f6e\uff0c\u6216\u8005\u8bbe\u7f6e\u5728\u6784\u9020\u51fd\u6570\u539f\u578b\u5bf9\u8c61\u4e0a\u6bd4\u5982Cat.prototype.xxx)<\/p>\n
\u9759\u6001\u5c5e\u6027\u548c\u65b9\u6cd5<\/strong>\uff1a\u5b9a\u4e49\u5728\u6784\u9020\u51fd\u6570\u4e0a\u7684\u65b9\u6cd5(\u6bd4\u5982Cat.xxx)\uff0c\u4e0d\u9700\u8981\u5b9e\u4f8b\u5c31\u53ef\u4ee5\u8c03\u7528(\u4f8b\u5982Object.assign())<\/p>\n
function Person(name) {\n this.name = name;\n this.sex = 'man';\n var evil = '\u6211\u95ee\u4f60\u5e72\u7239';\n var pickNose = function(){\n console.log('\u6211\u6211\u6211\u6211')\n }\n return name\n}<\/code><\/pre>\n![\"image-20230507110950920\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230507110950920.png\")
<\/p>\n
\n\u5728ES6\u4e4b\u540e\uff0c\u5b58\u5728class\u8fd9\u4e2a\u8bed\u6cd5\u7cd6\u7c7b\u3002\u5f53\u4f60\u4f7f\u7528class\u7684\u65f6\u5019\uff0c\u5b83\u4f1a\u9ed8\u8ba4\u8c03\u7528constructor\u8fd9\u4e2a\u51fd\u6570\uff0c\u6765\u63a5\u6536\u4e00\u4e9b\u53c2\u6570\uff0c\u5e76\u6784\u9020\u51fa\u4e00\u4e2a\u65b0\u7684\u5b9e\u4f8b\u5bf9\u8c61(this)\u5e76\u5c06\u5b83\u8fd4\u56de\uff0c\u56e0\u6b64\u5b83\u88ab\u79f0\u4e3aconstructor\u6784\u9020\u65b9\u6cd5(\u51fd\u6570)\u3002<\/p>\n
\u4ee5\u4e0b\u4e24\u4e2a\u5bf9\u8c61\u7b49\u4ef7\uff08\u7b2c\u4e8c\u4e2a\u547d\u540d\u6709\u95ee\u9898\u554a\uff1f\uff1f\uff09\uff1a<\/p>\n
class Cat{\n constructor(){}\n toString(){}\n toValue(){}\n}\n\nfunction Cat(){}\nCat.prototype = {\n constructor(){}\n toString(){}\n toValue(){}\n}<\/code><\/pre>\n\u7ee7\u627f<\/h3>\n
\u7ee7\u627f<\/strong>\uff1a\u7ee7\u627f\u5c31\u662f\u5b50\u7c7b\u53ef\u4ee5\u4f7f\u7528\u7236\u7c7b\u7684\u6240\u6709\u529f\u80fd\uff0c\u5e76\u4e14\u5bf9\u8fd9\u4e9b\u529f\u80fd\u8fdb\u884c\u6269\u5c55\u3002<\/p>\n
\u6bd4\u5982\u6211\u6709\u4e2a\u6784\u9020\u51fd\u6570A\uff0c\u7136\u540e\u53c8\u6709\u4e2a\u6784\u9020\u51fd\u6570B\uff0c\u4f46\u662fB\u60f3\u8981\u4f7f\u7528A\u91cc\u7684\u4e00\u4e9b\u5c5e\u6027\u548c\u65b9\u6cd5\uff0c\u4e00\u79cd\u529e\u6cd5\u5c31\u662f\u8ba9\u6211\u4eec\u81ea\u8eab\u5316\u8eab\u4e3aCV\u4fa0\uff0c\u590d\u5236\u7c98\u8d34\u4e00\u6ce2\u3002\u8fd8\u6709\u4e00\u79cd\u5c31\u662f\u5229\u7528\u7ee7\u627f\uff0c\u6211\u8ba9B\u76f4\u63a5\u7ee7\u627f\u4e86A\u91cc\u7684\u529f\u80fd\uff0c\u8fd9\u6837\u6211\u5c31\u80fd\u7528\u5b83\u4e86\u3002<\/p>\n
- \n
- \u539f\u578b\u94fe\u7ee7\u627f<\/li>\n
- \u6784\u9020\u7ee7\u627f<\/li>\n
- \u7ec4\u5408\u7ee7\u627f<\/li>\n
- \u5bc4\u751f\u7ec4\u5408\u7ee7\u627f<\/li>\n
- \u539f\u578b\u5f0f\u7ee7\u627f<\/li>\n
- \u5bc4\u751f\u7ee7\u627f<\/li>\n
- \u6df7\u5165\u5f0f\u7ee7\u627f<\/li>\n
- class\u4e2d\u7684extends\u7ee7\u627f<\/li>\n<\/ol>\n
\u539f\u578b\u94fe\u7ee7\u627f\uff1a<\/font><\/h4>\n
function Parent(){\n this.name = 'Parent';\n this.sex = 'box';\n}\n\nfunction Child(){\n this.name = 'Child'\n}\n\nChild.prototype = new Parent()\n\nvar child1 = new Child()<\/code><\/pre>\n![\"image-20230507215444925\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230507215444925.png\")
<\/p>\n![\"image-20230507215520537\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230507215520537.png\")
<\/p>\ninstanceof<\/strong><\/font><\/h4>\n
instanceof<\/code>\u8fd0\u7b97\u7b26\u7528\u4e8e\u68c0\u6d4b\u6784\u9020\u51fd\u6570\u7684prototype\u5c5e\u6027\u662f\u5426\u51fa\u73b0\u5728\u67d0\u4e2a\u5b9e\u4f8b\u5bf9\u8c61\u7684\u539f\u578b\u94fe\u4e0a\u3002<\/p>\nA instanceof B \u5b9e\u4f8b\u5bf9\u8c61A instanceof \u6784\u9020\u51fd\u6570B\u68c0\u6d4bA\u7684\u539f\u578b\u94fe(proto<\/strong>)\u4e0a\u662f\u5426\u6709B.prototype\uff0c\u6709\u5219\u8fd4\u56detrue\uff0c\u5426\u5219\u8fd4\u56defalse<\/p>\n
![\"image-20230507231705911\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230507231705911.png\")
<\/p>\n![\"image-20230507231916595\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230507231916595.png\")
<\/p>\n![\"image-20230507231112399\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230507231112399.png\")
<\/p>\nclass\u4e2d\u7684extends\u7ee7\u627f\uff1a<\/font><\/h4>\n
class PParent{\n constructor(name){\n this.name = name\n }\n getName(){\n console.log(this.name)\n }\n}\nclass CChild extends PParent{\n constructor(name){\n super(name)\n this.sex = 'boy'\n }\n}<\/code><\/pre>\n![\"image-20230507232705915\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230507232705915.png\")
<\/p>\n\u591a\u6001<\/h3>\n
class\u4e2d\u7684\u591a\u6001\uff1aextends\u3001super<\/p>\n
\u591a\u6001\u7684\u5b9e\u9645\u542b\u4e49\u662f\uff1a\u540c\u4e00\u64cd\u4f5c\u4f5c\u7528\u4e8e\u4e0d\u540c\u7684\u5bf9\u8c61\u4e0a\uff0c\u53ef\u4ee5\u4ea7\u751f\u4e0d\u540c\u7684\u89e3\u91ca\u548c\u4e0d\u540c\u7684\u6267\u884c\u7ed3\u679c\u3002<\/p>\n
\u5bf9\u4e8ejs\u591a\u6001\u7684\u8be6\u7ec6\u89e3\u91ca\uff1ahttps:\/\/juejin.cn\/post\/6844904126011146254<\/a><\/p>\n
\/* \ninstanceof\u8fd0\u7b97\u7b26\u7528\u4e8e\u6d4b\u8bd5\u6784\u9020\u51fd\u6570\u7684prototype\u5c5e\u6027\u662f\u5426\u51fa\u73b0\u5728\u5bf9\u8c61\u7684\u539f\u578b\u94fe\u4e2d\u7684\u4efb\u4f55\u4f4d\u7f6e\u3002\n\u7b80\u5355\u7406\u89e3\u4e3a\uff1ainstanceof\u53ef\u4ee5\u68c0\u6d4b\u4e00\u4e2a\u5b9e\u4f8b\u662f\u5426\u5c5e\u4e8e\u67d0\u79cd\u7c7b\u578b\u3002\n\u8fd8\u53ef\u4ee5\u5728\u7ee7\u627f\u5173\u7cfb\u4e2d\u7528\u6765\u5224\u65ad\u4e00\u4e2a\u5b9e\u4f8b\u662f\u5426\u5c5e\u4e8e\u5b83\u7684\u7236\u7c7b\u578b\u3002\n*\/\nfunction makeSound(animal){\n if (animal instanceof Cat){\n console.log("\u55b5\u55b5\u55b5")}\n else if (animal instanceof Dog){\n console.log("\u6c6a\u6c6a\u6c6a")}\n}\nclass Cat{}\nclass Dog{}\nmakeSound(new Cat())\n\/\/ < \u55b5\u55b5\u55b5\nmakeSound(new Dog())\n\/\/ < \u6c6a\u6c6a\u6c6a<\/code><\/pre>\n5. JS\u57fa\u7840-this\u4e0enew<\/h2>\n
![\"5c5943225c1e8ec27ac458e8a272df3\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/5c5943225c1e8ec27ac458e8a272df3.jpg\")
<\/p>\nthis\uff0c\u662f\u6307\u5f53\u524d\u7684\u672c\u8eab\uff0c\u5728\u975e\u4e25\u683c\u6a21\u5f0f\u4e0bthis\u6307\u5411\u7684\u662f\u5168\u5c40\u5bf9\u8c61window\uff0c\u800c\u5728\u4e25\u683c\u6a21\u5f0f\u4e0b\u4f1a\u7ed1\u5b9a\u5230undefined\u3002<\/p>\n
this\u76845\u79cd\u7ed1\u5b9a\u65b9\u5f0f\uff1a<\/p>\n
\u9ed8\u8ba4\u7ed1\u5b9a<\/h4>\n
\u975e\u4e25\u683c\u6a21\u5f0f\u4e0bthis\u6307\u5411\u5168\u5c40\u5bf9\u8c61, \u4e25\u683c\u6a21\u5f0f\u4e0bthis\u4f1a\u7ed1\u5b9a\u5230undefined<\/em><\/strong><\/p>\n
var a = 10;\n\/\/ undefined\nfunction foo() {\n console.log(this.a)\n}\nfoo\n\/* f foo() {\n console.log(this.a)\n} *\/\nfoo()\n\/*\nVM245:2 10\nundefined\n*\/\nwindow.a\n\/\/ 10<\/code><\/pre>\n\u4e25\u683c\u6a21\u5f0f\u4e0b\uff1a<\/p>\n
"use strict"\nvar a = 10;\nfunction foo() {\n console.log('this1', 'this')\n console.log(window.a)\n console.log(this.a)\n}\nconsole.log(window.foo)\nconsole.log('this2', this);\nfoo()<\/code><\/pre>\n\u5f00\u542f\u4e86\u4e25\u683c\u6a21\u5f0f\uff0c\u53ea\u662f\u8bf4\u4f7f\u5f97\u51fd\u6570\u5185\u7684this\u6307\u5411undefined\uff0c\u5b83\u5e76\u4e0d\u4f1a\u6539\u53d8\u5168\u5c40\u4e2dthis\u7684\u6307\u5411\u3002\u56e0\u6b64this1\u4e2d\u6253\u5370\u7684\u662fundefined\uff0c\u800c this2\u8fd8\u662fwindow\u5bf9\u8c61\uff1b\u53e6\u5916\uff0c\u5b83\u4e5f\u4e0d\u4f1a\u963b\u6b62a\u88ab\u7ed1\u5b9a\u5230window\u5bf9\u8c61\u4e0a<\/p>\n
let a = 10;\nconst b = 20;\nfunction foo (){\n console.log(this.a)\n console.log(this.b)\n}\nfoo();\nconsole.log(window.a)<\/code><\/pre>\n![\"image-20230520214003692\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230520214003692.png\")
<\/p>\nvar a = 1;\nfunction foo(){\n var a = 2;\n console.log(this)\n console.log(this.a)\n}\nfoo()<\/code><\/pre>\n![\"image-20230520215146533\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230520215146533.png\")
<\/p>\nvar a = 1;\nfunction foo () {\n var a =2;\n function inner () {\n console.log(this.a)\n }\n inner()\n}\nfoo()<\/code><\/pre>\n![\"image-20230520215728012\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230520215728012.png\")
<\/p>\n\u9690\u5f0f\u7ed1\u5b9a<\/h4>\n
\u5f53\u51fd\u6570\u5f15\u7528\u6709\u4e0a\u4e0b\u6587\u5bf9\u8c61\u65f6, \u5982 obj.foo()\u7684\u8c03\u7528\u65b9\u5f0f, foo\u5185\u7684this\u6307\u5411obj<\/em><\/strong><\/p>\n
function foo () {\n console.log('this.a:', this.a)\n console.log('this:', this)\n}\nvar obj = { a: 1, foo}\nvar a = 2\nobj.foo()\n\/\/ \u76f8\u5f53\u4e8e\uff1a\nvar obj = {\n a :1,\n foo: function () {\n console.log(this.a)\n }\n}\nvar a = 2\nobj.foo()<\/code><\/pre>\n\u8bed\u6cd5\u7cd6\uff1a<\/strong><\/p>\n
var obj == {foo}\n\u7b49\u540c\u4e8e\nvar obj = { foo: foo }<\/code><\/pre>\n\u9690\u5f0f\u4e22\u5931\uff1a<\/font><\/strong>\u9690\u5f0f\u4e22\u5931\u5176\u5b9e\u5c31\u662f\u88ab\u9690\u5f0f\u7ed1\u5b9a\u7684\u51fd\u6570\u5728\u7279\u5b9a\u7684\u60c5\u51b5\u4e0b\u4f1a\u4e22\u5931\u7ed1\u5b9a\u5bf9\u8c61\u3002<\/p>\n
\u4e24\u79cd\u60c5\u51b5\uff1a<\/p>\n
1.\u4f7f\u7528\u53e6\u4e00\u4e2a\u53d8\u91cf\u6765\u7ed9\u51fd\u6570\u8d77\u522b\u540d\uff0c\u5c06\u51fd\u6570\u4f5c\u4e3a\u53c2\u6570\u4f20\u9012\u65f6\u4f1a\u88ab\u9690\u5f0f\u8d4b\u503c\uff0c\u56de\u8c03\u51fd\u6570\u4e22\u5931this\u7ed1\u5b9a\u3002<\/p>\n
function foo () {\n console.log(this.a)\n};\nvar obj = { a: 1, foo};\nvar a = 2;\nvar foo2 = obj.foo;\n\nobj.foo();\nfoo2();<\/code><\/pre>\n![\"image-20230520221713128\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230520221713128.png\")
<\/p>\n\u539f\u56e0\uff1a\u867d\u7136foo2 \u6307\u5411obj.foo\uff0c\u4f46\u662f\u8c03\u7528\u7684\u65f6\u5019\u662fwindow\u5bf9\u8c61\u5728\u8c03\u7528\uff0c\u6240\u4ee5this\u7684\u6307\u5411\u4e5f\u662fwindow\u5728\u4f7f\u7528\uff0c\u5373this.a\u7b49\u540c\u4e8ewindow.a<\/p>\n
\u4e0b\u4e00\u4e2a\u4f8b\u9898\uff1a<\/strong><\/p>\n
function foo () {\n console.log(this.a)\n};\nvar obj = { a: 1, foo };\nvar a = 2;\nvar foo2 = obj.foo;\nvar obj2 = { a:3, foo2: obj.foo }\nobj.foo();\nfoo2();\nobj2.foo2();<\/code><\/pre>\n\u731c\u4e00\u4e0b\uff1f<\/p>\n
obj.foo(); --> 1
\nfoo2(); --> 2
\nobj2.foo2(); --> 3<\/p>\n![\"image-20230521003652226\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230521003652226.png\")
<\/p>\n\u54e6\uff0c\u8499\u5bf9\u4e86\u55f7\uff01\u6d41\u6279\u3002<\/p>\n
\u539f\u56e0\uff1a<\/strong><\/p>\n
- \n
- obj.foo()\u4e2d\u7684this\u6307\u5411\u8c03\u7528\u8005obj;<\/li>\n
- foo2()\u53d1\u751f\u4e86\u9690\u5f0f\u4e22\u5931\uff0c\u8c03\u7528\u8005\u662fwindow\uff0c\u4f7f\u5f97foo()\u4e2d\u7684this\u6307\u5411window;<\/li>\n
- foo3()\u53d1\u751f\u4e86\u9690\u5f0f\u4e22\u5931\uff0c\u8c03\u7528\u8005\u662fobj2,\u4f7f\u5f97foo()\u4e2d\u7684this\u6307\u5411obj2<\/li>\n<\/ul>\n
\u4e0b\u4e00\u4e2a\u4f8b\u9898\uff1a<\/strong><\/p>\n
function foo () {\n console.log(this.a)\n}\nfunction doFoo (fn) {\n console.log(this)\n fn()\n}\nvar obj = { a: 1, foo }\nvar a = 2\ndoFoo(obj.foo)<\/code><\/pre>\n\u5f00\u59cb\u731c\uff1a<\/p>\n
\u6211\u731c\u662f 2\uff0c\u5c40\u57df\u53d8\u91cf\u7684\u5e94\u8be5\u662f\u4ecedoFoo\u5f00\u59cb\u7684\uff0c\u6b64\u5904\u6ca1\u6709\u4f20\u5165(\u5b9a\u4e49)a\u7684\u503c\uff0c\u6240\u4ee5a\u5e94\u8be5\u662fwindow.a=2,\u540e\u9762\u6253\u5370\u503c\u5e94\u8be5\u4e5f\u662f\u8fd9\u4e2a\u503c<\/p>\n
![\"image-20230521004839415\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230521004839415.png\")
<\/p>\n\u4e0b\u4e00\u4e2a\u4f8b\u9898\uff1a<\/strong><\/p>\n
function foo () {\n console.log(this.a)\n}\nfunction doFoo (fn) {\n console.log(this)\n fn()\n}\nvar obj = { a: 1, foo }\nvar a = 2\nvar obj2 = { a: 3, doFoo }\nobj2.doFoo(obj.foo)<\/code><\/pre>\n\u662f3\u5457\uff1f<\/p>\n
\u6211\u9760\u6041\u5a18... ...<\/p>\n
\u6211\u4eec\u6253\u5370\u4e2a\u8be6\u7ec6\u7684\u770b\u770b\u7ed3\u679c\uff1a<\/p>\n
![\"image-20230521005559685\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230521005559685.png\")
<\/p>\n\u6253\u53703\u662fdoFoo\u5e72\u7684\uff0c\u6b64\u65f6\u8fd8\u6253\u5370\u4e86this,\u663e\u793a\u7684\u503c\u5c31\u662f\u4e0a\u9762\u56fe\u4e2d\u7684\u5bf9\u8c61\uff0c\u53ef\u89c1a\u5c31\u662f3\uff1b<\/p>\n
\u6253\u53702\u662fobj.foo\u5e72\u7684\uff0c\u6b64\u65f6\u7684this\u5df2\u7ecf\u662fwindow\u5bf9\u8c61\u4e86\uff0c\u6253\u5370a\u5c31\u662f2\uff0c\u4e0d\u884c\u89c1\u56fe\uff1a<\/p>\n
![\"image-20230521005856560\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230521005856560.png\")
<\/p>\n\u603b\u7ed3\uff1a<\/strong><\/p>\n
\u6240\u4ee5\u8bf4\uff0c\u5982\u679c\u4f60\u628a\u4e00\u4e2a\u51fd\u6570\u5f53\u6210\u53c2\u6570\u4f20\u9012\u5230\u53e6\u4e00\u4e2a\u51fd\u6570\u7684\u65f6\u5019\uff0c\u4e5f\u4f1a\u53d1\u751f\u9690\u5f0f\u4e22\u5931\u7684\u95ee\u9898\uff0c\u4e14\u4e0e\u5305\u88f9\u7740\u5b83\u7684\u51fd\u6570\u7684this\u6307\u5411\u65e0\u5173\u3002\u5728\u975e\u4e25\u683c\u6a21\u5f0f\u4e0b\uff0c\u4f1a\u628a\u8be5\u51fd\u6570\u7684this\u7ed1\u5b9a\u5230window\u4e0a\uff0c\u4e25\u683c\u6a21\u5f0f\u4e0b\u7ed1\u5b9a\u5230undefined\u3002<\/p>\n
\u663e\u793a\u7ed1\u5b9a<\/h4>\n
\u901a\u8fc7call()\u6216\u8005apply()\u65b9\u6cd5\u76f4\u63a5\u6307\u5b9athis\u7684\u7ed1\u5b9a\u5bf9\u8c61, \u5982foo.call(obj)<\/em><\/strong><\/p>\n
call, apply, bind<\/strong><\/p>\n
- \n
- \u90fd\u662f\u5bf9\u51fd\u6570\u7684\u64cd\u4f5c\uff0c\u4f7f\u7528\u65b9\u5f0f\uff1a\u51fd\u6570.call<\/li>\n
- \u90fd\u662f\u7528\u6765\u6539\u53d8\u51fd\u6570\u7684 this \u5bf9\u8c61\u7684\u6307\u5411\u7684\u3002<\/li>\n
- \u7b2c\u4e00\u4e2a\u53c2\u6570\u90fd\u662f this \u8981\u6307\u5411\u7684\u5bf9\u8c61\u3002<\/li>\n
- \u90fd\u53ef\u4ee5\u5229\u7528\u540e\u7eed\u53c2\u6570\u4f20\u53c2\u3002<\/li>\n
- call \u63a5\u53d7\u51fd\u6570\u4f20\u53c2\u65b9\u5f0f\u4e3a\uff1afn.call(this, 1, 2, 3)<\/li>\n
- apply \u63a5\u53d7\u51fd\u6570\u4f20\u53c2\u65b9\u5f0f\u4e3a\uff1afn.apply(this,[1, 2, 3])<\/li>\n
- bind \u7684\u8fd4\u56de\u503c\u4e3a\u4e00\u4e2a\u65b0\u7684\u51fd\u6570\uff0c\u9700\u8981\u518d\u6b21\u8c03\u7528\uff1a fn.bind(this)(1, 2, 3)<\/li>\n<\/ol>\n
\u4e09\u70b9\u7279\u6027\uff1a<\/p>\n
- \n
- \n
\u4f7f\u7528
.call()<\/code>\u6216\u8005.apply()<\/code>\u7684\u51fd\u6570\u662f\u4f1a\u76f4\u63a5\u6267\u884c\u7684\uff1b<\/p>\n<\/li>\n- \n
bind()<\/code>\u662f\u521b\u5efa\u4e00\u4e2a\u65b0\u7684\u51fd\u6570\uff0c\u9700\u8981\u624b\u52a8\u8c03\u7528\u624d\u4f1a\u6267\u884c\uff1b<\/p>\n<\/li>\n- \n
.call()<\/code>\u548c.apply()<\/code>\u7528\u6cd5\u57fa\u672c\u7c7b\u4f3c\uff0c\u4e0d\u8fc7call\u63a5\u53d7\u82e5\u5e72\u4e2a\u53c2\u6570\uff0c\u800capply\u63a5\u53d7\u7684\u662f\u4e00\u4e2a\u6570\u7ec4<\/p>\n.call(this, 1, 2, 3, 4, 5)\n.apply(this, [1, 2, 3, 4, 5])<\/code><\/pre>\n<\/li>\n<\/ol>\n\u53ef\u4ee5\u770b\u4e0b\u83dc\u9e1f\u6559\u7a0b\u548cW3C\u7684\u6559\u7a0b\uff1a<\/p>\n
JavaScript \u51fd\u6570\u8c03\u7528 | \u83dc\u9e1f\u6559\u7a0b (runoob.com)<\/a><\/p>\n
JavaScript \u51fd\u6570 Call (w3school.com.cn)<\/a><\/p>\n
JavaScript \u51fd\u6570 Apply (w3school.com.cn)<\/a><\/p>\n
- \n
- \n
- \n
- \n
- \n
- \n
- \n
![\"image-20230521014221082\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230521014221082.png\")
<\/p>\n![\"image-20230521015330342\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230521015330342.png\")
<\/p>\n![\"image-20230521224845565\"](\"https:\/\/lemon-guess.oss-cn-hangzhou.aliyuncs.com\/img\/image-20230521224845565.png\")
<\/p>\n