Array.prototype.slice()
åºçº¿
广æ³å¯ç¨
èª 2015å¹´7æ èµ·ï¼æ¤ç¹æ§å·²å¨ä¸»æµæµè§å¨ä¸å¾å°æ¯æï¼å¯å¨å¤§å¤æ°è®¾å¤åæµè§å¨çæ¬ä¸æ£å¸¸ä½¿ç¨ã
slice() æ¹æ³è¿åä¸ä¸ªæ°çæ°ç»å¯¹è±¡ï¼è¿ä¸å¯¹è±¡æ¯ä¸ä¸ªç± start å end å³å®çåæ°ç»çæµ
æ·è´ï¼å
æ¬ startï¼ä¸å
æ¬ 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"]
è¯æ³
slice()
slice(start)
slice(start, end)
åæ°
startå¯é-
æåèµ·å§å¤çç´¢å¼ï¼ä»
0å¼å§ï¼ï¼ä¼è½¬æ¢ä¸ºæ´æ°ã- å¦æç´¢å¼æ¯è´æ°ï¼å仿°ç»æ«å°¾å¼å§è®¡ç®ââ妿
start < 0ï¼å使ç¨start + array.lengthã - 妿
start < -array.lengthæè çç¥äºstartï¼å使ç¨0ã - 妿
start >= array.lengthï¼å䏿åä»»ä½å ç´ ã
- å¦æç´¢å¼æ¯è´æ°ï¼å仿°ç»æ«å°¾å¼å§è®¡ç®ââ妿
endå¯é-
æåç»æ¢å¤çç´¢å¼ï¼ä»
0å¼å§ï¼ï¼ä¼è½¬æ¢ä¸ºæ´æ°ãslice()伿åå°ä½ä¸å æ¬endçä½ç½®ã- å¦æç´¢å¼æ¯è´æ°ï¼å仿°ç»æ«å°¾å¼å§è®¡ç®ââ妿
end < 0ï¼å使ç¨end + array.lengthã - 妿
end < -array.lengthï¼å使ç¨0ã - 妿
end >= array.lengthæè çç¥äºendï¼å使ç¨array.lengthï¼æåææå ç´ ç´å°æ«å°¾ã - 妿
endå¨è§èååå°äºæçäºstartï¼å䏿åä»»ä½å ç´ ã
- å¦æç´¢å¼æ¯è´æ°ï¼å仿°ç»æ«å°¾å¼å§è®¡ç®ââ妿
è¿åå¼
ä¸ä¸ªå«æè¢«æåå ç´ çæ°æ°ç»ã
æè¿°
slice() æ¹æ³æ¯ä¸ä¸ªå¤å¶æ¹æ³ãå®ä¸ä¼æ¹å thisï¼èæ¯è¿åä¸ä¸ªæµ
æ·è´ï¼å
¶ä¸å
å«äºåå§æ°ç»çä¸é¨åç¸åçå
ç´ ã
slice() æ¹æ³ä¼ä¿ç空槽ãå¦æè¢«åççé¨åæ¯ç¨ççï¼åè¿åçæ°ç»ä¹æ¯ç¨ççã
slice() æ¹æ³æ¯éç¨çãå®åªè¦æ± this 䏿 length 屿§åæ´æ°é®å±æ§ã
示ä¾
>è¿åç°ææ°ç»çä¸é¨å
const fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
const citrus = fruits.slice(1, 3);
// fruits å
å« ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
// citrus å
å« ['Orange','Lemon']
ä½¿ç¨ slice
å¨ä¸ä¾ä¸ï¼slice ä» myCar å建äºä¸ä¸ªæ°æ°ç» newCarã两个æ°ç»é½å
å«äºä¸ä¸ª myHonda 对象çå¼ç¨ãå½ myHonda ç color 屿§æ¹å为 purpleï¼å两个æ°ç»ä¸ç对åºå
ç´ é½ä¼é乿¹åã
// ä½¿ç¨ 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 对象ç colorã
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,
};
console.log(Array.prototype.slice.call(arrayLike, 1, 3));
// [ 3, 4 ]
ä½¿ç¨ slice() æç±»æ°ç»å¯¹è±¡è½¬å为æ°ç»
slice() æ¹æ³ç»å¸¸ä¸ bind() å call() ä¸èµ·ä½¿ç¨ï¼ç¨äºå建ä¸ä¸ªå®ç¨æ¹æ³ï¼å°ç±»æ°ç»å¯¹è±¡è½¬æ¢ä¸ºæ°ç»ã
// è°ç¨ slice() æ¹æ³æ¶ï¼ä¼å° this 对象ä½ä¸ºç¬¬ä¸ä¸ªåæ°ä¼ å
¥
const slice = Function.prototype.call.bind(Array.prototype.slice);
function list() {
return slice(arguments);
}
const list1 = list(1, 2, 3); // [1, 2, 3]
å¨ç¨çæ°ç»ä¸ä½¿ç¨ slice()
å¦ææºæ°ç»æ¯ç¨çæ°ç»ï¼slice() æ¹æ³è¿åçæ°ç»ä¹ä¼æ¯ç¨çæ°ç»ã
console.log([1, 2, , 4, 5].slice(1, 4)); // [2, empty, 4]
è§è
| è§è |
|---|
| ECMAScript® 2027 Language Specification> # sec-array.prototype.slice> |