这是我的对象文字:

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

如何将值为3的字段key3添加到对象中?


当前回答

只需添加财产:

我们想将prop2:2添加到这个对象中,这是最方便的选项:

点运算符:object.prop2=2;方括号:对象['prop2']=2;

那么我们用哪一个呢?

dot运算符的语法更加简洁,应该用作默认值(imo)。但是,点运算符不能向对象添加动态关键点,这在某些情况下非常有用。下面是一个示例:

常量对象={方案1:1}const key=Math.random()>0.5?'key1':'key2';obj[key]=“此值具有动态键”;console.log(obj);

合并对象:

当我们想要合并两个对象的财产时,以下是最方便的选项:

Object.assign(),将目标对象作为参数,以及一个或多个源对象,并将它们合并在一起。例如:

常量对象1={a: 1中,b: 2,};const object2=对象分配({c: 3中,d: 4个},对象1);console.log(对象2);

对象排列运算符。。。

常量对象={prop1:1,第2部分:2}常量newObj={…对象,prop3:3,第4部分:4}console.log(newObj);

我们用哪一个?

扩展语法不那么冗长,应该用作默认的imo。不要忘记将此语法转换为所有浏览器都支持的语法,因为它相对较新。Object.assign()更加动态,因为我们可以访问作为参数传入的所有对象,并且可以在将它们分配给新对象之前对它们进行操作。

其他回答

根据ECMA-262中定义的属性访问器(http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-262.pdf,P67),有两种方法可以将财产添加到现有对象。通过这两种方式,Javascript引擎将对它们一视同仁。

第一种方法是使用点符号:

obj.key3 = value3;

但是这样,您应该在点符号后使用IdentifierName。

第二种方法是使用括号表示法:

obj["key3"] = value3;

以及另一种形式:

var key3 = "key3";
obj[key3] = value3;

这样,您可以在括号符号中使用表达式(包括标识符名称)。

在编写大型项目时,我越来越喜欢LoDash/Undercore。

通过obj['key']或obj.key添加都是纯JavaScript的可靠答案。然而,在使用对象和数组时,LoDash和Undercore库都提供了许多其他方便的功能。

.push()用于数组,而不是对象。

根据您正在查找的内容,有两个特定的函数可能很好利用,并提供类似arr.push()的功能。有关更多信息,请查看文档,其中有一些很棒的示例。

_.mmerge(仅限Lodash)

第二个对象将覆盖或添加到基础对象。不复制未定义的值。

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.merge(obj, obj2);
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3"} 

_扩展/分配

第二个对象将覆盖或添加到基础对象。将复制undefined。

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend(obj, obj2);
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

_.默认值

第二个对象包含默认值,如果它们不存在,将添加到基础对象。如果键已经存在,将复制未定义的值。

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults(obj, obj2);
console.log(obj);
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

$.扩展

此外,jQuery.extend可能值得一提,它的功能类似于_.mmerge,如果您已经在使用jQuery,它可能是一个更好的选项。

第二个对象将覆盖或添加到基础对象。不复制未定义的值。

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
$.extend(obj, obj2); 
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3"}

对象.assign()

可能值得一提的是ES6/ES2015 Object.assign,它的功能类似于_.mmerge,如果您已经在使用像Babel这样的ES6/ES2015polyfill,如果您想自己填充,它可能是最好的选择。

第二个对象将覆盖或添加到基础对象。将复制undefined。

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
Object.assign(obj, obj2); 
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

大多数浏览器都支持,它检查对象键是否可用,如果可用,它将覆盖现有的键值,如果不可用,则使用值添加键

示例1

let my_object = {};

// now i want to add something in it  

my_object.red = "this is red color";

// { red : "this is red color"}

示例2

let my_object = { inside_object : { car : "maruti" }}

// now i want to add something inside object of my object 

my_object.inside_object.plane = "JetKing";

// { inside_object : { car : "maruti" , plane : "JetKing"} }

示例3

let my_object = { inside_object : { name : "abhishek" }}

// now i want to add something inside object with new keys birth , gender 

my_object.inside_object.birth = "8 Aug";
my_object.inside_object.gender = "Male";


    // { inside_object : 
//             { name : "abhishek",
//               birth : "8 Aug",
//               gender : "Male" 
//            }   
//       }

为了给对象添加键值对,以便for In与该元素一起使用,请首先执行以下操作:

    var nwrow = {'newkey': 'value' };
    for(var column in row){
        nwrow[column] = row[column];
    }
    row = nwrow;

表演

今天2020.01.14,我在Chrome v78.0.0、Safari v13.0.4和Firefox v71.0.0上对MacOs HighSierra 10.13.6进行了测试,以获得选定的解决方案。我将解分为可变的(第一个字母M)和不可变的(第二个字母I)。我还提供了一些不可变的解决方案(IB、IC、ID/IE),这些解决方案尚未在回答这个问题时发布

结论

最快的可变解决方案比最快的不可变解决方案快得多(>10倍)像obj.key3=“abc”(MA,MB)这样的经典可变方法是最快的对于不可变的解决方案,{…obj,key3:'abc'}和Object.assign(IA,IB)是最快的令人惊讶的是,对于chrome(MC-IA)和safari(MD-IB),存在比某些可变解决方案更快的不可变解决方案

细节

在下面的片段中,有经过测试的解决方案,您可以在这里从您的机器上进行测试(2022年更新:我向Josh DeLong表示感谢,他从jspref.com重写了测试,jsbench.me停止工作)变量o={key1:真,键2:3,};var log=(s,f)=>console.log(`${s}-->${JSON.stringify(f({…o}))}`);函数MA(obj){obj.key3=“abc”;返回obj;}函数MB(obj){obj['key3']=“abc”;返回obj;}函数MC(obj){Object.assign(obj,{key3:'abc'});返回obj;}函数MD(obj){Object.defineProperty(obj,'key3'{value:“abc”,//默认情况下未定义enumerable:true,//默认为false可配置:true,//默认为false可写:默认为true//false});返回obj;}函数IA(obj){return{…obj,key3:'abc'};}函数IB(obj){return Object.assign({key3:'abc'},obj);}函数IC(obj){let ob=JSON.parse(JSON.stringify(obj))ob.key3=“abc”;返回ob;}函数ID(obj){let ob=Object.fromEntries(Object.entries(obj));ob.key3=“abc”;返回ob;}函数IE(obj){return Object.fromEntries(Object.entries(obj).contat([['key3','abc']]))}日志('MA',MA);日志('MB',MB);日志('MC',MC);日志('MD',MD);日志(‘IA’,IA);日志('IB',IB);日志('IC',IC);日志('ID',ID);日志('IE',IE);此代码段仅显示代码-它本身不执行测试!