JS对象object – JavaScript教程 JS对象用法|JavaScript

上一章JavaScript教程请查看：JS函数function
在本教程中，你将学习如何在JavaScript中创建和使用对象object。
什么是对象？JavaScript是一种基于对象的语言，在JavaScript中几乎所有东西都是对象或像对象一样工作。因此，为了有效地使用JavaScript，我们需要了解对象是如何工作的，以及如何创建自己的对象并使用它们。
JavaScript对象只是一个命名值的集合。这些命名值通常被称为对象的属性。如果你还记得JavaScript数组那一章，数组是值的集合，其中每个值都有一个索引(一个数字键)，索引从零开始，每个值递增1。对象类似于数组，但不同之处在于你自己定义键，如名称、年龄、性别等。在下面几节中，我们将详细了解对象。
创建对象可以使用带可选属性列表的花括号{}创建对象。属性是“key: value”对，其中键(或属性名)总是字符串，而值(或属性值)可以是任何数据类型，如字符串、数字、布尔值或复杂数据类型，如数组、函数和其他对象。此外，将函数作为其值的属性通常被称为方法，以将它们与其他属性区分开来。一个典型的JavaScript对象可能是这样的:

var person = { name: "Peter", age: 28, gender: "Male", displayName: function() { alert(this.name); } };

上面的示例创建了一个名为person的对象，该对象有三个属性名称、年龄和性别，以及一个方法displayName()，displayName()方法显示this.name的值，该值解析为person.name，这是在JavaScript中创建新对象的最简单和首选的方法，称为对象字面值语法。
属性名通常不需要加引号，除非它们是保留字，或者它们包含空格或特殊字符(除了字母、数字和_和$字符以外的任何字符)，或者它们以数字开头，如下面的示例所示:

var person = { "first name": "Peter", "current age": 28, gender: "Male" };

注意: 由于ECMAScript 5，保留字可以用作对象的属性名，而不需要引用。但是，为了更好的兼容性，应该避免这样做。
访问对象的属性要访问或获取属性的值，可以使用点(.)或方括号([])符号，如下面的示例所示:

var book = { "name": "Harry Potter", "author": "J. K. Rowling", "year": 2000 }; // 点操作符 document.write(book.author); // : J. K. Rowling// 中括号操作符 document.write(book["year"]); // : 2000

点表示法更容易读和写，但它不能总是被使用。如果属性的名称无效(即如果它包含空格或特殊字符)，则不能使用点符号; 你将不得不使用括号表示法，如下面的例子所示:

var book = { name: "Harry Potter", author: "J. K. Rowling", "publication date": "8 July 2000" }; // 括号语法 document.write(book["publication date"]); // : 8 July 2000

方括号表示法比点表示法提供了更多的灵活性，它还允许你指定属性名作为变量，而不只是字符串文字，如下面的例子所示:

var person = { name: "Peter", age: 28, gender: "Male" }; var key = prompt("输入任何属性名以获取其值"); alert(person[key]); // : Peter (if enter "name")

遍历对象的属性可以使用for…in遍历对象的键-值对，这个循环特别针对遍历对象的属性进行了优化。这里有一个例子:

var person = { name: "Peter", age: 28, gender: "Male" }; // 遍历对象属性 for(var i in person) { document.write(person[i] + "< br>"); // : name, age and gender }

设置对象的属性类似地，可以使用点(.)或括号([])符号设置新属性或更新现有属性，如下面的示例所示:

var person = { name: "Peter", age: 28, gender: "Male" }; // 设置属性 person.country = "United States"; document.write(person.country); // : United Statesperson["email"] = "abc@mail.com"; document.write(person.email); // : abc@mail.com// 更新 person.age = 30; document.write(person.age); // : 30person["name"] = "Peter Parker"; document.write(person.name); // : Peter Parker

删除对象的属性delete操作符可用于完全删除对象中的属性，删除是从对象中实际删除属性的唯一方法，将属性设置为undefined或null只会更改属性的值，它不会从对象中删除属性。

var person = { name: "Peter", age: 28, gender: "Male", displayName: function() { alert(this.name); } }; // 删除属性 delete person.age; alert(person.age); // : undefined

注意: delete操作符只删除对象属性或数组元素。它对变量或声明的函数没有影响。但是，应该避免删除数组元素的delete操作符，因为它不会改变数组的长度，只会在数组中留下一个洞。
调用对象的方法你可以像访问属性一样访问对象的方法—使用点表示法或方括号表示法。这里有一个例子:

var person = { name: "Peter", age: 28, gender: "Male", displayName: function() { alert(this.name); } }; person.displayName(); // : Peter person["displayName"](); // : Peter

通过值和引用操作JavaScript对象是引用类型，这意味着当你复制它们时，你实际上只是复制了对那个对象的引用，而像字符串和数字这样的原始值是作为一个整体值分配或复制的。为了更好地理解这一切，让我们看看下面的例子:

var message = "Hello World!"; var greet = message; // 赋值给新变量 greet = "Hi, there!"; document.write(message); // : Hello World! document.write(greet); // : Hi, there!

在上面的例子中，我们复制了一个变量消息并更改了该副本的值(即变量greet)，这两个变量仍然是独立的。但是，如果我们对一个对象做同样的事情，我们会得到一个不同的结果，正如你在下面的例子中看到的:

var person = { name: "Peter", age: 28, gender: "Male" }; var user = person; // 新赋值 user.name = "Harry"; document.write(person.name); // : Harry document.write(user.name); // : Harry

【JS对象object – JavaScript教程】你可以清楚地看到，对变量user所做的任何更改也会更改person变量; 这是因为两个变量都引用了同一个对象。因此，简单地复制对象实际上并不是复制它，而是复制对该对象的引用。