Array.prototype.slice()
BaselineWidely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
slice() はArray インスタンスのメソッドで、配列の一部をstart からend （end は含まれない）までの範囲で、選択した新しい配列オブジェクトにシャローコピーして返します。ここでstart とend はその配列に含まれる項目のインデックスを表します。元の配列は変更されません。
試してみましょう
const animals = ["ant", "bison", "camel", "duck", "elephant"];console.log(animals.slice(2));// Expected output: Array ["camel", "duck", "elephant"]console.log(animals.slice(2, 4));// Expected output: Array ["camel", "duck"]console.log(animals.slice(1, 5));// Expected output: Array ["bison", "camel", "duck", "elephant"]console.log(animals.slice(-2));// Expected output: Array ["duck", "elephant"]console.log(animals.slice(2, -1));// Expected output: Array ["camel", "duck"]console.log(animals.slice());// Expected output: Array ["ant", "bison", "camel", "duck", "elephant"]構文
js
slice()slice(start)slice(start, end)引数
start省略可抽出を始める位置のゼロから始まるインデックスで、整数に変換されます。
- インデックスが負の場合、配列の末尾からさかのぼって数えます。
start < 0の場合、start + array.lengthが使用されます。 start < -array.lengthまたはstartが省略された場合は0が使用されます。start >= array.lengthの場合、何も抽出されません。
- インデックスが負の場合、配列の末尾からさかのぼって数えます。
end省略可抽出し終える位置のゼロから始まるインデックスで、整数に変換されます。
slice()はendを含まず、その直前までを抽出します。- インデックスが負の場合、配列の末尾からさかのぼって数えます。
end < 0の場合、end + array.lengthが使用されます。 end < -array.lengthの場合は0が使用されます。end >= array.lengthまたはendが省略された場合はarray.lengthが使用され、最後まですべての要素が抽出されます。- 正規化後に
endがstartより前か同じ位置になった場合、何も抽出されません。
- インデックスが負の場合、配列の末尾からさかのぼって数えます。
返値
取り出された要素を含む新しい配列です。
解説
例
既存の配列の一部を返す
js
const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];const citrus = fruits.slice(1, 3);// fruits には ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango'] が含まれる// citrus には ['Orange','Lemon'] が含まれるslice の使用
以下の例で、slice は新しい配列newCar をmyCar から生成します。両者ともオブジェクトmyHonda への参照を含んでいます。myHonda の色が purple に変更されると、両方の要素がその変更を反映します。
js
// slice を使って、myCar から newCar を生成する。const myHonda = { color: "red", wheels: 4, engine: { cylinders: 4, size: 2.2 },};const myCar = [myHonda, 2, "cherry condition", "purchased 1997"];const newCar = myCar.slice(0, 2);console.log("myCar =", myCar);console.log("newCar =", newCar);console.log("myCar[0].color =", myCar[0].color);console.log("newCar[0].color =", newCar[0].color);// myHonda の色を変える。myHonda.color = "purple";console.log("The new color of my Honda is", myHonda.color);console.log("myCar[0].color =", myCar[0].color);console.log("newCar[0].color =", newCar[0].color);このスクリプトの出力は次の様になります。
myCar = [ { color: 'red', wheels: 4, engine: { cylinders: 4, size: 2.2 } }, 2, 'cherry condition', 'purchased 1997']newCar = [ { color: 'red', wheels: 4, engine: { cylinders: 4, size: 2.2 } }, 2 ]myCar[0].color = rednewCar[0].color = redThe new color of my Honda is purplemyCar[0].color = purplenewCar[0].color = purple配列以外のオブジェクトに対する slice() の呼び出し
slice() メソッドはthis のlength プロパティを読み込みます。そして、start からend までの整数キーのプロパティを読み込み、新しく作成した配列に定義します。
js
const arrayLike = { length: 3, 0: 2, 1: 3, 2: 4, 3: 33, // length が 3 であるので slice() から無視される};console.log(Array.prototype.slice.call(arrayLike, 1, 3));// [ 3, 4 ]slice() を用いて配列風オブジェクトを配列に変換
疎配列に対する slice() の使用
slice() から返される配列は、元の配列が疎配列であれば疎配列になります。
js
console.log([1, 2, , 4, 5].slice(1, 4)); // [2, empty, 4]仕様書
| Specification |
|---|
| ECMAScript® 2026 Language Specification # sec-array.prototype.slice |