Array.prototype.slice()
slice()
方法是 Array
实例的方法,它返回一个 浅拷贝,该拷贝包含从 start
到 end
(不包含 end
)的数组的一部分,其中 start
和 end
表示该数组中项目的索引。原始数组不会被修改。
试一试
语法
slice()
slice(start)
slice(start, end)
参数
start
可选-
开始提取的基于零的索引,转换为整数。
- 负索引从数组末尾反向计数——如果
-array.length <= start < 0
,则使用start + array.length
。 - 如果
start < -array.length
或省略start
,则使用0
。 - 如果
start >= array.length
,则返回一个空数组。
- 负索引从数组末尾反向计数——如果
end
可选-
结束提取的基于零的索引,转换为整数。
slice()
最多提取到end
,但不包括end
本身。- 负索引从数组末尾反向计数——如果
-array.length <= end < 0
,则使用end + array.length
。 - 如果
end < -array.length
,则使用0
。 - 如果
end >= array.length
或省略end
,则使用array.length
,导致提取所有直到末尾的元素。 - 如果
end
暗示的位置在start
暗示的位置之前或与之相同,则返回一个空数组。
- 负索引从数组末尾反向计数——如果
返回值
一个包含提取元素的新数组。
描述
示例
返回现有数组的一部分
const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
const citrus = fruits.slice(1, 3);
// fruits contains ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
// citrus contains ['Orange','Lemon']
在此示例中,slice(1, 3)
从索引 1
提取元素,直到但不包括索引 3
,从而产生一个新的数组 ['Orange', 'Lemon']
。
省略 end 参数
const fruits = ["Apple", "Banana", "Orange", "Mango", "Pineapple"];
const tropical = fruits.slice(2);
console.log(tropical); // ['Orange', 'Mango', 'Pineapple']
在此示例中,slice(2)
从索引 2
提取元素到数组的末尾。
使用负索引
const fruits = ["Apple", "Banana", "Orange", "Mango", "Pineapple"];
const lastTwo = fruits.slice(-2);
console.log(lastTwo); // ['Mango', 'Pineapple']
在此示例中,slice(-2)
提取数组的最后两个元素。当使用 slice
方法的负索引时,负索引从数组的末尾开始计数,从 -1
开始表示最后一个元素,-2
表示倒数第二个元素,依此类推。负索引 -2
本身包含在内,因为它 是提取的起点。
| | | | | | | S | L | I | C | E | | | | | | | -5 -4 -3 -2 -1 <--- read from reverse
使用正起始索引和负结束索引
const fruits = ["Apple", "Banana", "Orange", "Mango", "Pineapple"];
// Using positive start index and negative end index
const sliceExample = fruits.slice(1, -1);
console.log(sliceExample); // ['Banana', 'Orange', 'Mango']
在此示例中,slice(1, -1)
从索引 1
开始提取,直到但不包括索引 -1
(最后一个元素)处的元素。这将生成一个包含 ['Banana', 'Orange', 'Mango']
的新数组。slice
方法始终排除指定最终索引处的元素,无论它是正数还是负数。
read from start ---> 0 1 2 3 4 | | | | | | | S | L | I | C | E | | | | | | | -5 -4 -3 -2 -1 <--- read from reverse
将 slice 与对象数组一起使用
在以下示例中,slice
从 myCar
创建一个新数组 newCar
。两者都包含对对象 myHonda
的引用。当 myHonda
的颜色更改为紫色时,这两个数组都会反映更改。
// Using slice, create newCar from myCar.
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);
// Change the color of 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 = red newCar[0].color = red The new color of my Honda is purple myCar[0].color = purple newCar[0].color = purple
在非数组对象上调用 slice()
slice()
方法读取 this
的 length
属性。然后它从 start
到 end
读取整数键属性,并在新创建的数组上定义它们。
const arrayLike = {
length: 3,
0: 2,
1: 3,
2: 4,
3: 33, // ignored by slice() since length is 3
};
console.log(Array.prototype.slice.call(arrayLike, 1, 3));
// [ 3, 4 ]
使用 slice() 将类似数组的对象转换为数组
在稀疏数组上使用 slice()
如果源是稀疏的,则从 slice()
返回的数组可能是稀疏的。
console.log([1, 2, , 4, 5].slice(1, 4)); // [2, empty, 4]
规范
规范 |
---|
ECMAScript 语言规范 # sec-array.prototype.slice |
浏览器兼容性
BCD 表仅在启用 JavaScript 的浏览器中加载。