繁体   English   中英

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

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

有两种方法可以将方法添加到javascript中的对象中,以下方法有何区别?

1个

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

2

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

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

如果您正在为对象定义新方法,那么它的local和仅与该对象的此实例一起使用

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

关于原型,您必须首先了解几件事。 我在这里写的是一个粗略的概述。 原型的工作方式还有其他一些问题,但是我试图将其简化和保持基础。

这篇博客文章详细介绍了我的意思: 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"​​​​​

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM