JavaScript有许多内置对象,如Number(数字)、Array(数组)、String(字符串)、Date(日期)和Math(数学)。这些内置对象都有成员属性和方法。除了JavaScript对象,Node.js、MongoDB、Express和Angular也添加了自己的内置对象。
JavaScript也为你构建自己的自定义对象提供了一个相当不错的面向对象的编辑结构。使用对象而不只是一个函数集合,是编写清洁、高效、可重复使用的JavaScript代码的关键。
1、使用对象语法
为了有效的在JavaScript中使用对象,你需要对其结构和语法有所理解。一个对象实际上只是一个容器,他将多个值(并且在某些情况下,将多个函数)组合在一起。对象的值被称为属性,而对象的函数被称为方法。
要使用一个JavaScript对象,必须先创建该对象的实例。你可以通过使用关键字new和对象的构造函数名称创建对象实例。例如,要创建一个Number对象,可以使用下面的代码行:
var x = new Number("5");
对象的语法很简单:使用对象名称,然后是一个点,然后是属性或方法的名称。例如,下面的代码行获取和设置名为myObj的对象的name属性:
var s = myObj.name;
myObj.name = "New Name";
你也可以用相同的方法获取和设置对象的对象方法。例如,下面的代码行调用getName()方法,然后更改名为myObj的对象的方法函数:
var name = myObj.getName();
myObj.getName() = function(){return this.name;};
你还可以创建对象,并直接使用{}语法对变量和函数赋值。例如,下面的代码定义了一个新的对象,并赋予他值和一个方法函数:
var obj = {
name:"My Object",
value:7,
getValue:function(){return this.name;};
};
你还可以通过使用object[propertyName](对象[属性名])的语法来访问JavaScript对象的成员。当你使用动态属性名称并且当属性名必须包含JavaScript不支持的字符时,这非常有效。例如,下面的例子获取对象名myObj中的"User Name"和"Other Name"属性:
var propName = "User Name";
var val1 = myObj[propName];
var val2 = myObj["Other Name"];
2、创建自定义对象
使用内置的JavaScript对象有几个优点。当你开始编写使用越来越多的数据的代码时,就会发现自己想要建立具有特定的属性和方法的自定义对象。
你可以用几个不同的方法来定义JavaScript对象。最简单的是即时方法:只需创建一个通用的对象,然后根据需要添加其属性。例如,要创建一个用户对象,并赋给它一个名字和姓氏,以及定义一个函数来返回它们,你可以使用下面的代码:
var user = new Object();
user.first="Brad";
user.last="Dayley";
user.getName = function(){
return this.first+""+this.last;
}
你也可以使用下面的代码实现与直接赋值相同的效果,其中,对象被包含在{}中,而属性是使用property:value(属性:值)的语法定义的:
var user = {
first:'Brad',
last:'Dayley',
getName:function(){
return this.first+""+this.last;
}
};
对于你以后并不需要再使用的简单对象,前两个选项工作的非常好。对于可重用的对象,更好的方法是将对象实际封装在其自身的函数块里面。这具有允许你将所有关于对象的代码局部保持在对象本身中的优点。例如:
function User(first,last){
this.first = first;
this.last = last;
this.getName = function(){return this.first +""+ this.last;};
}
var user = new User("Brad","Daylet");
如果你有一个对象可以使用点符号表示法引用的属性,这些方法的最终结果是基本相同的,如下所示:
console.log(user.getName());
3、使用原型对象模式
创建对象的更先进的方法是使用原型模式。通过不在对象本身里面,而在对象的原型属性里面定义函数来实现一个模式。有了原型,在原型汇总定义的函数只在JavaScript加载时被创建一次,而不是每次创建一个新的对象时都被创建。
下面的例子展示了原型的语法:
function UserP(first,last){
this.first = first;
this.last = last;
}
UserP.prototype = {
getFullName:function(){
return this.first + "" + this.last;
}
};
请注意,你定义对象UserP,然后将UserP.prototype设置为包括getFullName()函数。你可以在原型中包括任意多的函数。每创建一个新的对象时,这些函数都将可用。