方法:1、用shift()刪除第一個元素,語法「陣列.shift()」;2、用pop()刪除最後一個元素,語法「陣列.pop()」;3、用length刪除最後一個元素,語法「陣列.length=原陣列長度-1」;4、用delete刪除指定下標的一個元素,語法「delete 陣列名[下標]」;5、用splice()刪除任意位置的一個元素,語法「陣列.splice(位置,1)」。
前端(vue)入門到精通課程:進入學習
API 檔案、設計、偵錯、自動化測試一體化共同作業工具:
本教學操作環境:windows7系統、ECMAScript 6版、Dell G3電腦。
方法1:使用shift()函數刪除第一個陣列元素
array.shift()函數可以把陣列的第一個元素從其中刪除,並返回第一個元素的值;然後將餘下所有元素前移 1 位,以填補陣列頭部的空缺。
var a = [1,2,3,4,5,6,7,8]; //定義陣列
a.shift();
console.log(a);
登入後複製
輸出結果為:
注:shift()方法會改變原陣列,修改陣列的長度!
方法2:使用pop()刪除最後一個陣列元素
array.pop()方法可以刪除陣列 array 中最後一個元素,並返回被刪除的元素。
var a = [1,2,3,4,5,6,7,8]; //定義陣列
a.pop();
console.log(a)
登入後複製
輸出結果為:
注:pop()方法也會改變原陣列,修改陣列的長度!
方法3:利用length屬性刪除最後一個陣列元素
陣列的length屬性一般是用來設定或返回陣列中元素的數目,即設定或返回陣列長度。
我們可以利用設定陣列長度的特性,將length屬性的設定的比原長度小,即可從陣列尾部刪除一個或多個元素;如果值設定為0,就會刪除全部陣列,即清空陣列!
語法:陣列物件.length=原陣列長度-1;
範例:
var a = [1,2,3,4,5,6,7,8]; //定義陣列
console.log(a)
a.length=7;
console.log(a)
登入後複製
方法4:利用delete運運算元刪除指定下標的一個元素
我們都知道陣列中的每個元素都有一個序號,這個序號從0開始,被稱為下標(Index)。根據這個陣列下標,我們可以使用 陣列名[下標]
的形式來存取指定下標的元素。
存取到指定元素後,就可以利用 delete
運運算元 來刪除該元素,但陣列長度不會發生改變;刪除後的該元素會變為空位元素,
var arr=new Array("香蕉","蘋果","梨子","橙子","橘子","榴蓮");
console.log(arr);
delete arr[1]; //刪除下標為1的元素(第二個元素)
console.log(arr);
登入後複製
空位元素可以讀寫,length 屬性不排斥空位,空元素位返回值為 undefined
console.log(arr[1]);
登入後複製
說明:空元素與元素的值為 undefined 是兩個不同的概念,即使空元素的返回值也是 undefined。JavaScript 在初始化陣列時,只有真正儲存有值得元素才可以分配記憶體。
方法5:使用 splice() 刪除任意位置的一個元素
使用splice()可以從指定下標位置開始刪除一個或多個元素。
刪除元素的語法:
array.splice(index,howmany)
登入後複製
第1個引數 index
可以指定起始下標位置(即開始刪除元素的位置);
第2個引數 howmany
指定應該刪除的元素數目(即需要刪除的一個或多個元素)。
只需要將第2個引數 howmany
設定為1,即刪除任意index位置的一個元素。
我們通過下面的例子來具體看看:
var arr= [1,2,3,4,5];
console.log(arr);
arr.splice(1,1);
console.log(arr);
登入後複製
利用splice() 方法我們也可以實現在陣列開頭和末尾刪除元素的操作:
如果想要在陣列開頭刪除元素,就設定該方法第1個引數index的值為0即可
var arr= [1,2,3,4,5];
console.log(arr);
arr.splice(0,1);
console.log(arr);
登入後複製
如果想要在陣列末尾刪除元素,就設定該方法第1個引數index的值為負數,那麼就會按絕對值從陣列右側開始向左側定位;且第2個引數 howmany的值要 等於 index的值。
var arr= [1,2,3,4,5];
console.log(arr);
//從倒數第1個元素開始,擷取1個元素
arr.splice(-1,1);
console.log(arr);
登入後複製
【相關推薦:、】
以上就是es6怎麼刪除一個陣列元素的詳細內容,更多請關注TW511.COM其它相關文章!