什么'在javascript中将新方法添加到对象中的区别是什么

what 's the difference about adding the new method to an object in javascript?

本文关键字:添加 对象 是什么 区别 新方法 javascript 什么      更新时间:2023-11-16

在javascript中有两种方法可以将方法添加到对象中,以下方式有什么不同?

1

var o = new Object(); o.method = function(){}

2

var o = new Object(); o.prototype.method = function(){}

"原型"是全局的。它可以被所有对象使用。您甚至可以覆盖或删除标准方法。

如果您正在为对象定义一个新方法,那么它是本地的,并且仅与对象的此实例一起使用

另一方面,如果你在原型范围内定义它,那么它的全局和方法是为所有实例

定义的

关于原型,有几件事你必须先弄清楚。我在这里写的是一个粗略的概述。原型的工作方式还有一些其他的东西,但我试图保持简单和基本。

这篇博客文章有一些关于我所说内容的好细节:http://javascriptweblog.wordpress.com/2010/06/07/understanding-javascript-prototypes/

只有函数具有.protype属性。实例具有.构造函数属性。在您的示例中,"o"是Object的一个实例。

所有构造函数都是函数。

根据您使用的浏览器,实例将具有原型属性,如:

.__proto__ 

这就是你通常认为的函数的.protype属性。IE的大多数(所有?)版本都不在实例上提供"_ proto _"(SO格式化的额外空间)属性。支持ECMA5的浏览器有一个名为getPrototypeOf()的方法,该方法返回实例的原型。

由于构造函数是函数,所以它们具有.protype属性。因此,o.constructor.prototype是以友好的跨浏览器方式访问原型的好方法。对此有一些警告,因为它可能会被覆盖。查看博客文章了解更多信息。

因此,我们需要做的第一件事是重新编写代码,使语法能够像我们预期的那样正常工作。从这一点开始,我将更改变量名称,使其更加清晰:

var foo = new Object(); //a new instance of Object
foo.foo_method = function(){ console.log('foo'); } //add a function called 'foo_method' to our instance
var bar = new Object(); // a new instance of Object
bar.constructor.prototype.bar_method = function(){ console.log('bar'); } //add a function called 'bar_method' to the Object prototype

foo.foo_method(); //logs "foo"
foo.bar_method(); //logs "bar"
bar.bar_method(); //logs "bar"
try{
    bar.foo_method(); 
}catch(err){
   console.log(err); //Uncaught TypeError: Object #<Object> has no method 'foo_method' or "TypeError"
}
//Alternate way to add methods to prototypes. Only works in non-IE browsers.
bar.__proto__.woohoo_method = function(){ console.log('woohoo'); }
foo.woohoo_method(); //logs "woohoo"
bar.woohoo_method(); //logs "woohoo"​​​​​