{"id":1876,"date":"2014-11-18T16:22:04","date_gmt":"2014-11-18T08:22:04","guid":{"rendered":"https:\/\/yimity.com\/?p=1876"},"modified":"2014-11-21T09:05:25","modified_gmt":"2014-11-21T01:05:25","slug":"object_oriented_javascript","status":"publish","type":"post","link":"https:\/\/yimity.com\/2014\/11\/18\/object_oriented_javascript.html","title":{"rendered":"javascript \u9762\u5411\u5bf9\u8c61\u7f16\u7a0b"},"content":{"rendered":"<p>\u9762\u5411\u5bf9\u8c61\u7f16\u7a0b<\/p>\n<h3>\u5c01\u88c5<\/h3>\n<p>\u5bf9\u8c61\u751f\u6210\u7684\u539f\u59cb\u6a21\u5f0f<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nvar Cat = {\r\n    name  : '',\r\n    color : ''\r\n}\r\n<\/pre>\n<p>\u7136\u540e\u751f\u6210\u5b9e\u4f8b\u5bf9\u8c61\uff0c<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nvar cat1 = {}\uff1b\r\n\r\ncat1.name = '\u5927\u6bdb';\r\ncat1.color = '\u9ec4\u8272';\r\n\r\nvar cat2 = {};\r\n\r\ncat2.name = '\u4e8c\u6bdb';\r\ncat2.color = '\u9ed1\u8272';\r\n<\/pre>\n<p>\u5f88\u7b80\u5355\uff0c\u4f46\u95ee\u9898\u662f\uff0c\u8fd9\u6837\u751f\u6210\u7684\u201c\u5b9e\u4f8b\u5bf9\u8c61\u201d\u5176\u5b9e\u548c\u539f\u578b\u5bf9\u8c61\u4e4b\u95f4\u57fa\u672c\u6ca1\u6709\u4efb\u4f55\u8054\u7cfb\u3002\u800c\u4e14\u751f\u6210\u591a\u4e2a\u5b9e\u4f8b\u7684\u65f6\u5019\uff0c\u6ca1\u6709\u7b80\u6d01\u7684\u65b9\u6cd5\uff0c\u4f1a\u975e\u5e38\u9ebb\u70e6\u3002<\/p>\n<p>\u539f\u59cb\u6a21\u5f0f\u7684\u6539\u8fdb<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nfunction Cat(name,color){\r\n    return {\r\n        name  : name,\r\n        color : color\r\n    }\r\n}\r\n<\/pre>\n<p>\u7136\u540e\u751f\u6210\u5b9e\u4f8b\u5bf9\u8c61\uff0c\u4f46\u5176\u5b9e\u5c31\u7b49\u4e8e\u5728\u8c03\u7528\u51fd\u6570\uff0c\u8fd4\u56de\u4e00\u4e2a\u5bf9\u8c61\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nvar cat1 = Cat('\u5927\u6bdb','\u9ec4\u8272');\r\nvar cat2 = Cat('\u4e8c\u6bdb','\u9ed1\u8272');\r\n<\/pre>\n<p>\u8fd9\u79cd\u95ee\u9898\u662f\uff0c\u5982\u679c Cat \u4e2d\u4e0d\u8fdb\u884c\u989d\u5916\u7684\u5904\u7406\uff0c\u8fd9\u91cc\u4ecd\u65e7\u4e0d\u80fd\u53cd\u6620\u51fa\u6765 cat1 \u548c cat2 \u5185\u5728\u7684\u8054\u7cfb\u3002<\/p>\n<p>\u6784\u9020\u51fd\u6570\u6a21\u5f0f<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nfunction Cat(name,color){\r\n    this.name = name;\r\n    this.color = color;\r\n}\r\n<\/pre>\n<p>\u73b0\u5728\u5c31\u53ef\u4ee5\u751f\u6210\u5b9e\u4f8b\u5bf9\u8c61\u4e86\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nvar cat1 = new Cat('\u5927\u6bdb','\u9ec4\u8272');\r\nvar cat2 = new Cat('\u4e8c\u6bdb','\u9ed1\u8272');\r\n<\/pre>\n<p>\u8fd9\u65f6 cat1 \u548c cat2 \u4f1a\u81ea\u52a8\u542b\u6709\u4e00\u4e2a constructor \u5c5e\u6027\uff0c\u6307\u5411\u4ed6\u4eec\u7684\u6784\u9020\u51fd\u6570\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nconsole.log(cat1 instanceof Cat); \/\/true\r\nconsole.log(cat2 instanceof Cat); \/\/true\r\n<\/pre>\n<p>\u4f46\u6b64\u65f6\u8fd9\u79cd\u65b9\u5f0f\u4ecd\u65e7\u5b58\u5728\u5176\u56fa\u6709\u7684\u95ee\u9898\u3002\u5047\u8bbe\u8fd9\u91cc\u6709\u4e00\u4e2a\u65b9\u6cd5\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nfunction Cat(name,color){\r\n    this.name = name;\r\n    this.color = color;\r\n    this.type = '\u732b\u79d1\u52a8\u7269';\r\n    this.eat = function(){console.log('\u5403\u8001\u9f20');}\r\n}\r\n<\/pre>\n<p>\u751f\u6210\u5b9e\u4f8b<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nvar cat = Cat('\u5927\u6bdb','\u9ec4\u8272');\r\nconsole.log(cat.type); \/\/ \u732b\u79d1\u52a8\u7269\r\ncat.eat(); \/\/ \u5403\u8001\u9f20\u3002\r\n<\/pre>\n<p>\u8868\u9762\u4e0a\u6ca1\u4ec0\u4e48\u95ee\u9898\uff0c\u7528\u7684\u65f6\u5019\u4e5f\u5f88\u597d\u7528\uff0c\u4f46\u662f\u5047\u5982\u6211\u4eec\u9700\u8981\u751f\u6210\u5927\u91cf\u7684 Cat \u7684\u5b9e\u4f8b\uff0c\u90a3\u4e48\u6bcf\u4e2a\u5b9e\u4f8b\u90fd\u4f1a\u6709 type \u5c5e\u6027\u548c eat \u65b9\u6cd5\uff0c\u800c\u4e14\u8fd9\u4e24\u4e2a\u90fd\u662f\u4e00\u6478\u4e00\u6837\u7684\u5185\u5bb9\uff0c\u5bfc\u81f4\u4e86\u5185\u5b58\u7684\u6d6a\u8d39\uff0c\u56e0\u4e3a\u6b64\u65f6\u4e24\u4e2a\u5b9e\u4f8b\u7684\u76f8\u540c\u5c5e\u6027\u548c\u65b9\u6cd5\uff0c\u5e76\u4e0d\u662f\u540c\u6837\u7684\u5185\u5b58\u5730\u5740\u3002\u4f1a\u5b58\u5728\u591a\u4efd\u3002<\/p>\n<p>\u90a3\u4e48\uff0c\u80fd\u4e0d\u80fd\u5c06\u6240\u6709\u7684\u76f8\u540c\u7684\u5c5e\u6027\u548c\u65b9\u6cd5\u53ea\u5b58\u5728\u4e00\u4efd\uff0c\u7136\u540e\u6bcf\u4e2a\u5b9e\u4f8b\u540c\u6837\u7684\u4e5f\u53ef\u4ee5\u4f7f\u7528\u5462\uff1f\u7b54\u6848\u80af\u5b9a\u662f\u53ef\u4ee5\u7684\u3002<\/p>\n<p>prototype \u6a21\u5f0f<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nfunction Cat(name,color){\r\n    this.name = name;\r\n    this.color = color;\r\n}\r\n\r\nCat.prototype.type = '\u732b\u79d1\u52a8\u7269';\r\ncat.prototype.eat = function(){console.log('\u5403\u8001\u9f20');}\r\n<\/pre>\n<p>\u8fd9\u65f6\u5019\uff0c<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nvar cat1 = new Cat('\u5927\u6bdb','\u9ec4\u8272');\r\nvar cat2 = new Cat('\u4e8c\u6bdb','\u9ed1\u8272');\r\n<\/pre>\n<p>\u6b64\u65f6\uff0c\u518d\u591a\u7684\u5b9e\u4f8b\u5bf9\u8c61\uff0c\u5176 type \u5c5e\u6027\u548c eat \u65b9\u6cd5\u90fd\u6307\u5411\u7684\u662f\u540c\u4e00\u4efd\uff0c\u4e5f\u5373\u76f8\u540c\u7684\u5185\u5b58\u5730\u5740\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nconsole.log(cat1.eat === cat2.eat); \/\/true\r\n<\/pre>\n<p>prototype \u6a21\u5f0f\u7684\u9a8c\u8bc1\u65b9\u6cd5<\/p>\n<p>\u4e3a\u4e86\u914d\u5408 prototype \u6a21\u5f0f\uff0c javascript \u5b9a\u4e49\u4e86\u4e00\u4e9b\u8f85\u52a9\u65b9\u6cd5\uff0c\u5e2e\u52a9\u6211\u4eec\u66f4\u65b9\u4fbf\u7684\u4f7f\u7528\u5b83\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nisPrototypeOf()\r\n<\/pre>\n<p>\u8fd9\u4e2a\u65b9\u6cd5\u7528\u6765\u5224\u65ad\uff0c\u67d0\u4e2a prototype \u5bf9\u8c61\u548c\u67d0\u4e2a\u5b9e\u4f8b\u4e4b\u95f4\u7684\u5173\u7cfb\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nconsole.log(Cat.prototype.isPrototypeOf(cat1)); \/\/true\r\n<\/pre>\n<p>hasOwnProperty()<br \/>\n\u6b21\u65b9\u6cd5\u7528\u6765\u5224\u65ad\u67d0\u4e2a\u5c5e\u6027\u5230\u5e95\u662fprototype \u5bf9\u8c61\u7684\u5c5e\u6027\u8fd8\u662f\u7c7b\u5b9a\u4e49\u7684(\u672c\u5730\u5c5e\u6027)\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nconsole.log(cat1.hasOwnProperty('name')); true\r\nconsole.log(cat1.hasOwnProperty('type')); false\r\n<\/pre>\n<p>in \u8fd0\u7b97\u7b26<\/p>\n<p>\u6b64\u8fd0\u7b97\u7b26\u7528\u6765\u5224\u65ad\u67d0\u4e2a\u5c5e\u6027\u662f\u4e0d\u662f\u5b58\u5728\u4e8e\u67d0\u4e2a\u5b9e\u4f8b\u4e2d\uff0c\u5373\u67d0\u4e2a\u5b9e\u4f8b\u662f\u5426\u5305\u542b\u67d0\u4e2a\u5c5e\u6027\uff0c\u4e0d\u7ba1\u662f\u672c\u5730\u8fd8\u662f\u7ee7\u627f\u81ea prototype<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nconsole.log(\"name\" in cat1); \/\/ true\r\nconsole.log('type' in cat1); \/\/ true\r\nconsole.log('typo' in cat1); \/\/ false\r\n<\/pre>\n<p>in \u8fd0\u7b97\u7b26\u8fd8\u53ef\u4ee5\u7528\u6765\u904d\u5386\u5bf9\u8c61\u7684\u5c5e\u6027\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nfor(var key in cat1){\r\n    console.log('cat1[' + key ' ]=' + cat1[key]);\r\n}\r\n<\/pre>\n<p>\u5f53\u7136\u5728\u904d\u5386\u7684\u65f6\u5019\u53ef\u4ee5\u4f7f\u7528 hasOwnProperty() \u6765\u9650\u5236\u8f93\u51fa\u7684\u5c5e\u6027\u3002<\/p>\n<p><!--nextpage--><\/p>\n<h3>\u6784\u9020\u51fd\u6570\u7684\u7ee7\u627f<\/h3>\n<p>\u672c\u4f8b\u4e3b\u8981\u4ecb\u7ecd\u5bf9\u8c61\u4e4b\u95f4 \u7ee7\u627f \u7684\u4e94\u79cd\u65b9\u6cd5<\/p>\n<p>\u4f8b\u5982\uff1a<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nfunction Animal(){\r\n\tthis.species = '\u52a8\u7269';\r\n}\r\n<\/pre>\n<p>\u8fd8\u6709\u4e00\u4e2a \u732b \u5bf9\u8c61\u7684\u6784\u9020\u51fd\u6570<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nfunction Cat(name,color){\r\n\tthis.name  = name;\r\n\tthis.color = color;\r\n}\r\n<\/pre>\n<p>\u4f46\u662f\u732b\u4e5f\u5c5e\u4e8e\u52a8\u7269\uff0c\u5982\u4f55\u8ba9\u732b\u6765\u7ee7\u627f\u52a8\u7269\u800c\u4e0d\u91cd\u5199 Cat \u51fd\u6570\u5462\uff1f<\/p>\n<p>\u65b9\u6cd5\u4e00\uff1a\u6784\u9020\u51fd\u6570\u7ed1\u5b9a<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nfunction Cat(name,color){\r\n\tAnimal.apply(this,anguments);\r\n\tthis.name  = name;\r\n\tthis.color = color;\r\n}\r\n\r\ncar cat1 = new Cat(\"\u5927\u6bdb\",\"\u9ec4\u8272\");\r\nconsole.log(cat1.species);  \/\/ \u52a8\u7269\r\n<\/pre>\n<p>\u65b9\u6cd5\u4e8c\uff1aprototype \u6a21\u5f0f<br \/>\n\u5982\u679c \u732b \u7684 prototype \u5bf9\u8c61\uff0c\u6307\u5411\u4e00\u4e2a Animal \u7684\u5b9e\u4f8b\uff0c\u90a3\u4e48\u6240\u6709 \u732b \u7684\u5b9e\u4f8b\uff0c\u90fd\u7ee7\u627f\u4e86 Animal \u4e86\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nCat.prototype = new Animal();\r\nCat.prototype.constructor = Cat;\r\n\r\nvat cat1 = new Cat(\"\u5927\u6bdb\",\"\u9ec4\u8272\");\r\nconsole.log(cat1.species);   \/\/ \u52a8\u7269\r\n<\/pre>\n<p>\u4ee3\u7801\u7684\u7b2c\u4e00\u884c\uff0c\u5c06 Cat \u7684 prototype \u5bf9\u8c61\u6307\u5411\u4e00\u4e2a Animal \u5b9e\u4f8b\uff0c\u5b83\u76f8\u5f53\u4e8e\u5b8c\u5168\u66ff\u6362\u4e86 prototype \u4e4b\u524d\u7684\u503c\uff0c\u6240\u4ee5\uff0c\u9700\u8981\u5728\u7b2c\u4e8c\u884c\u5c06 Cat \u7684 prototype \u5c5e\u6027\u7684 constructor \u5c5e\u6027\u91cd\u7f6e\u56de\u6765\u3002\u56e0\u4e3a cat1 \u8fd9\u79cd\u5b9e\u4f8b\u4e5f\u6709 constructor \u5c5e\u6027\uff0c\u5176 constructor \u5c5e\u6027\u5e94\u8be5\u4e3a Cat\uff08\u9ed8\u8ba4\u8c03\u7528prototype\u5bf9\u8c61\u7684constructor\u5c5e\u6027\uff09, \u4f46\u662f\u5982\u679c\u4e0d\u624b\u52a8\u91cd\u7f6e\u56de\u6765\u7684\u8bdd\uff0cCat \u4e22\u5931\u4e86\u81ea\u5df1\u7684 constructor \u5c5e\u6027\uff0c\u5219\u4f1a\u7ee7\u7eed\u987a\u7740\u539f\u578b\u94fe\u67e5\u627e\uff0c\u627e\u5230 Animal \uff0c\u5219\u5bfc\u81f4\u4e86 cat1 \u7684 \u539f\u578b\u7684 constructor \u5c5e\u6027\u6210\u4e3a\u4e86 Animal \u800c\u4e0d\u662f\u539f\u672c\u7684 Cat\uff0c\u6240\u4ee5\u4f1a\u5bfc\u81f4\u7ee7\u627f\u94fe\u7684\u7d0a\u4e71\u3002<\/p>\n<p>\u6240\u4ee5\uff0c\u5728\u8fdb\u884c\u539f\u578b\u94fe\u7ee7\u627f\u7684\u65f6\u5019\uff0c\u5982\u679c\u91cd\u5199\u4e86\u539f\u578b\u5c5e\u6027\u4e4b\u540e\uff0c\u5219\u4e00\u5b9a\u8981\u91cd\u7f6e\u56de\u6765\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\no.prototype = {};\r\no.prototype.consrtuctor = o;\r\n<\/pre>\n<p>\u65b9\u6cd5\u4e09\uff1a \u76f4\u63a5\u96c6\u6210 prototype<br \/>\n\u8fd9\u662f\u5bf9\u65b9\u6cd5\u4e8c\u7684\u8865\u5145\uff0c\u7531\u4e8e Animal \u4e2d\uff0c\u4e0d\u53d8\u7684\u65b9\u6cd5\uff0c\u90fd\u53ef\u4ee5\u5199\u5165 Animal.prototype \u4e2d\uff0c\u6240\u4ee5\u6211\u4eec\u53ef\u4ee5\u76f4\u63a5\u7ee7\u627f Animal.prototype <\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nfunction Animal(){}\r\nAnimal.prototype.species = \"\u52a8\u7269\";\r\n\r\nCat.prototype = Animal.prototype;\r\nCat.prototype.constructor = Cat;\r\n\r\nvar cat1 = new Cat(\"\u5927\u6bdb\",\"\u9ec4\u8272\");\r\nconsole.log(cat1.species);  \/\/ \u52a8\u7269\r\n<\/pre>\n<p>\u7531\u4e8e\u4e0d\u7528\u5efa\u7acb\u548c\u6267\u884c Animal \u7684\u5b9e\u4f8b\u4e86\uff0c\u6240\u4ee5\u6548\u7387\u8f83\u9ad8\uff0c\u4e5f\u6bd4\u8f83\u7701\u5185\u5b58\uff0c\u4f46\u662f\u7531\u4e8e\u5bf9\u8c61\u662f\u5f15\u7528\u7684\uff0c\u6240\u4ee5 Cat.prototype \u548c Animal.prototype \u6307\u5411\u4e86\u540c\u4e00\u4e2a\u5bf9\u8c61\uff0c\u6240\u4ee5\uff0c\u5bf9\u4e24\u8005\u4efb\u4e00\u8fdb\u884c\u5c31\u6539\uff0c\u5c31\u4f1a\u53cd\u6620\u5230\u53e6\u4e00\u8005\u4e0a\u3002\u6240\u4ee5 \u5bf9 Cat \u7684 constructor \u7684\u4fee\u6539\uff0c\u5176\u5b9e\u4e5f\u4fee\u6539\u4e86 Animal \u7684 constructor \u5bf9\u8c61\u3002<\/p>\n<p>\u65b9\u6cd5\u56db\uff1a\u5229\u7528\u7a7a\u5bf9\u8c61\u4f5c\u4e3a\u4e2d\u4ecb<\/p>\n<p>\u8fd9\u4e5f\u662f\u96c6\u5408\u4e86\u524d\u4e24\u79cd\u65b9\u6cd5\u7684\u4f18\u70b9\uff0c\u4e5f\u907f\u514d\u4e86\u7f3a\u70b9\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nvar F = function(){};\r\nF.prototype = Animal.prototype;\r\nCat.prototype = new F();\r\nCat.prototype.constructor  = Cat;\r\n<\/pre>\n<p>\u7531\u4e8e F \u662f\u7a7a\u5bf9\u8c61\uff0c\u5176\u672c\u8eab\u548c\u5b9e\u4f8b\u51e0\u4e4e\u4e0d\u5360\u5185\u5b58\uff0c\u800c Cat.prototype \u7ee7\u627f\u81ea F \u7684\u5b9e\u4f8b\uff0c\u6240\u4ee5\u4fee\u6539 Cat.prototype \u5bf9\u8c61\uff0c\u4e5f\u4e0d\u4f1a\u5f71\u54cd\u5230 Animal \u7684 prototype \u5bf9\u8c61<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nconsole.log(Animal.prototype.constructor);  \/\/ Animal\r\n<\/pre>\n<p>\u4e3a\u4e86\u65b9\u4fbf\u4f7f\u7528\uff0c\u5c06\u4e0a\u9762\u7684\u65b9\u5f0f\uff0c\u5c01\u88c5\u4e3a\u4e00\u4e2a\u901a\u7528\u51fd\u6570\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nfunction extend(Child,Parent){\r\n\tvar F = function(){};\r\n\tF.prototype = Parent.prototype;\r\n\tChild.prototype = new F();\r\n\tchild.prototype.constructor = Child;\r\n\tChild.uber = Parent.prototype;\r\n}\r\n<\/pre>\n<p>\u4f7f\u7528\u7684\u65f6\u5019\uff0c\u65b9\u6cd5\u5982\u4e0b\uff1a<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nextend(Cat,Animal);\r\n\r\nvar cat1 = new Cat(\"\u5927\u6bdb\",\"\u9ec4\u8272\");\r\nconsole.log(cat1.species);   \/\/ \u52a8\u7269\r\n<\/pre>\n<p>\u8fd9\u4e2a extend \u51fd\u6570\uff0c\u5c31\u662f YUI \u5e93\u4f7f\u7528\u7684\u5bf9\u8c61\u7ee7\u627f\u65b9\u6cd5\uff0c\u8c8c\u4f3c\u4e5f\u662f\u5927\u795e\u9053\u683c\u62c9\u65af\u53d1\u660e\u7684\u3002<\/p>\n<p>\u5fc5\u8981\u8bf4\u660e\u7684\u4e00\u70b9\u662f\u6b64\u51fd\u6570\u6700\u540e\u4e00\u53e5<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nChild.uber = Parent.prototype;\r\n<\/pre>\n<p>\u7b49\u4e8e\u7ed9\u5b50\u5bf9\u8c61\uff0c\u8c03\u7528\u7ee7\u627f\u7684\u7236\u5bf9\u8c61\u7684\u65b9\u6cd5\u5f00\u8f9f\u4e86\u4e00\u4e2a\u5feb\u6377\u901a\u9053\uff0c\u540c\u65f6\uff0c\u5982\u679c\u5b50\u5bf9\u8c61\u6709\u540c\u540d\u7684\u65b9\u6cd5\u8986\u76d6\u4e86\u7236\u5bf9\u8c61\u7684\u65b9\u6cd5\uff0c\u901a\u8fc7\u8fd9\u79cd\u65b9\u6cd5\u4e5f\u53ef\u4ee5\u8c03\u7528\u3002<\/p>\n<p>\u65b9\u6cd5\u4e94\uff1a\u62f7\u8d1d\u7ee7\u627f<\/p>\n<p>\u4ee5\u4e0a\u96c6\u4e2d\u65b9\u6cd5\u90fd\u662f\u91c7\u7528\u539f\u578b\u94fe\u7684\u65b9\u5f0f\u5b9e\u73b0\u7684\u7ee7\u627f\uff0c\u90a3\u4e48\u5982\u679c\u628a\u8981\u7ee7\u627f\u7684\u7236\u5bf9\u8c61\u7684\u65b9\u6cd5\uff0c\u90fd\u62f7\u8d1d\u8fdb\u5b50\u5bf9\u8c61\uff0c\u90a3\u4e48\u4e5f\u53ef\u4ee5\u8bf4\u5b9e\u73b0\u4e86\u7ee7\u627f\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nfunction Animal(){}\r\nAnimal.prototype.species = \"\u52a8\u7269\";\r\n<\/pre>\n<p>\u518d\u5199\u4e00\u4e2a\u51fd\u6570\uff0c\u76ee\u7684\u662f\u5b9e\u73b0\u5bf9\u8c61\u5c5e\u6027\u548c\u65b9\u6cd5\u7684\u62f7\u8d1d\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nfunction extend2(Child,Parent){\r\n\tvar p = Parent.prototype,\r\n\t\tc = Child.prototype;\r\n\t\t\r\n\tfor(var key in p){\r\n\t\tc[key] = p[key]\r\n\t}\r\n\tc.uber = p;\r\n}\r\n<\/pre>\n<p>\u5bf9\u4e8e\u6b64\u51fd\u6570\uff0c\u5373\u5c06\u7236\u5bf9\u8c61\u7684\u5c5e\u6027\uff0c\u8d4b\u503c\u7ed9\u540c\u540d\u7684\u5b50\u5bf9\u8c61\u3002<\/p>\n<p>\u4f7f\u7528\u65b9\u6cd5\uff1a<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\nextend2(Cat,Animal);\r\nvar cat1 = new Cat(\"\u5927\u6bdb\",\"\u9ec4\u8272\");\r\nconsole.log(cat1.species);   \/\/ \u52a8\u7269\r\n<\/pre>\n<p>\u5176\u5b9e\u5bf9\u4e8e\u6b64\u51fd\u6570\u6765\u8bf4\uff0c\u8fd9\u91cc\u5982\u679c Parent \u5bf9\u8c61\u4e2d\u7684\u67d0\u4e2a\u65b9\u6cd5\u6216\u5c5e\u6027\u4e5f\u662f\u4e00\u4e2a\u5bf9\u8c61\u7684\u8bdd\uff08\u5f15\u7528\uff09\uff0c\u5219\u7ee7\u627f\u5230\u7684 Child \u4e2d\u7684\u540c\u540d\u65b9\u6cd5\u6216\u5c5e\u6027\uff0c\u5728\u5185\u5b58\u4e2d\u6307\u5411\u7684\u662f\u540c\u4e00\u4e2a\u4f4d\u7f6e\uff0c\u6b64\u65f6\u5982\u679c\u5728\u4e00\u5904\u4fee\u6539\u4e86\u6b64\u5c5e\u6027\u6216\u65b9\u6cd5\uff0c\u5219\u53e6\u4e00\u5904\u4e5f\u6709\u53d8\u5316\u3002\u89e3\u51b3\u8fd9\u79cd\u95ee\u9898\u7684\u65b9\u5f0f\u662f\uff0c\u6df1\u62f7\u8d1d\uff0c\u53ca\u8fdb\u884c\u8d4b\u503c\u7684\u65f6\u5019\uff0c\u5224\u65ad\u7236\u5bf9\u8c61\u6b64\u5c5e\u6027\u6216\u65b9\u6cd5\u662f\u5426\u662f\u5f15\u7528\u4e86\u7c7b\u578b\uff0c\u5982\u679c\u662f\uff0c\u5219\u9012\u5f52\u5373\u53ef\u3002<\/p>\n<p><!--nextpage--><\/p>\n<p>\u975e\u6784\u9020\u51fd\u6570\u7684\u7ee7\u627f<\/p>\n<p>1. \u4ec0\u4e48\u662f\u201c\u975e\u6784\u9020\u51fd\u6570\u201d\u7684\u7ee7\u627f\uff1f<\/p>\n<p>\u4f8b\u5982\uff1a<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\n    var Chinese = {\r\n        nation:'\u4e2d\u56fd'\r\n    }\r\n<\/pre>\n<p>\u8fd8\u6709\u4e00\u4e2a\u5bf9\u8c61\uff0c\u53eb\u505a \u201c\u533b\u751f\u201d<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\n    var Doctor = {\r\n        career:'\u533b\u751f'\r\n    }\r\n<\/pre>\n<p>\u56e0\u4e3a\u533b\u751f\u5f88\u6709\u53ef\u80fd\u5c31\u662f\u4e2d\u56fd\u4eba\uff0c\u90a3\u4e48\u5982\u4f55\u8ba9\u533b\u751f\u53bb\u7ee7\u627f\u4e2d\u56fd\u4eba\u5462\uff1f<br \/>\n\u4e5f\u5373\uff1a\u4e24\u4e2a\u5bf9\u8c61\u90fd\u662f\u666e\u901a\u7684\u5bf9\u8c61\uff0c\u4e0d\u662f\u6784\u9020\u51fd\u6570\uff0c\u65e0\u6cd5\u4f7f\u7528\u6784\u9020\u51fd\u6570\u7684\u65b9\u5f0f\u6765\u5b9e\u73b0\u7ee7\u627f\u3002<\/p>\n<p>2. object() \u65b9\u6cd5<\/p>\n<p>Douglas Crockford \u63d0\u51fa\u4e86\u4e00\u4e2a\u51fd\u6570\uff0c\u53ef\u4ee5\u505a\u5230\u8fd9\u4e00\u70b9\uff0c\u539f\u7406\u6709\u70b9\u7c7b\u4f3c\u4e8e\u6784\u9020\u51fd\u6570\u7ee7\u627f\u4e2d\u7684\uff0c\u5229\u7528\u7a7a\u5bf9\u8c61\u505a\u4e2d\u4ecb \u7ee7\u627f<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\n    function object(o){\r\n        function F(){}\r\n        F.prototype = o;\r\n        return new F();\r\n    }\r\n<\/pre>\n<p>\u8fd9\u4e2a\u51fd\u6570\u7684\u5de6\u53f3\u5c31\u662f\u5229\u7528\u4e00\u4e2a\u4e2d\u4ecb\u6765\u5c06\u5b50\u5bf9\u8c61\u7684 prototype \u5bf9\u8c61\u6307\u5411\u7236\u5bf9\u8c61\uff0c\u4ece\u800c\u901a\u8fc7\u5b50\u5bf9\u8c61\u7684\u539f\u578b\u94fe\u4f7f\u5176\u8fde\u5230\u4e86\u4e00\u8d77\u3002\u56e0\u4e3a\u666e\u901a\u5bf9\u8c61\u5176prototype\u4e3a\u672a\u5b9a\u4e49\uff0c\u6240\u4ee5\u4e0d\u80fd\u76f4\u63a5\u5bf9\u5176\u8d4b\u503c\u6765\u5b9e\u73b0\u7ee7\u627f\u3002<\/p>\n<p>\u4f7f\u7528\uff1a<\/p>\n<pre lang=\"javascript\" line=\"1\">   \r\n    var Doctor = object(Chinese);\r\n    Docotor.career = '\u533b\u751f';\r\n    \r\n    console.log(Docotor.nation);  \/\/  \u4e2d\u56fd\r\n<\/pre>\n<p>3. \u6d45\u62f7\u8d1d<\/p>\n<p>\u7c7b\u4f3c\u4e8e\u4e0a\u4e00\u8282\u7684\u62f7\u8d1d\u7ee7\u627f\uff0c\u53ea\u4e0d\u8fc7\u8fd9\u91cc\u76f4\u63a5\u62f7\u8d1d\u7684\u662f\u5bf9\u8c61\u7684\u5c5e\u6027\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\n    function extendCopy(p){\r\n        var c = {};\r\n        for(var key in p){\r\n            c[key] = p[key];\r\n        }\r\n        c.uber = p;\r\n        return c;\r\n    }\r\n<\/pre>\n<p>    \u4f7f\u7528\uff1a<\/p>\n<pre lang=\"javascript\" line=\"1\">    \r\n    var Doctor = extendCopy(Chinese);\r\n    Doctor.career = '\u533b\u751f';\r\n    \r\n    console.log(Doctor.nation);  \/\/ \u4e2d\u56fd\r\n<\/pre>\n<p>\u4f46\u662f\uff0c\u4e0e\u539f\u578b\u7ee7\u627f\u7c7b\u4f3c\uff0c\u8fd9\u91cc\u4e5f\u5b58\u5728\u5047\u5982\u7236\u5bf9\u8c61\u7684\u5c5e\u6027\u7b49\u4e8e\u6570\u7ec4\u6216\u5bf9\u8c61\u7684\u8bdd\uff0c\u90a3\u4e48\u5b9e\u9645\u4e0a\u53ea\u662f\u4e00\u4e2a\u5185\u5b58\u5730\u5740\uff0c\u4e0d\u662f\u62f7\u8d1d\uff0c\u6240\u4ee5\u5982\u679c\u4fee\u6539\u4e86\u5b50\u5bf9\u8c61\uff0c\u90a3\u4e48\u7236\u5bf9\u8c61\u4e5f\u4f1a\u88ab\u4fee\u6539\uff0c\u8fd9\u6837\u662f\u4e0d\u53ef\u4ee5\u7684\u3002<\/p>\n<p>\u4f8b\u5982\uff1a<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\n    Chinese.tripPlaces = ['\u5317\u4eac','\u4e0a\u6d77','\u9999\u6e2f'];\r\n    \r\n    var Doctor = extendCopy(Chinese);\r\n    Doctor.tripPlaces.push('\u53a6\u95e8');\r\n    \r\n    console.log(Doctor.tripPlaces); \/\/ '\u5317\u4eac','\u4e0a\u6d77','\u9999\u6e2f','\u53a6\u95e8'\r\n    console.log(Chinese.tripPlaces); \/\/ '\u5317\u4eac','\u4e0a\u6d77','\u9999\u6e2f','\u53a6\u95e8'\r\n<\/pre>\n<p>\u770b\uff0cChinese \u7684\u4e1c\u897f\u4e5f\u88ab\u6539\u6389\u4e86\uff0c\u540c\u65f6\u7ee7\u627f Chinese \u7684\u6240\u6709\u5bf9\u8c61\u7684\u6b64\u5c5e\u6027\uff0c\u90fd\u88ab\u6539\u6389\u4e86\uff0c\u800c\u8fd9\u662f\u591a\u4e48\u6253\u7684\u95ee\u9898\u554a\u3002<br \/>\n\u8fd9\u662f jQuery \u65e9\u671f\u5b9e\u73b0\u7ee7\u627f\u7684\u65b9\u5f0f\uff0c\u5176\u53ea\u80fd\u62f7\u8d1d\u57fa\u672c\u7c7b\u578b\u7684\u6570\u636e\u3002\u4e5f\u5373\u662f\u201c\u6d45\u62f7\u8d1d\u201d\u3002<\/p>\n<p>4. \u6df1\u62f7\u8d1d<\/p>\n<p>\u5176\u5b9e\u6df1\u62f7\u8d1d\u4e5f\u6765\u6e90\u4e8e\u6d45\u62f7\u8d1d\uff0c\u53ea\u662f\u5bf9\u4e8e\u5c5e\u6027\u503c\u662f\u5426\u662f\u57fa\u672c\u7c7b\u578b\u8fdb\u884c\u5224\u65ad\uff0c\u5982\u679c\u975e\u57fa\u672c\u7c7b\u578b\u7684\u6570\u636e\uff0c\u7ee7\u7eed\u8c03\u7528\u5373\u53ef\uff0c\u4e5f\u5c31\u662f\u9012\u5f52\u7684\u6d45\u62f7\u8d1d\u5c31\u884c\u4e86\u3002<\/p>\n<pre lang=\"javascript\" line=\"1\">\r\n    function deepCopy(p,c){\r\n        var c = c || {};\r\n        for (var key in p){\r\n            if(typeof p[key] === 'object'){\r\n                c[key] = (p[key].constructor === Array) ? [] : {};\r\n                deepCopy(p[key],c[key]);\r\n            } else {\r\n                c[key] = p[key];\r\n            }\r\n        }\r\n        \r\n        return c;\r\n    }\r\n<\/pre>\n<p>\u4f7f\u7528\uff1a    <\/p>\n<pre lang=\"javascript\" line=\"1\">\r\n    Chinese.tripPlaces = ['\u5317\u4eac','\u4e0a\u6d77','\u9999\u6e2f'];\r\n    \r\n    var Doctor = deepCopy(Chinese);\r\n    Doctor.tripPlaces.push('\u53a6\u95e8');\r\n    \r\n    console.log(Doctor.tripPlaces); \/\/ '\u5317\u4eac','\u4e0a\u6d77','\u9999\u6e2f','\u53a6\u95e8'\r\n    console.log(Chinese.tripPlaces); \/\/ '\u5317\u4eac','\u4e0a\u6d77','\u9999\u6e2f'\r\n<\/pre>\n<p>\u76ee\u524d\uff0cjQuery \u5c31\u4f7f\u7528\u7684\u662f\u8fd9\u79cd\u65b9\u6cd5\u3002<\/p>\n<p>\u5168\u6587\u662f\u5728<a href=\"http:\/\/www.ruanyifeng.com\/\" title=\"\u962e\u4e00\u5cf0\" target=\"_blank\">\u962e\u4e00\u5cf0<\/a>\u7684\u8fd9\u4e09\u7bc7\u6587\u7ae0\uff08<a href=\"http:\/\/www.ruanyifeng.com\/blog\/2010\/05\/object-oriented_javascript_encapsulation.html\" title=\"Javascript \u9762\u5411\u5bf9\u8c61\u7f16\u7a0b\uff08\u4e00\uff09\uff1a\u5c01\u88c5\" target=\"_blank\">1<\/a>,<a href=\"http:\/\/www.ruanyifeng.com\/blog\/2010\/05\/object-oriented_javascript_inheritance.html\" title=\"Javascript\u9762\u5411\u5bf9\u8c61\u7f16\u7a0b\uff08\u4e8c\uff09\uff1a\u6784\u9020\u51fd\u6570\u7684\u7ee7\u627f\" target=\"_blank\">2<\/a>,<a href=\"http:\/\/www.ruanyifeng.com\/blog\/2010\/05\/object-oriented_javascript_inheritance_continued.html\" title=\"Javascript\u9762\u5411\u5bf9\u8c61\u7f16\u7a0b\uff08\u4e09\uff09\uff1a\u975e\u6784\u9020\u51fd\u6570\u7684\u7ee7\u627f\" target=\"_blank\">3<\/a>\uff09\u7684\u7406\u89e3\u4e0b\u5199\u6210\u7684\uff0c\u4e5f\u7b97\u4f5c\u5b66\u4e60\u7b14\u8bb0\u5427\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u9762\u5411\u5bf9\u8c61\u7f16\u7a0b \u5c01\u88c5 \u5bf9\u8c61\u751f\u6210\u7684\u539f\u59cb\u6a21\u5f0f var Cat = { name : &#8221;, color : &#8221; } [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[566],"tags":[667,885,777,884],"class_list":["post-1876","post","type-post","status-publish","format-standard","hentry","category-javascript","tag-javascript","tag-885","tag-777","tag-884"],"jetpack_featured_media_url":"","jetpack-related-posts":[],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/yimity.com\/wp-json\/wp\/v2\/posts\/1876","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/yimity.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/yimity.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/yimity.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/yimity.com\/wp-json\/wp\/v2\/comments?post=1876"}],"version-history":[{"count":0,"href":"https:\/\/yimity.com\/wp-json\/wp\/v2\/posts\/1876\/revisions"}],"wp:attachment":[{"href":"https:\/\/yimity.com\/wp-json\/wp\/v2\/media?parent=1876"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/yimity.com\/wp-json\/wp\/v2\/categories?post=1876"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/yimity.com\/wp-json\/wp\/v2\/tags?post=1876"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}