欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Javascript數(shù)組的?splice?方法詳細介紹

 更新時間：2022年09月27日 10:21:23   作者：阿常囈  
這篇文章主要介紹了Javascript數(shù)組的splice方法詳細介紹，splice方法通過刪除或替換現(xiàn)有元素或者原地添加新的元素來修改數(shù)組,并以數(shù)組形式返回被修改的內(nèi)容。此方法會改變原數(shù)組

前言

splice() 方法通過刪除或替換現(xiàn)有元素或者原地添加新的元素來修改數(shù)組,并以數(shù)組形式返回被修改的內(nèi)容。此方法會改變原數(shù)組。

語法格式：

array.splice(start[, deleteCount[, item1[, item2[, ...]]]])

參數(shù)：

  • start 必選

指定修改的開始位置（從0計數(shù)）。如果超出了數(shù)組的長度，則從數(shù)組末尾開始添加內(nèi)容；如果是負值，則表示從數(shù)組末位開始的第幾位（從-1計數(shù)，這意味著-n是倒數(shù)第n個元素并且等價于array.length-n）；如果負數(shù)的絕對值大于數(shù)組的長度，則表示開始位置為第0位。

  • deleteCount 可選

整數(shù)，表示要移除的數(shù)組元素的個數(shù)。如果 deleteCount 大于 start 之后的元素的總數(shù)，則從 start 后面的元素都將被刪除（含第 start 位）。如果 deleteCount 被省略了，或者它的值大于等于array.length - start(也就是說，如果它大于或者等于start之后的所有元素的數(shù)量)，那么start之后數(shù)組的所有元素都會被刪除。如果 deleteCount 是 0 或者負數(shù)，則不移除元素。這種情況下，至少應(yīng)添加一個新元素。

  • item1, item2, *...* 可選

要添加進數(shù)組的元素,從start 位置開始。如果不指定，則 splice() 將只刪除數(shù)組元素。

返回值：由被刪除的元素組成的一個數(shù)組。如果只刪除了一個元素，則返回只包含一個元素的數(shù)組。如果沒有刪除元素，則返回空數(shù)組。

描述：如果添加進數(shù)組的元素個數(shù)不等于被刪除的元素個數(shù)，數(shù)組的長度會發(fā)生相應(yīng)的改變。

牛刀小試

現(xiàn)在有一個場景，我和我的室友們，現(xiàn)在在一個數(shù)組里面。 按照排行分別為: 老大，老二，老三, … ,老六, 小七.

這里 我用 下面的數(shù)組進行舉例

var arr = ['Liu laoda','Li laoer','Wei laosan','Frank','Guan laowu','Yang laoliu','Li xiaoqi'];

刪除元素

刪除一個元素,刪除 某個位置的元素

var arr = ['Liu laoda','Li laoer','Wei laosan','Frank'];

// start 開始位置，從零開始 ， deleteCount 刪除個數(shù),從1 開始
// arr.splice(start,count)
// 刪除第0位置的一個元素
arr.splice(0,1);
console.log('arr=',arr);

可以看到 第0號位置 'Liu laoda' 被刪除了。

刪除前面兩個元素

var arr = ['Liu laoda','Li laoer','Wei laosan','Frank'];
// 刪除 前兩個元素
arr.splice(0,2);
console.log('arr=',arr);  // ['Wei laosan', 'Frank']

添加元素 并且替換元素

splice 刪除元素后 會返回被刪除的元素，返回類型是一個 Array 類型.

example1

這里可以進行元素替換，替換之后直接會影響 原來的數(shù)組的。返回的是刪除的數(shù)組元素

var arr = ['Liu laoda','Li laoer','Wei laosan','Frank'];

// 添加元素,刪除元素 用 Guan laowu 替換掉
// 從1號位置刪除一個元素，插入 元素 'Guan laowu'
// 返回被刪除的元素
console.log('before arr=',arr);
var removed = arr.splice(1, 1, 'Guan laowu');
console.log('arr=',arr);
console.log('removed=',removed);   // removed.constructor.name  == Array

example2

刪除的個數(shù)和添加的元素的個數(shù)可以是不一樣的。

var arr = ['Liu laoda','Li laoer','Wei laosan','Frank'];
console.log('before arr=',arr);
// 刪除 idx=1的元素,并且 添加 在此位置 依次添加4個元素。
var removed = arr.splice(1, 1, 'Guan laowu','A','B','C');
console.log('arr=',arr);
console.log('removed=',removed);   // removed.constructor.name  == Array

example3

刪除元素的例子，如果沒有在第三個參數(shù)上有任何元素，則表示刪除元素了。

start 開始位置 ，deleteCount 刪除個數(shù)，如果刪除的個數(shù)大于數(shù)組本身長度，則全部刪除了。

var arr = ['Liu laoda', 'Li laoer', 'Wei laosan', 'Frank','Guan Laowu','Yang Laoliu','Li xiaoqi'];
console.log('before arr=', arr);
// 從數(shù)組 下標為2的位置, 刪除3個元素
var removed = arr.splice(2, 3);  // ['Wei laosan', 'Frank', 'Guan Laowu']
console.log('arr=', arr); //['Liu laoda', 'Li laoer', 'Yang Laoliu', 'Li xiaoqi']
console.log('removed=', removed);// ['Wei laosan', 'Frank', 'Guan Laowu']

注意這里刪除元素 直接對原來的數(shù)組修改， 返回值 就是刪除的元素的數(shù)組。

同時數(shù)組的length 屬性，維護成正確的值。

example4

如果刪除的元素個數(shù)，超過了后面到數(shù)組的最大長度，則后面的元素全部被刪除了。

比如 從下標2 后面有 5個元素， 此時 deleteCount = 10 ,那么 后面的元素下標>=2 ，全部刪除掉

			var arr = ['Liu laoda', 'Li laoer', 'Wei laosan', 'Frank','Guan Laowu','Yang Laoliu','Li xiaoqi'];
			console.log('before arr=', arr);
			// 從數(shù)組 下標為2的位置, 刪除10個元素
			var removed = arr.splice(2, 10);  // ['Wei laosan', 'Frank', 'Guan Laowu']
			console.log('arr=', arr); // ['Liu laoda', 'Li laoer']
			console.log('removed=', removed);// ['Wei laosan', 'Frank', 'Guan Laowu', 'Yang Laoliu', 'Li xiaoqi']

添加元素

example1

在idx=2 的位置 添加 ‘Frank’ 元素，

此時 只要把 deleteCount = 0,表示 刪除0個元素 ,表示在此位置上添加元素。

var arr = ['Liu laoda','Li laoer','Wei laosan',];
console.log('before arr=',arr);
// 在 idex=2 的位置 添加 'Frank' 元素
var removed = arr.splice(2, 0,'Frank');
console.log('arr=',arr);
console.log('removed=',removed);

example2

在數(shù)組的頭部添加元素, Frank

var arr = ['Liu laoda','Li laoer','Wei laosan',];
console.log('before arr=',arr);
// 在 idex=0 的位置 添加 'Frank' 元素
var removed = arr.splice(0, 0,'Frank');
console.log('arr=',arr);
console.log('removed=',removed);  // []

在數(shù)組尾部添加元素, Frank

var arr = ['Liu laoda','Li laoer','Wei laosan'];
console.log('before arr=',arr);
// 在數(shù)組 尾部 添加 Frank
var removed = arr.splice(arr.length, 0,'Frank');
console.log('arr=',arr);  
console.log('removed=',removed);  // []

負數(shù)索引支持

刪除后面兩個元素

// 負數(shù)索引
var arr = ['Liu laoda', 'Li laoer', 'Wei laosan', 'Frank','Guan Laowu'];
console.log('before arr=', arr);
// 刪除后兩個元素
var removed = arr.splice(-2);  
console.log('arr=', arr); // ['Liu laoda', 'Li laoer', 'Wei laosan']
console.log('removed=', removed); // ['Frank', 'Guan Laowu']

刪除數(shù)組最后一個元素

var arr = ['Liu laoda', 'Li laoer', 'Wei laosan', 'Frank','Guan Laowu'];
console.log('before arr=', arr);
// 刪除后1個元素
var removed = arr.splice(-1);  
console.log('arr=', arr);  // ['Liu laoda', 'Li laoer', 'Wei laosan', 'Frank']
console.log('removed=', removed);  // ['Guan Laowu']

總結(jié)

array.splice(start[, deleteCount[, item1[, item2[, ...]]]]) 這個函數(shù) 可以實現(xiàn) 對數(shù)組的增加，刪除 ，替換。

start 就是開始的下標位置，必選參數(shù).

deleteCount 刪除多少個元素 ， 如果沒有指定那么 一直會刪除到數(shù)組的最后位置。

最后 一個參數(shù)，表示 刪除后要填充其他的元素，如果要就寫入填入的元素即可。如果不需要，就是單純的刪除元素。

到此這篇關(guān)于Javascript數(shù)組的 splice 方法詳細介紹的文章就介紹到這了,更多相關(guān)Javascrip splice 內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

相關(guān)文章

  • WEB高性能開發(fā)之瘋狂的HTML壓縮

    WEB高性能開發(fā)之瘋狂的HTML壓縮

    一篇隨筆中網(wǎng)友 skyaspnet 問我如何壓縮HTML，當時回答是推薦他使用gzip，后來想想，要是能把所有的html，jsp(aspx)在運行前都壓縮成1行未免不是一件好事啊。
    2010-06-06
  • JAVASCRIPT實現(xiàn)的WEB頁面跳轉(zhuǎn)以及頁面間傳值方法

    JAVASCRIPT實現(xiàn)的WEB頁面跳轉(zhuǎn)以及頁面間傳值方法

    在WEB頁面中，我們實現(xiàn)頁面跳轉(zhuǎn)的方法通常是用LINK,BUTTON LINK ,IMG LINK等等，由用戶點擊某處，然后直接由瀏覽器幫我們跳轉(zhuǎn)。
    2010-05-05
  • uniapp中使用vuex并持久化的方法示例

    uniapp中使用vuex并持久化的方法示例

    vuex是基于vuex.js的狀態(tài)管理工具,可以把它理解為一個倉庫,下面這篇文章主要給大家介紹了關(guān)于uniapp中如何使用vuex并持久化的相關(guān)資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下
    2023-06-06
  • 網(wǎng)絡(luò)圖片延遲加載實現(xiàn)代碼 超越j(luò)query控件

    網(wǎng)絡(luò)圖片延遲加載實現(xiàn)代碼 超越j(luò)query控件

    原理是分段加載圖片，主要用于大型網(wǎng)站節(jié)省帶寬，可是他們提供的東西壓縮混淆看不清，還有的要基于什么雅虎的什么庫，總之是很麻煩的，JQ的控件倒是夠清晰了，只是還是沒有達到節(jié)省網(wǎng)絡(luò)帶寬的效果
    2010-03-03
  • js復制網(wǎng)頁內(nèi)容并兼容各主流瀏覽器的代碼

    js復制網(wǎng)頁內(nèi)容并兼容各主流瀏覽器的代碼

    js 復制網(wǎng)頁內(nèi)容的方法代碼有很多不過要兼容各瀏覽器就不多了，下面有個不錯的方法，大家可以嘗試操作下
    2013-12-12
  • javascript實現(xiàn)的時間格式加8小時功能示例

    javascript實現(xiàn)的時間格式加8小時功能示例

    這篇文章主要介紹了javascript實現(xiàn)的時間格式加8小時功能,涉及javascript日期時間轉(zhuǎn)換與運算相關(guān)操作技巧,需要的朋友可以參考下
    2019-06-06
  • 手把手15分鐘搭一個企業(yè)級腳手架

    手把手15分鐘搭一個企業(yè)級腳手架

    這篇文章主要介紹了手把手15分鐘搭一個企業(yè)級腳手架，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
    2019-09-09
  • JavaScript中setTimeout()的具體用法

    JavaScript中setTimeout()的具體用法

    本文主要介紹了JavaScript中setTimeout()的具體用法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
    2023-04-04
  • JavaScript實現(xiàn)帶有子菜單和控件的slider輪播圖效果

    JavaScript實現(xiàn)帶有子菜單和控件的slider輪播圖效果

    本文通過實例代碼給大家介紹了基于js實現(xiàn)帶有子菜單和控件的slider輪播圖效果，本文附有圖片和示例代碼，非常不錯，具有參考借鑒價值，需要的朋友參考下吧
    2017-11-11
  • 通過javascript進行UTF-8編碼的實現(xiàn)方法

    通過javascript進行UTF-8編碼的實現(xiàn)方法

    下面小編就為大家?guī)硪黄ㄟ^javascript進行UTF-8編碼的實現(xiàn)方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
    2016-06-06

最新評論