首頁 > web前端 > js教程 > JS數組學習之根據數組下標添加元素

JS數組學習之根據數組下標添加元素

青灯夜游
發布: 2021-08-17 15:19:24
原創
7262 人瀏覽過

在上一篇文章《JS數組學習之如何在頭部或尾部插入元素? 》中,我們介紹了在數組開頭或結尾添加元素的三種方法。這次我們繼續來了解添加數組元素的方法,介紹一下如何根據數組下標來添加元素,有興趣的朋友可以學習了解一下~

數組中的每個元素都有一個序號,這個序號從0開始,稱為下標(Index)。數組的下標是非常重要的,利用下標我們可以存取數組元素,只需指明下標即可,形式為:數組名[下標索引]。例:

a[0]  //表示第0个元素
a[3]  //表示第3个元素
登入後複製

利用下標我們也可以插入元素,以下就來具體介紹一下。

我們可以使用  陣列名稱[下標值] = 元素值 的形式在陣列指定下標位置新增元素

var a = [1,2,3];  //定义数组
a[3] = 4;  //为数组添加一个元素
console.log(a);  //返回[1,2,3,4]
登入後複製

看看輸出結果:

JS數組學習之根據數組下標添加元素

不過使用此方法時,需要指定的下標值>= 原始數組的長度,這樣就會在原始數組的尾部添加新元素

var a = [1,2,3];  //定义数组
a[4] = 4;  //为数组添加一个元素
console.log(a);
登入後複製

看看輸出結果:

JS數組學習之根據數組下標添加元素

如果小於原始數組的長度,那就不是添加新元素了,會變成替換元素

var a = [1,2,3];  //定义数组
a[1] = 4;  //为数组添加一个元素
console.log(a);
登入後複製

看看輸出結果:

JS數組學習之根據數組下標添加元素

使用  陣列名稱[下標值] = 元素值 的形式只能在陣列指定下標位置新增一個元素;那麼想要在指定下標位置插入一個或多個元素要怎麼做呢?

我們可以使用 splice() 方法。 splice()是一個強大的方法,不僅可以刪除數組元素,還可以添加數組元素,也可以替換數組元素。

下面我們就來聊聊 splice() 方法加入陣列元素的功能。

array.splice(index,howmany,item1,.....,itemX)的第1個參數index為指定起始下標位置;第2個參數howmany指定應該刪除的元素數目,當值設為0時,就會不執行刪除操作;這樣就可以透過第3個及後面參數item1,... ..,itemX來插入一個或多個元素。

我們透過下面的例子來具體看看:

var a = [1,2,3,4,5];
a.splice(1,0,"hello");
console.log(a);
登入後複製

可以看出:使用a.splice(1,0,"hello")在下標1的位置(即數組第1個元素位置後)插入一個元素"hello",因此輸出結果為:

JS數組學習之根據數組下標添加元素

var a = [1,2,3,4,5];
a.splice(2,0,"hello","hi",8);
console.log(a);
登入後複製

可以看出:使用a.splice(2,0,"hello","hi",8)在下標2的位置(即數組第2個元素位置後)插入多個元素" hello"、"hi"、8,因此輸出結果為:

JS數組學習之根據數組下標添加元素

使用splice() 方法我們也可以實現在數組開頭或結尾添加元素:

var a = [1,2,3,4,5];
a.splice(0,0,"hello");
a.splice(a.length,0,"hi");
console.log(a);
登入後複製

如果想要在數組開頭添加元素,就設定該方法第1個參數index的值為0即可;如果想要在數組末尾添加元素,就設定此方法第1個參數index的值為陣列長度   即可,陣列長度可以使用a.length來取得。

我們看看輸出結果:

JS數組學習之根據數組下標添加元素

#新增的陣列元素可以是單一值,也可以是陣列:

var a = [1,2,3,4,5];
a.splice(5,0,[6,7,8,9]);
console.log(a);
登入後複製

輸出結果:

JS數組學習之根據數組下標添加元素

好了,就說到這裡了,有需要的可以看:javascript高級教學

以上是JS數組學習之根據數組下標添加元素的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板