WEB 教程
实践 示例
HTML 参考手册
CSS 参考手册
PHP 参考手册

如何合并两个 JavaScript 对象的属性

主题:JavaScript / jQuery上一页|下一页

答案:使用展开运算符 (...)

您可以简单地使用扩展运算符 (...) 在 JavaScript 中将两个或多个对象合并为一个。

让我们看一个例子来了解它的基本工作原理:

// Sample objects
var obj1 = { make: "Audi", model: "Q8" };
var obj2 = { color: "Blue", year: 2021 };

// 合并对象
var mergedObj = { ...obj1, ...obj2 };

console.log(mergedObj); 
// Prints: {make: "Audi", model: "Q8", color: "Blue", year: 2021}

请注意,如果列表中稍后出现的对象属性具有相同的名称或键,则它们将覆盖之前的对象属性。 为了更好地理解这一点,让我们看一个例子:

// Sample objects
var obj1 = { name: "John", age: 24 };
var obj2 = { name: "Alice", gender: "female" };

// Merging objects
var mergedObj = { ...obj1, ...obj2 };

console.log(mergedObj);
// Prints: {name: "Alice", age: 24, gender: "female"}

如上所示,obj1 中的 name 属性被 obj2 中的 name 属性覆盖。

或者,您可以使用 Object.assign() 方法将所有属性从一个或多个源对象复制到目标对象。 让我们尝试一个示例,看看它是如何工作的:

// Sample objects
var target = { a: "Apple", b: "Ball" };
var source = { x: 1, y: 4 };

// 将源对象合并到目标对象
var returnedTarget = Object.assign(target, source);

console.log(returnedTarget);
// Prints: {a: "Apple", b: "Ball", x: 1, y: 4}

console.log(target);
// Prints: {a: "Apple", b: "Ball", x: 1, y: 4}

请注意,只有参数列表中的第一个对象会被修改并返回。 此外,如果它们具有相同的名称,则后面的属性将覆盖早期的属性。

请参阅 JavaScript 对象 上的教程,了解有关创建和操作对象的更多信息。


FAQ 相关问题解答

以下是与此主题相关的更多常见问题解答:

Advertisements