如何在JavaScript中向对象追加值

11,651 阅读3分钟

对象是编程语言中最重要的实体,因为它具有不可变的属性。有了这个属性,开发者可以通过对象来操作不同的任务。将不同的值追加到一个现有的对象上是为了对对象进行运行时的改变。JavaScript提供了各种内置的方法来向JavaScript中的对象追加值。在这篇文章中,我们将展示所有可能的方法,并举例说明在JavaScript中向对象追加值。本帖为以下学习成果服务。

方法1:使用Object.assign()方法在JavaScript中向对象添加值

Object.assign() 方法是一个著名的向对象追加值的方法。它需要两个参数。第一个参数代表目标对象,第二个参数是键/值对。Object.assign() 方法的语法提供如下。

语法

Object.assign(target, source);

这里对参数进行了描述。

  • target:指定值将被附加到哪个对象上。
  • source:指的是被附加的值。

让我们通过下面的示例代码来理解这个方法的工作。

代码

console.log("An example to use assign() method");

let user_obj = {

1: { name: "Adam" },

2: { name: "Harry" },

};

let obj = Object.assign(user_obj, { 3: { name: "Jasam" } });

console.log(obj);

在这段代码中。

  • 首先,"Adam " 和"Harry "被分配为"name " 属性的值。
  • 利用Object.assign()方法为"user_obj "对象添加一个"Jasam " 值。
  • 最后,console.log() 方法被用来在控制台窗口中显示所有的值。

输出结果

从输出中可以看出,新的值被成功地添加到对象中。

方法2:使用push()方法向JavaScript中的数组对象添加值

push()方法可以用来向一个数组添加或插入一个或多个值。这个方法在追加数值后返回一个新的数组。让我们通过下面的语法看看它是否有效。

语法

arr.push(value1, value2, ..., valueN)

在这个语法中,"value1"、"value2 ""valueN " 是要追加到 "arr"变量的值。

代码

console.log("An example to use assign() method");

const sports = ['cricket', 'hockey', 'football'];

const counter = sports.push('basketball');

console.log(counter);

console.log(sports);

这里提供了代码的描述。

  • 一个名为"体育" 的数组被创建,其中包括三个元素,即"板球"、"曲棍球"和"足球"。
  • 之后,使用JavaScript中的 sports.push() 方法追加了 "篮球 " 的值。
  • 最后, console.log()方法将数组显示在控制台窗口

输出结果

输出显示,通过使用 push() 方法,"basketball " 值被添加到体育 对象中。

方法3:使用spread (...)操作符在JavaScript中向对象添加值

Spread (...)操作符被用来向JavaScript中的对象追加值。它对于将对象合并到一个地方很有用。下面是传播操作符的语法。

语法

{...obj, key: 'value' }

在这个语法中,"值 " 被分配给对象obj中的

下面提供了传播操作符的示例代码,用于向一个对象添加值。

代码

console.log("An example to use spread operator");

let obj1 = {name: 'Harry'};

obj2 = {...obj1, color: 'white'};

console.log(obj2);

在这段代码中。

  • 一个"obj1"通过赋值"Harry "被利用来存储元素名称
  • 之后,"white "值追加到"obj1"。
  • 最后,console.log()方法在控制台窗口显示附加的值。

输出

输出显示了新的对象 "obj2",它包含了对象 "obj1"的值以及附加的值 "white"。

总结

JavaScript提供了两个方法,即Object.assign()push(),用来向一个对象添加值。

Object.assign()方法通过键/值对向对象追加值。push()方法将一个或多个值添加到一个数组中。然而,spread ( ...)操作符也可以用来向一个对象追加值。这篇文章展示了在JavaScript中向一个对象追加值的所有可能性。