在 JavaScript 中为对象添加属性

1. 使用点符号

一种简单的方法是使用带有赋值运算符的点表示法将属性添加到现有对象。语法是： object.property = value.

1 2 3 4 5 6 7 8

var person = { name: 'Max', age: 23 }; person.sex = 'Male'; console.log(person); /*     输出: { name: 'Max', age: 23, sex: 'Male' } */

2. 使用括号表示法

如果事先不知道属性的名称或名称是无效的变量标识符(例如所有数字)，点表示法将不起作用。

要处理这些情况，可以将对象视为关联数组并使用括号表示法。语法是： object['property'] = value.

1 2 3 4 5 6 7

var person = { name: 'Max', age: 23 }; person['sex'] = 'Male'; console.log(person); /*     输出: { name: 'Max', age: 23, sex: 'Male' } */

请注意，当在对象中找到指定的键时，点表示法和方括号表示法都将用给定属性覆盖对象的属性。为了说明，考虑下面的代码，它覆盖了 age 的财产 person 目的。

1 2 3 4 5 6 7

var person = { name: 'Max', age: 23 }; person['age'] = 25; console.log(person); /*     输出: { name: 'Max', age: 25 } */

3.使用 Object.assign() 功能

这 Object.assign() 方法可以将属性从源对象复制到目标对象。如果在两个对象中找到相同的键，则源中的属性会覆盖目标对象的属性。

1 2 3 4 5 6 7 8 9

var person = { name: 'Max', age: 23 }; var details = { sex: 'Male', nationality: undefined }; Object.assign(person, details); console.log(person); /*     输出: { name: 'Max', age: 23, sex: 'Male', nationality: undefined } */

4. 使用展开运算符

或者，您可以使用 扩展运算符 将两个对象的属性合并为一个新对象。这种方法不会用给定对象的公共键属性覆盖源对象。

1 2 3 4 5 6 7 8 9

var person = { name: 'Max', age: 23 }; var prop = { sex: 'Male' }; var obj = {...person, ...prop}; console.log(obj); /*     输出: { name: 'Max', age: 23, sex: 'Male' } */

5. 使用 jQuery

使用 jQuery，您可以使用 jQuery.extend() 方法，它将第二个对象的内容合并到第一个对象中。如果对象具有共同的键，则此方法会使用给定对象的属性覆盖源对象。

1 2 3 4 5 6 7 8 9 10 11 12 13

const { JSDOM } = require("jsdom"); const { window } = new JSDOM(); var $ = require("jquery")(window); var person = { name: 'Max', age: 23 }; var prop = { sex: 'Male' }; $.extend(person, prop); console.log(person); /*     输出: { name: 'Max', age: 23, sex: 'Male' } */

6. 使用下划线/Lodash 库

两个都 Underscore 和 Lodash 库提供了几种实用方法来向现有对象添加属性。

通过 Lodash 库，您可以使用任何 _.merge, _.assignIn （别名 _.extend), _.assign， 或者 _.defaults 方法。或者，如果您更喜欢 Underscore 库，您可以使用 _.extendOwn （别名： _.assign） 或者 _.defaults 方法。

如果上述所有方法有任何共同的键，则使用给定对象的属性覆盖源对象，除了 _.defaults 方法，它默默地忽略公共密钥。

1 2 3 4 5 6 7 8 9 10 11

var _ = require('lodash'); var person = { name: 'Max', age: 23 }; var prop = { sex: 'Male' }; _.merge(person, prop); console.log(person); /*     输出: { name: 'Max', age: 23, sex: 'Male' } */

这就是在 JavaScript 中向对象添加属性的全部内容