吐槽Javascript系列二：數組中的splice和slice方法

lookSomeone 發布于2019-08-23 15:14 / 432人閱讀

摘要：原來，它的替換功能實際上是通過刪除和添加來完成的。在只有一個參數的情況下，方法返回從該參數指定位置開始到當前數組末尾的所有項。它并不改變原數組。吐槽我曾經一直困惑數組中的刪除方法，當知道刪除這項偉大的任務竟然交給了，我心里是失望的。

戰斗英雄你當，漂亮媳婦兒你娶，怎么啥好事都被你給占了——《激情燃燒的歲月》

談起這兩個方法，新手不蒙，我是不信！正如吐槽Javascript系列一：slice()、substr()和 substring()中提到的，字符串中也有一個slice方法，極易混淆！
但其實呢，在數組中，他們還是很好區分的。

splice

splice，譯為拼接，它的功能非常強大，能夠刪除，新增，修改原數組，功能三合一哦，我們先來看它的刪除功能：

// 刪除
let colors = ["red", "green", "blue"]
let removed = colors.splice(0, 1)
console.log(removed) // [ "red" ]
console.log(colors) // [ "green", "blue" ]

上面代碼中，splice接收了二個參數，第一個參數表示要刪除的第一項的位置，第二個參數表示要刪除的項數。
我們再來看看它的添加功能：

// 添加
let colors = ["red", "green", "blue"]
let removed = colors.splice(1, 0, "yellow", "orange")
console.log(removed) // []
console.log(colors) // [ "red", "yellow", "orange", "green", "blue" ]

上面代碼中，splice接收了四個參數，第一個參數表示要刪除的第一項的位置，第二個參數表示要刪除的項數，從第三個參數開始，表示要添加的項。
我們再來看看它的替換功能：

// 替換
let colors = ["red", "green", "blue", "orange"]
let removed = colors.splice(2, 1, "yellow", )
console.log(removed) // [ "blue" ]
console.log(colors) // [ "red", "green", "yellow", "orange" ]

上面代碼中，splice接收了三個參數，第一個參數表示要刪除的第一項的位置，第二個參數表示要刪除的項數，第三個參數表示要添加的項。
原來，它的替換功能實際上是通過刪除和添加來完成的。

說完splice，接下來說slice。

slice

slice，譯為切開，我們來看例子：

let arr = ["red", "green", "blue", "yellow"]
let arr1 = arr.slice(1)
let arr2 = arr.slice(1, 2)

console.log(arr1) // [ "green", "blue", "yellow" ]
console.log(arr2) // [ "green" ]
console.log(arr) // [ "red", "green", "blue", "yellow" ]

slice接受一或兩個參數，即要返回項的起始和結束位置。在只有一個參數的情況下，slice()方法返回從該參數指定位置開始到當前數組末尾的所有項。它并不改變原數組。

吐槽splice

我曾經一直困惑數組中的刪除方法，當知道刪除這項偉大的任務竟然交給了splice，我心里是失望的。
不應該是del或者remove才像話嗎？刪除的功能它占了也就算了，添加的功能它也占了！它既能添加，也能刪除，還能拼接，那它為什么沒有七十二變？

吐槽slice

一個西瓜，被菜刀切成幾塊，這西瓜還是原來的西瓜嗎？那一個數組，被你切了幾下，那數組還是原來的數組嗎？

GPU云服務器云服務器 slice和splice的區別 javascript中的二維數組 javascript數組方法 slice方法

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/101732.html

吐槽Javascript系列一：slice()、substr()和 substring()

摘要：點評我們來看這樣一個例子給定一個字符串，要求去掉最后一個逗號。大膽假想一下，如果把踢出去，就保留和，你還會懵嗎或者更大膽一點，把和都踢出去，就只保留，我反正感覺整個世界都清靜了系列鏈接吐槽系列一和吐槽系列二數組中的和方法吐槽系列三數組的陷阱實不相瞞，對于字符串中的slice()、substr()和 substring()這三個方法，我自己很長一段時間都是理不清的，每次用都得查一下文檔...

waltr 2019-08-23 15:10 評論0 收藏0
Javascript數組系列五之增刪改和強大的 splice()

摘要：刪除數組元素的開始索引需要刪除元素的個數，插入數組的元素語法因為參數變化多樣，我們主要從三個方面來展示的用法。今天是我們介紹數組系列文章的第五篇，也是我們數組系列的最后一篇文章，只是數據系列的結束，所以大家不用擔心，我們會持續的更新干貨文章。生命不息，更新不止！今天我們就不那么多廢話了，直接干貨開始。我們在《Javascript數組系列一之棧與隊列》中描述我們是如何利用 pus...

chavesgu 2019-08-23 12:01 評論0 收藏0
吐槽Javascript系列三：數組的陷阱

摘要：雖然本系列是吐槽，但并不是為了黑，而是揭露它的一些特性怪癖，只有更好的了解它，才能更好的使用它。本篇主要介紹數組中常見的隱患點。雖然本系列是吐槽，但并不是為了黑Javascript，而是揭露它的一些特性（怪癖），只有更好的了解它，才能更好的使用它。本篇主要介紹數組中常見的隱患點。龜速的map 在數組中，map是一個功能很強大的方法，先來見識一下： let arr = [5, 2, ...

U2FsdGVkX1x 2019-08-23 15:24 評論0 收藏0
Day07 - Array Cardio 中文指南二

摘要：中文指南二作者簡介是推出的一個天挑戰。完整中文版指南及視頻教程在從零到壹全棧部落。第七天的練習是接著之前中文指南一的練習，繼續熟練數組的方法，依舊沒有頁面顯示效果，所以請打開瀏覽器的面板進行調試運行。 Day07 - Array Cardio 中文指南二作者：?liyuechun 簡介：JavaScript30 是 Wes Bos 推出的一個 30 天挑戰。項目免費提供了 30 個...

Forest10 2019-08-20 18:18 評論0 收藏0