如何在现有 Javascript 对象中添加带值的动态键？

Question

我有一个现有的 javascript 对象。

let existingObject = {
    1: {
        'prop1': 'prop1 value',
        'prop2': 'prop2 value'
    },
    2: {
        'prop1': 'prop1 value',
        'prop2': 'prop2 value'
    },
    3: {
        'prop1': 'prop1 value',
        'prop2': 'prop2 value'
    }
}

我想向该现有对象添加一个属性。我的新关键值是：

const key = 4;
const value = {
    'prop1': 'prop1 value',
    'prop2': 'prop2 value'
}

附加键和值后，我的新对象应该是，

const newObject = {
    1: {
        'prop1': 'prop1 value',
        'prop2': 'prop2 value'
    },
    2: {
        'prop1': 'prop1 value',
        'prop2': 'prop2 value'
    },
    3: {
        'prop1': 'prop1 value',
        'prop2': 'prop2 value'
    },
    4: {
        'prop1': 'prop1 value',
        'prop2': 'prop2 value'
    }
}

这里的键是一个动态值。每当我尝试附加这个键值时，键就会变成变量名。

我该如何解决这个问题？

注意：为了创建现有对象，我使用 lodash。

Answer 1

您可以使用Object.assign()并使用计算属性名称（示例{[key]: value}）来执行此操作：

let existingObject = {
    1: {'prop1': 'prop1 value', 'prop2': 'prop2 value'},
    2: {'prop1': 'prop1 value', 'prop2': 'prop2 value'},
    3: {'prop1': 'prop1 value', 'prop2': 'prop2 value'}
}

const key = 4;
const value = {'prop1': 'prop1 value', 'prop2': 'prop2 value'}

Object.assign(existingObject, {[key]: value});
console.log(existingObject);

.as-console {background-color:black !important; color:lime;}
.as-console-wrapper {max-height:100% !important; top:0;}

但是，正如其他人对您的评论，这很简单：

existingObject[key] = value;