1

Question

将方法添加到javascript中的对象有两种方法，以下方式有什么不同？

1

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

2

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

Answer 1

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

Answer 2

如果要为对象定义新方法，那么它的本地和仅用于该对象的实例

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

Answer 3

有一些事情你必须先直接了解原型。我在这里写的是一个粗略的概述。关于原型如何工作还有一些其他的东西，但我试图保持这个简单和基础。

这篇博客文章详细介绍了我所说的内容：http://javascriptweblog.wordpress.com/2010/06/07/understanding-javascript-prototypes/

只有函数具有.prototype属性。实例具有.constructor属性。在您的示例中，“o”是Object的实例。

所有构造函数都是函数。

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

.__proto__

这是您通常认为的函数的.prototype属性。 IE的大多数（全部？）版本不在实例上提供“_ _ proto _ _”（SO格式的额外空格）属性。支持ECMA5的浏览器有一个名为getPrototypeOf（）的方法，它返回一个实例的原型。

由于构造函数是函数，因此它们具有.prototype属性。所以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"

在javascript中将新方法添加到对象有什么区别？

1

2

3 个答案: