如何向 JavaScript 对象添加键/值对?2017年答案:Object.assign() 2018年答案:对象传播运算符{...} 2019年答案

2022-08-29 21:56:41

这是我的对象文字:

var obj = {key1: value1, key2: value2};

如何将字段添加到对象?key3value3


答案 1

有两种方法可以向对象添加新属性

var obj = {
    key1: value1,
    key2: value2
};

使用点表示法:

obj.key3 = "value3";

使用方括号表示法:

obj["key3"] = "value3";

当您知道属性的名称时,将使用第一个窗体。第二种形式是在动态确定属性名称时使用的。如以下示例所示:

var getProperty = function (propertyName) {
    return obj[propertyName];
};

getProperty("key1");
getProperty("key2");
getProperty("key3");

个真正的JavaScript数组可以使用以下任一方式构建:

数组文本表示法:

var arr = [];

数组构造函数表示法:

var arr = new Array();

答案 2

2017年答案:Object.assign()

Object.assign(dest, src1, src2, ...)合并对象。

它用源对象的属性和值(无论有多少)覆盖,然后返回 。destdest

该方法用于将所有可枚举自己的属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。Object.assign()

实际示例

var obj = {key1: "value1", key2: "value2"};
Object.assign(obj, {key3: "value3"});

document.body.innerHTML = JSON.stringify(obj);

2018年答案:对象传播运算符{...}

obj = {...obj, ...pair};

来自 MDN

它将自己的可枚举属性从提供的对象复制到新对象上。

浅层克隆(不包括原型)或对象合并现在可以使用比Object.assign()更短的语法。

请注意,Object.assign() 会触发 setter,而 spread 语法则不会。

实际示例

它适用于当前的Chrome和当前的Firefox。他们说它在当前的Edge中不起作用。

var obj = {key1: "value1", key2: "value2"};
var pair = {key3: "value3"};
obj = {...obj, ...pair};

document.body.innerHTML = JSON.stringify(obj);

2019年答案

对象赋值运算符 +=

obj += {key3: "value3"};

哎呀。。。我被带走了。从未来走私信息是非法的。被遮蔽了!