javascript中的对象语法[重复]

Posted

技术标签:

【中文标题】javascript中的对象语法[重复]【英文标题】:Object syntax in javascript [duplicate] 【发布时间】:2013-11-09 00:58:12 【问题描述】:

我正在学习的书说以下代码正在创建一个对象,但我不确定它是如何工作的。第二部分代码是我从在线教程中学到的另一种方法。但是有什么区别呢? 我自己尝试过对此进行研究,但对所有这些以及一些我不理解的解释都很陌生。使用每一个都有优点/缺点吗?提前致谢。

function Player (name , score , rank)

this.name = name ;
this.score = score ;
this.rank = rank ;

var playerOne = new Player ( "Craig" , 199 , "1st" ) ;

以下是我之前的做法;

var playerOne = name: "Craig" , score: 199 , rank: "1st" ;
var playerTwo = name: "Tohny" , score: 155522 , rank: "2nd" ;

【问题讨论】:

【参考方案1】:

第一个代码示例是一个构造函数。据我了解,这是一种更强类型的创建对象的方式,因为该对象的参数和成员已经定义。

第二个代码示例确实做同样的事情,但是没有定义对象应该实际包含什么或它应该如何表现。这并不完全是一件坏事,但在某些情况下,它的可取性要低得多,并且不会像构造函数那样为您提供尽可能多的多功能性。

【讨论】:

【参考方案2】:

主要区别在于第一个将在其“原型链”中有一个额外的对象。原型链是您在 javascript 中进行继承的方式。

因此,您可以扩展该对象,并且从 Player 构造函数创建的所有对象都将继承这些项目。

function Player (name , score , rank)

this.name = name ;
this.score = score ;
this.rank = rank ;


Player.prototype.getNameRank = function() 
    return this.name + ":" + this.rank;
;

var playerOne = new Player ( "Craig" , 199 , "1st" ) ;

所以现在playerOne 对象将继承getNameRank() 方法,而使用对象文字语法创建的其他对象将不受影响。

var nr = playerOne.getNameRank();

console.log(nr); // Craig:1st

您在 JavaScript 中创建的所有 (无论如何) 对象都将继承自 Object.prototype 对象。第二个示例中的对象文字语法在原型链中具有该对象,并且只有该对象。

构造函数中的对象首先是Player.prototype,然后是Object.prototype

【讨论】:

其他区别是constructor 属性会有所不同,instanceof 运算符的行为也会有所不同。 @TedHopp:非常正确。链中的额外对象将具有自己的.constructor 属性,并且当instanceof 被赋予Player 函数时将提供肯定的结果(假设Player.prototype 尚未被替换) .【参考方案3】:

但是有什么区别呢?

第一个使用构造函数,第二个使用对象初始化器

使用每一个都有优点/缺点吗?

是的:

构造函数可以重复使用,并且其中包含逻辑,因此非常适合需要制作具有相同特征的多个对象时。当您在编写了一堆代码后需要修改这些特征时尤其有用,因为创建对象的代码很好且包含在内。 构造函数可以为它们创建的对象分配一个原型。如果您将属性放在Player.prototype 上,那么通过new Player 创建的对象可以访问这些属性,因为这些对象由创建时分配给它们的原型备份。你不能用对象初始化器来做到这一点。 (如果您将对象初始化器与 ECMAScript5 的 Object.create 结合使用,您可以做到这一点。) 对象初始值设定项在使用时是明确且相当清晰的,因为您可以看到所创建的每个属性的名称,而由于构造函数的参数基于您提供它们的顺序,因此它在您创建对象的地方可能不太清楚(例如,使用构造函数)。事实上,有时您会看到构造函数接受一个对象作为其参数,然后使用该对象的属性来填充他们正在创建的对象。

【讨论】:

【参考方案4】:

您可以通过两种方式在 JavaScript 中创建对象。

    函数构造函数(结合 new 关键字) 对象字面量(第二种显示方式)。

但实际上,第二种方式只是以下内容的替代语法:

var playerOne = new Object();
playerOne.name = "Craig";
playerOne.score = 199;
playerOne.rank = "1st";
// ...

【讨论】:

以上是关于javascript中的对象语法[重复]的主要内容,如果未能解决你的问题,请参考以下文章

如何遍历类对象数组并在 JavaScript 中使用函数 [重复]

JavaScript基于原型的面向对象系统

1javascript语法

使用Angular语法删除数组中的对象[重复]

检查元素是不是是javascript中的对象[重复]

访问 JSON 数组中的对象 (JavaScript) [重复]