有条件地向 JavaScript 对象添加属性答案

【问题标题】：Conditionally adding properties to JavaScript object有条件地向 JavaScript 对象添加属性
【发布时间】：2015-07-04 06:13:42
【问题描述】：

有没有更简洁或易读的方式来做到这一点？

var foo={a:111,c:333, somePropertyThatShouldntBeAdded:'xxx'};
var myobj={x:1,y:2,z:3};
if(foo.a){myobj.a=foo.a;}
if(foo.b){myobj.b=foo.b;}
if(foo.c){myobj.c=foo.c;}

编辑。我这样做的原因如下。

var obj={value:this.text,css:{color:'#929292',margin:'1px 0px'}};
if(this.width){obj.css.width=this.width;}
if(this.type){obj.type=this.type;}
if(this.id){obj.id=this.id;}
var input=$('<input/>',obj)

【问题讨论】：

jquery.extend(myobj, foo)
@hindmost somePropertyThatShouldntBeAdded 可能会造成问题。
@user1032531 之后可以delete myobj.somePropertyThatShouldntBeAdded 吗？
@RGraham 像往常一样，猜测正确答案取决于实际情况。我是否有一堆属性要添加，只有一两个不应该添加，或者相反。
@hindmost extend() 看起来是一个很好的解决方案，如果可以对foo 应用某种过滤器以仅返回要添加的适用属性。

标签： javascript jquery oop

【解决方案1】：

你可以像这样使用三元运算符：

myobj.a = foo.a ? foo.a : undefined;

虽然它与您的 if 语句不完全相同，因为您将拥有 {a: undefined} 而不是 {}。如果您曾经枚举过对象的键，差异就会显现出来。

编辑：

@hindmost 在 cmets 中有一个很好的建议。您可以使用underscore.js 进一步改进它：

_.extend(myobj, _.pick(foo, ['a', 'b', 'c']));

【讨论】：

顺便说一句，下划线还提供了一个函数_.omit，与_.pick相反

【解决方案2】：

你可以使用jQuery的extend，然后delete你不想要的属性：

function extendExcept(sourceObject, targetObject, except) {
    var target = $.extend(sourceObject, targetObject);
    except.forEach(function(key) {
        delete target[key];
    });
    return target;
}

你可以这样称呼它：

var foo={a:111,c:333, somePropertyThatShouldntBeAdded:'xxx'};
var myobj={x:1,y:2,z:3};
myobj = extendExcept(foo, myobj, ["somePropertyThatShouldntBeAdded"]);

Working Example

【讨论】：

但是，sourceObject 上存在的 except 属性是什么？
@dev-null 有效点。我想这取决于要求

【解决方案3】：

您可以使用简单的基于循环的方法：

var foo={a:111,c:333, somePropertyThatShouldntBeAdded:'xxx'};
var myobj={x:1,y:2,z:3};

['a','b','c'].forEach(function(key) {
    if(key in foo) {
        myobj[key] = foo[key];
    }
});

注意我是如何使用in 关键字的。如果属性的值为（例如）false 或 0，则您当前的解决方案将不起作用。

此外，为了获得更好的解决方案，请提供一些上下文：为什么有条件地复制属性？也许你可以从一开始就避免这种情况。

【讨论】：

提供给原始帖子的上下文。感谢您的回复。

【解决方案4】：

var foo = {
    a: 111, 
    c: 333, 
    somePropertyThatShouldntBeAdded: 'xxx'
}; 

var myObj = {
    x: 1, 
    y: 2, 
    z: 3
}; 

for(var key in foo) {
    if(key === 'somePropertyThatShouldntBeAdded') {
        continue; 
    }
    myObj[key] = foo[key]; 
}

【讨论】：

【解决方案5】：

通过在 ES2018 中引入扩展运算符，您可以执行以下操作。

const original = {
    first: null,
    second: 'truthy'
};

const conditionalObject = {
  ...( original.first && { first: original.first }),
  ...( original.second && { second: original.second })
};

在conditionalObject 中，我们首先检查我们要从original 添加的属性是否为真，如果是，我们将该属性及其值传播到新对象中。

如果原始对象的属性是假的，&& 短路并且该属性永远不会传播到新对象中。

你可以阅读更详细的解释here

新的conditionalObject 将如下所示

{
    second: 'truthy'
}

【讨论】：