JavaScript/对象
在 JavaScript 中,一个对象是属性的集合;属性是键值对。键是字符串或符号。值可以是任何数据类型 - 包括函数(在这种情况下,它们被称为方法)。
对象看起来像关联数组,以哈希表的形式实现。但在实践中,JavaScript 引擎可能以其他方式实现它们以实现最佳性能。
请注意,JavaScript 对象与 JSON 不完全相同。JSON 是一种用于对象文本表示(“序列化”/“反序列化”)的格式,也可以在其他语言或纯文本编辑器中完成。
JavaScript 语法支持不同的方法来创建对象。
'字面量表示法' 使用大括号 { }
"use strict";
// an empty object (no properties)
const obj_0 = {};
alert(JSON.stringify(obj_0));
// 'obj_1' contains a set of 3 properties. The value of key 'c' is
// a second object with an empty set of properties.
const obj_1 = { a: "Any string", b: 42, c: {} };
alert(JSON.stringify(obj_1));
// using variables
const a = "Any string";
const b = 42;
const c = {};
const obj_2 = { a: a, b: b, c: c };
alert(JSON.stringify(obj_2));
// shorthand usage of variables
const obj_3 = { a, b, c };
alert(JSON.stringify(obj_3));
构造函数new Object()
构造函数创建一个新对象。
"use strict";
const obj_4 = new Object({ a: 5, b: 42 });
alert(JSON.stringify(obj_4));
Object.create()Object.create()
方法从现有对象创建一个新对象。
"use strict";
const obj_5 = Object.create({ a: 5, b: 42 });
alert(JSON.stringify(obj_5)); // ???
alert(JSON.stringify(obj_5.a));
console.log (obj_5);
每个属性都包含一个键值对。要读取属性的值,可以使用两种语法方式中的任何一种,即点表示法或方括号表示法。
"use strict";
const person = {firstName: "Albert", lastName: "Einstein" };
// dot notation
alert(person.firstName); // no " " or ' '
// bracket notation
alert(person["firstName"]); // must use a string
// bracket notation using a variable
const fn = "firstName";
alert(person[fn]);
如果您不知道键怎么办?要获取所有现有键的列表,请使用Object.keys()
方法。它返回一个数组,其元素是字符串。这些字符串可以在循环中使用以访问值。由于在许多情况下需要这样的循环,JavaScript 为这种情况提供了一个特殊的语言元素。for .. in
循环选择键并循环遍历所有属性。
"use strict";
const person = {firstName: "Albert", lastName: "Einstein" };
alert(Object.keys(person)); // firstName, lastName
// The for .. in loop selects all existing keys and loops over the properties
for (const k in person) {
alert('The key is: ' + k + '. The value is: ' + person[k]);
}
类似于Object.keys()
方法,还有两种方法Object.values()
和Object.entries()
用于分别获取值和属性(键和值)。在后一种情况下,您将获得一个数组数组(每个数组有两个元素)。
"use strict";
const person = {firstName: "Albert", lastName: "Einstein" };
alert(Object.values(person)); // Albert, Einstein
// for .. of loops differ from for .. in loops in syntax AND semantic; see chapter 'Loops'
for (const [k, v] of Object.entries(person)) {
alert('The key is: ' + k + '. The value is: ' + v);
}
您可以使用点表示法和方括号表示法来添加或修改属性。上面读取操作和写入操作的语法之间没有区别。
"use strict";
const person = {firstName: "Albert", lastName: "Einstein" };
// add properties
person.bornIn = "Ulm";
person["profession"] = "Physicist";
alert(JSON.stringify(person));
// modify properties
person.bornIn = "Germany";
person["profession"] = "Theoretical Physics";
alert(JSON.stringify(person));
在上面的示例中,变量“person”是用关键字const
创建的。因此无法为它分配新值,但可以操作其属性。在操作属性时,原始对象保持不变。
delete
运算符从对象中删除整个属性 - 包括键和值。这与将null
或undefined
存储在值中的情况不同。
同样,您可以使用点表示法和方括号表示法。
"use strict";
const person = {firstName: "Albert", lastName: "Einstein", bornIn: "Ulm", profession: "Physicist" };
delete person.bornIn;
delete person["profession"];
alert(JSON.stringify(person));
JavaScript 提供了“扩展语法”(三个点)。它将对象扩展为其属性(键值对)或将数组扩展为其元素。当您想要将多个对象合并为单个对象时,这可能很有用。
"use strict";
const person = {firstName: "Albert", lastName: "Einstein" };
const address = {city: "Ulm" };
// expand the two objects (and merge them)
const newPerson = {...person, ...address};
alert(JSON.stringify(newPerson));
// The result is an object with 3 properties. All values are strings.
// {firstName: "Albert", lastName: "Einstein",city: "Ulm"}
// which is different from the version without the 'spread syntax':
const newPerson1 = {person, address};
alert(JSON.stringify(newPerson1));
// The result is an object with 2 properties. Both values are objects.
// {person: {firstName: "Albert", lastName: "Einstein"}, address: {city: "Ulm"}}
属性的值部分可能包含一个函数体;参见此处。在这种情况下,该函数称为方法。
"use strict";
// only definitions here, no execution!
const city = {
showName: function (cityName) {
if (typeof cityName === "undefined") {
alert("Sorry, I don't know my name.");
} else {
alert("The name of the city is: " + cityName);
}
},
// this works too!
showPopulation(count) {
alert(count + " Inhabitants");
},
};
// JSON's 'stringify()' doesn't support the serialization of methods. Use 'console.log()' instead.
console.log(city);
// executions
city.showName();
city.showName("Nairobi");
city.showPopulation(4500000);