Array.prototype.push()

基线 广泛可用

此功能已成熟，可在许多设备和浏览器版本上运行。它自以下时间开始在所有浏览器中可用 2015 年 7 月.

的 push() 方法 Array 实例将指定的元素添加到数组的末尾，并返回数组的新长度。

试试看

语法

js
push()
push(element1)
push(element1, element2)
push(element1, element2, /* …, */ elementN)

参数

element1, …, elementN

要添加到数组末尾的元素。

返回值

调用该方法的对象的新的 length 属性。

描述

该 push() 方法将值追加到数组。

Array.prototype.unshift() 的行为类似于 push()，但应用于数组的开头。

该 push() 方法是 变异方法。它会更改 this 的长度和内容。如果您希望 this 的值保持不变，但返回一个在末尾附加了元素的新数组，可以使用 arr.concat([element0, element1, /* ... ,*/ elementN])。请注意，元素被包装在一个额外的数组中——否则，如果元素本身是一个数组，它将被展开而不是作为单个元素推入，因为 concat() 的行为。

该 push() 方法是 泛型。它只期望 this 值具有 length 属性和整数键属性。尽管字符串也是类似数组的，但此方法不适合应用于它们，因为字符串是不可变的。

示例

向数组添加元素

以下代码创建了包含两个元素的 sports 数组，然后向其添加了两个元素。total 变量包含数组的新长度。

js
const sports = ["soccer", "baseball"];
const total = sports.push("football", "swimming");

console.log(sports); // ['soccer', 'baseball', 'football', 'swimming']
console.log(total); // 4

合并两个数组

此示例使用 展开语法 将第二个数组中的所有元素推入第一个数组。

js
const vegetables = ["parsnip", "potato"];
const moreVegs = ["celery", "beetroot"];

// Merge the second array into the first one
vegetables.push(...moreVegs);

console.log(vegetables); // ['parsnip', 'potato', 'celery', 'beetroot']

合并两个数组也可以使用 concat() 方法。

对非数组对象调用 push()

该 push() 方法读取 this 的 length 属性。然后，它使用传递给 push() 的参数，从 length 开始设置 this 的每个索引。最后，它将 length 设置为以前的长度加上推入元素的数量。

js
const arrayLike = {
  length: 3,
  unrelated: "foo",
  2: 4,
};
Array.prototype.push.call(arrayLike, 1, 2);
console.log(arrayLike);
// { '2': 4, '3': 1, '4': 2, length: 5, unrelated: 'foo' }

const plainObj = {};
// There's no length property, so the length is 0
Array.prototype.push.call(plainObj, 1, 2);
console.log(plainObj);
// { '0': 1, '1': 2, length: 2 }

以类似数组的方式使用对象

如上所述，push 是有意泛型的，我们可以利用这一点。Array.prototype.push 可以很好地作用于对象，如本示例所示。

请注意，我们没有创建数组来存储对象集合。相反，我们将集合存储在对象本身中，并在 Array.prototype.push 上使用 call 来欺骗该方法，使其认为我们正在处理数组——它就正常工作了，这得益于 JavaScript 允许我们以任何我们想要的方式建立执行上下文。

js
const obj = {
  length: 0,

  addElem(elem) {
    // obj.length is automatically incremented
    // every time an element is added.
    [].push.call(this, elem);
  },
};

// Let's add some empty objects just to illustrate.
obj.addElem({});
obj.addElem({});
console.log(obj.length); // 2

请注意，虽然 obj 不是数组，但 push 方法成功地递增了 obj 的 length 属性，就像我们正在处理实际的数组一样。

规范

规范
ECMAScript 语言规范
# sec-array.prototype.push

浏览器兼容性

BCD 表格仅在浏览器中加载

另请参阅