1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
|
---
title: Array.prototype.push()
slug: Web/JavaScript/Reference/Global_Objects/Array/push
tags:
- Array
- Array.prototype.push()
- JavaScript
- Method
- Prototype
- 参考
- 数组
- 方法
translation_of: Web/JavaScript/Reference/Global_Objects/Array/push
---
<div>{{JSRef}}</div>
<p><code><strong>push()</strong></code> 方法将一个或多个元素添加到数组的末尾，并返回该数组的新长度。</p>
<div>{{EmbedInteractiveExample("pages/js/array-push.html")}}</div>
<h2 id="语法">语法</h2>
<pre class="syntaxbox">arr.push(element1, ..., elementN)
</pre>
<h3 id="参数">参数</h3>
<dl>
<dt><code>element<em>N</em></code></dt>
<dd>被添加到数组末尾的元素。</dd>
</dl>
<h3 id="返回值" style="line-height: 24px;">返回值</h3>
<p>当调用该方法时，新的 {{jsxref("Array.length", "length")}} 属性值将被返回。</p>
<h2 id="Description" name="Description" style="margin-bottom: 20px; line-height: 30px;">描述</h2>
<p>push方法将值追加到数组中。</p>
<p><code>push</code> 方法具有通用性。该方法和 {{jsxref("Function.call", "call()")}} 或 {{jsxref("Function.apply", "apply()")}} 一起使用时，可应用在类似数组的对象上。<code>push</code> 方法根据 <code>length</code> 属性来决定从哪里开始插入给定的值。如果 <code>length</code> 不能被转成一个数值，则插入的元素索引为 0，包括 <code>length</code> 不存在时。当 <code>length</code> 不存在时，将会创建它。</p>
<p>唯一的原生类数组（array-like）对象是 {{jsxref("Global_Objects/String", "Strings")}}，尽管如此，它们并不适用该方法，因为字符串是不可改变的。</p>
<h2 id="示例">示例</h2>
<h3 id="添加元素到数组">添加元素到数组</h3>
<p>下面的代码创建了 <code>sports</code> 数组，包含两个元素，然后又把两个元素添加给它。<code>total</code> 变量为数组的新长度值。</p>
<pre class="brush: js">var sports = ["soccer", "baseball"];
var total = sports.push("football", "swimming");
console.log(sports);
// ["soccer", "baseball", "football", "swimming"]
console.log(total);
// 4</pre>
<h3 id="合并两个数组">合并两个数组</h3>
<p>该示例使用 {{jsxref("Function.apply", "apply()")}} 添加第二个数组的所有元素。</p>
<p>注意当第二个数组(如示例中的moreVegs)太大时不要使用这个方法来合并数组，因为事实上一个函数能够接受的参数个数是有限制的。具体可以参考 {{jsxref("Function.apply", "apply()")}} 。</p>
<pre class="brush: js">var vegetables = ['parsnip', 'potato'];
var moreVegs = ['celery', 'beetroot'];
// 将第二个数组融合进第一个数组
// 相当于 vegetables.push('celery', 'beetroot');
Array.prototype.push.apply(vegetables, moreVegs);
console.log(vegetables);
// ['parsnip', 'potato', 'celery', 'beetroot']</pre>
<h3 id="像数组一样使用对象">像数组一样使用对象</h3>
<p>如上所述，push 是特意设计为通用的，我们可以使用它来获得便利。正如下面的例子所示，Array.prototype.push 可以在一个对象上工作。 注意，我们没有创建一个数组来存储对象的集合。 相反，我们将该集合存储在对象本身上，并使用在 Array.prototype.push 上使用的 <code>call</code> 来调用该方法，使其认为我们正在处理数组，而它只是像平常一样运作，这要感谢 JavaScript 允许我们建立任意的执行上下文。</p>
<pre class="brush: js">var obj = {
length: 0,
addElem: function 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</pre>
<p>注意，尽管 obj 不是数组，但是 push 方法成功地使 obj 的 length 属性增长了，就像我们处理一个实际的数组一样。</p>
<h2 id="规范">规范</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
<tr>
<td>{{SpecName('ES3')}}</td>
<td>{{Spec2('ES3')}}</td>
<td>Initial definition. Implemented in JavaScript 1.2.</td>
</tr>
<tr>
<td>{{SpecName('ES5.1', '#sec-15.4.4.7', 'Array.prototype.push')}}</td>
<td>{{Spec2('ES5.1')}}</td>
<td></td>
</tr>
<tr>
<td>{{SpecName('ES6', '#sec-array.prototype.push', 'Array.prototype.push')}}</td>
<td>{{Spec2('ES6')}}</td>
<td></td>
</tr>
<tr>
<td>{{SpecName('ESDraft', '#sec-array.prototype.push', 'Array.prototype.push')}}</td>
<td>{{Spec2('ESDraft')}}</td>
<td></td>
</tr>
</tbody>
</table>
<h2 id="浏览器兼容性">浏览器兼容性</h2>
<div>
<div>
<p>{{Compat("javascript.builtins.Array.push")}}</p>
</div>
</div>
<h2 id="相关链接">相关链接</h2>
<ul>
<li>{{jsxref("Array.prototype.pop()")}}</li>
<li>{{jsxref("Array.prototype.shift()")}}</li>
<li>{{jsxref("Array.prototype.unshift()")}}</li>
<li>{{jsxref("Array.prototype.concat()")}}</li>
</ul>
|
