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
150
|
---
title: Array.prototype.splice()
slug: Web/JavaScript/Reference/Global_Objects/Array/splice
tags:
- Array
- JavaScript
- Method
- Prototype
- Reference
translation_of: Web/JavaScript/Reference/Global_Objects/Array/splice
---
<div>{{JSRef}}</div>
<p><code><strong>splice()</strong></code> 方法可以藉由刪除既有元素並／或加入新元素來改變一個陣列的內容。</p>
<div>{{EmbedInteractiveExample("pages/js/array-splice.html")}}</div>
<h2 id="語法">語法</h2>
<pre class="syntaxbox"><var>array</var>.splice(<var>start[</var>, <var>deleteCount[</var>, <var>item1[</var>, <var>item2[</var>, <em>...]]]]</em>)
</pre>
<h3 id="參數">參數</h3>
<dl>
<dt><code>start</code></dt>
<dd>陣列中要開始改動的元素索引（起始為 0）。若索引大於陣列長度，則實際開始的索引值會被設為陣列長度。若索引為負，則會從陣列中最後一個元素開始往前改動（起始為 -1）且若其絕對值大於陣列的長度，則會被設為 0。</dd>
<dt><code>deleteCount</code> {{optional_inline}}</dt>
<dd>一個表示欲刪除的原陣列元素數量的整數。</dd>
<dd>若省略了 <code>deleteCount</code>，或假如其值大於 <code>array.length - start</code>（也就是 <code>deleteCount</code> 大於 <code>start</code> 算起的剩餘元素數量），則所有從 <code>start</code> 開始到陣列中最後一個元素都會被刪除。</dd>
<dd>若 <code>deleteCount</code> 為 0 或是負數，則不會有元素被刪除。 因此，你應該給定至少一個欲加入的新元素（見下方說明）。</dd>
<dt><code>item1, item2, <em>...</em></code> {{optional_inline}}</dt>
<dd>從 <code>start</code> 開始，要加入到陣列的元素。 如果你沒有指定任何元素，則 <code>splice()</code> 只會依照 <code>start</code> 和 <code>deleteCount</code> 刪除陣列的元素。</dd>
</dl>
<h3 id="回傳值">回傳值</h3>
<p>一個包含被刪除的元素陣列。如果只有一個元素被刪除，依舊是回傳包含一個元素的陣列。 倘若沒有元素被刪除，則會回傳空陣列。</p>
<h2 id="說明">說明</h2>
<p>如果你插入的元素數量和刪除的數量不同，則回傳的陣列長度也會和原先的不同。</p>
<h2 id="範例">範例</h2>
<h3 id="從索引_2_的位置開始，刪除_0_個元素並插入「drum」">從索引 2 的位置開始，刪除 0 個元素並插入「drum」</h3>
<pre class="brush: js">var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
var removed = myFish.splice(2, 0, 'drum');
// myFish 為 ["angel", "clown", "drum", "mandarin", "sturgeon"]
// removed 為 [], 沒有元素被刪除
</pre>
<h3 id="從索引_3_的位置開始，刪除_1_個元素">從索引 3 的位置開始，刪除 1 個元素</h3>
<pre class="brush: js">var myFish = ['angel', 'clown', 'drum', 'mandarin', 'sturgeon'];
var removed = myFish.splice(3, 1);
// removed 為 ["mandarin"]
// myFish 為 ["angel", "clown", "drum", "sturgeon"]
</pre>
<h3 id="從索引_2_的位置開始，刪除_1_個元素並插入「trumpet」">從索引 2 的位置開始，刪除 1 個元素並插入「trumpet」</h3>
<pre class="brush: js">var myFish = ['angel', 'clown', 'drum', 'sturgeon'];
var removed = myFish.splice(2, 1, 'trumpet');
// myFish 為 ["angel", "clown", "trumpet", "sturgeon"]
// removed 為 ["drum"]</pre>
<h3 id="從索引_0_的位置開始，刪除_2_個元素並插入「parrot」、「anemone」和「blue」">從索引 0 的位置開始，刪除 2 個元素並插入「parrot」、「anemone」和「blue」</h3>
<pre class="brush: js">var myFish = ['angel', 'clown', 'trumpet', 'sturgeon'];
var removed = myFish.splice(0, 2, 'parrot', 'anemone', 'blue');
// myFish 為 ["parrot", "anemone", "blue", "trumpet", "sturgeon"]
// removed 為 ["angel", "clown"]</pre>
<h3 id="從索引_2_的位置開始，刪除_2_個元素">從索引 2 的位置開始，刪除 2 個元素</h3>
<pre class="brush: js">var myFish = ['parrot', 'anemone', 'blue', 'trumpet', 'sturgeon'];
var removed = myFish.splice(myFish.length - 3, 2);
// myFish 為 ["parrot", "anemone", "sturgeon"]
// removed 為 ["blue", "trumpet"]</pre>
<h3 id="從索引_-2_的位置開始，刪除_1_個元素">從索引 -2 的位置開始，刪除 1 個元素</h3>
<pre class="brush: js">var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
var removed = myFish.splice(-2, 1);
// myFish 為 ["angel", "clown", "sturgeon"]
// removed 為 ["mandarin"]</pre>
<h3 id="從索引_2_的位置開始，刪除所有元素（含索引_2）">從索引 2 的位置開始，刪除所有元素（含索引 2）</h3>
<pre class="brush: js">var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
var removed = myFish.splice(2);
// myFish 為 ["angel", "clown"]
// removed 為 ["mandarin", "sturgeon"]</pre>
<h2 id="規範">規範</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">規範</th>
<th scope="col">狀態</th>
<th scope="col">備註</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.12', 'Array.prototype.splice')}}</td>
<td>{{Spec2('ES5.1')}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName('ES6', '#sec-array.prototype.splice', 'Array.prototype.splice')}}</td>
<td>{{Spec2('ES6')}}</td>
<td> </td>
</tr>
<tr>
<td>{{SpecName('ESDraft', '#sec-array.prototype.splice', 'Array.prototype.splice')}}</td>
<td>{{Spec2('ESDraft')}}</td>
<td> </td>
</tr>
</tbody>
</table>
<h2 id="瀏覽器相容性">瀏覽器相容性</h2>
<div>
<p>{{Compat("javascript.builtins.Array.splice")}}</p>
</div>
<h2 id="參見">參見</h2>
<ul>
<li>{{jsxref("Array.prototype.push()", "push()")}} / {{jsxref("Array.prototype.pop()", "pop()")}} — add/remove elements from the end of the array</li>
<li>{{jsxref("Array.prototype.unshift()", "unshift()")}} / {{jsxref("Array.prototype.shift()", "shift()")}} — add/remove elements from the beginning of the array</li>
<li>{{jsxref("Array.prototype.concat()", "concat()")}} — returns a new array comprised of this array joined with other array(s) and/or value(s)</li>
</ul>
|
