前言

今天這篇文章就是來(lái)和大家詳細(xì)聊聊JavaScript中數(shù)組的基本操作，很多語(yǔ)言都是在數(shù)組這有個(gè)分水嶺。

聽(tīng)懂了接下來(lái)就很容易，聽(tīng)不懂就難辦了，大家要認(rèn)真看喲。希望大家讀完有所收獲，那我辛苦碼字也就值了。

一、初識(shí)數(shù)組

數(shù)組構(gòu)成：數(shù)組由一個(gè)或多個(gè)數(shù)組元素組成的，各元素之間使用逗號(hào)“,”分割。

數(shù)組元素：每個(gè)數(shù)組元素由“下標(biāo)”和“值”構(gòu)成。

下標(biāo)：又稱索引，以數(shù)字表示，默認(rèn)從0開(kāi)始依次遞增，用于識(shí)別元素。

值：元素的內(nèi)容，可以是任意類型的數(shù)據(jù)，如數(shù)值型、字符型、數(shù)組、對(duì)象等。

數(shù)組還可以根據(jù)維數(shù)劃分為一維數(shù)組、二維數(shù)組、三維數(shù)組等多維數(shù)組。

一維數(shù)組：就是指數(shù)組的“值”是非數(shù)組類型的數(shù)據(jù)，如上圖。

二維數(shù)組：是指數(shù)組元素的“值”是一個(gè)一維數(shù)組，如下圖。

數(shù)組還可以根據(jù)維數(shù)劃分為一維數(shù)組、二維數(shù)組、三維數(shù)組等多維數(shù)組。

多維數(shù)組：當(dāng)一個(gè)數(shù)組的值又是一個(gè)數(shù)組時(shí)，就可以形成多維數(shù)組。它通常用于描述一些信息。

舉例：保存一個(gè)班級(jí)學(xué)生信息，每個(gè)數(shù)組元素都代表一個(gè)學(xué)生，而每個(gè)學(xué)生都使用一個(gè)一維數(shù)組分別表示其姓名、學(xué)號(hào)、年齡等信息，這樣通過(guò)一個(gè)變量即可有規(guī)律的保存一個(gè)班級(jí)的所有學(xué)生信息，方便開(kāi)發(fā)時(shí)進(jìn)行處理。

二、創(chuàng)建數(shù)組

??數(shù)組在JavaScript中的創(chuàng)建方式：

• 實(shí)例化Array對(duì)象的方式。
• 直接使用“[]”的方式。

??使用Array對(duì)象創(chuàng)建數(shù)組

實(shí)例化Array對(duì)象的方式創(chuàng)建數(shù)組，是通過(guò)new關(guān)鍵字實(shí)現(xiàn)的。

??使用“[]”創(chuàng)建數(shù)組

直接法“[]”與Array()對(duì)象的使用方式類似，只需將new Array()替換為[]即可。

• 在創(chuàng)建數(shù)組時(shí)，最后一個(gè)元素后的逗號(hào)可以存在，也可以省略。
• 直接法“[]”與Array()對(duì)象在創(chuàng)建數(shù)組時(shí)的區(qū)別在于，前者可以創(chuàng)建含有空存儲(chǔ)位置的數(shù)組，而后者不可以。

三、數(shù)組的基本操作

??獲取數(shù)組長(zhǎng)度

Array對(duì)象提供的length屬性可以獲取數(shù)組的長(zhǎng)度，其值為數(shù)組元素最大下標(biāo)加1。

數(shù)組arr2中沒(méi)有值的數(shù)組元素會(huì)占用空的存儲(chǔ)位置。

因此，數(shù)組的下標(biāo)依然會(huì)遞增。從而arr2調(diào)用length屬性最后的輸出結(jié)果即為6。

數(shù)組的length屬性不僅可以用于獲取數(shù)組長(zhǎng)度，還可以修改數(shù)組長(zhǎng)度。

在利用length屬性指定數(shù)組長(zhǎng)度時(shí)，有以下是三種情況：

??若length的值大于數(shù)組中原來(lái)的元素個(gè)數(shù)，則沒(méi)有值的數(shù)組元素會(huì)占用空存儲(chǔ)位置。

??若length的值等于數(shù)組中原來(lái)的元素個(gè)數(shù)，數(shù)組長(zhǎng)度不變。

??若length的值小于數(shù)組中原來(lái)的元素個(gè)數(shù)，多余的數(shù)組元素將會(huì)被舍棄。

除此之外，在利用Array對(duì)象方式創(chuàng)建數(shù)組時(shí)，也可以指定數(shù)組的長(zhǎng)度。

??注意

JavaScript中不論何種方式指定數(shù)組長(zhǎng)度后，并不影響繼續(xù)為數(shù)組添加元素，同時(shí)數(shù)組的length屬性值會(huì)發(fā)生相應(yīng)的改變。

??訪問(wèn)數(shù)組元素

數(shù)組元素訪問(wèn)方式：“數(shù)組名[下標(biāo)]”。

概念：所謂遍歷數(shù)組就是依次訪問(wèn)數(shù)組中所有元素的操作。

• 利用下標(biāo)遍歷數(shù)組可以使用：for（已學(xué)）。
• 利用下標(biāo)遍歷數(shù)組可以使用：for…in語(yǔ)句。

for…in中的variable指的是數(shù)組下標(biāo)。for…in中的object表示數(shù)組的變量名稱。除此之外，若object是一個(gè)對(duì)象，for…in還可以用于對(duì)象的遍歷。

??注意

在ES6中，新增了一種for…of語(yǔ)法，可以更方便地對(duì)數(shù)組進(jìn)行遍歷。

• for…in中的variable指的是數(shù)組下標(biāo)。
• for…in中的object表示數(shù)組的變量名稱。
• 除此之外，若object是一個(gè)對(duì)象，for…in還可以用于對(duì)象的遍歷。

??元素的添加與修改

元素的添加與修改元素的方式：“數(shù)組名[下標(biāo)]”。

提示：與訪問(wèn)數(shù)組中的元素的方式相同。

??添加元素

• 添加數(shù)組元素：數(shù)組名[下標(biāo)] = 值。
• 允許下標(biāo)不按照數(shù)字順序連續(xù)添加，未設(shè)置具體值的元素，會(huì)以空存儲(chǔ)位置的形式存在。
• 數(shù)組中元素保存順序與下標(biāo)有關(guān)，與添加元素的順序無(wú)關(guān)。

??修改元素

修改元素與添加元素的使用相同，區(qū)別在于修改元素是為已含有值的元素重新賦值。

??元素的刪除

在創(chuàng)建數(shù)組后，有時(shí)也需要根據(jù)實(shí)際情況，刪除數(shù)組中的某個(gè)元素值。

例如，一個(gè)保存全班學(xué)生信息的多維數(shù)組，若這個(gè)班級(jí)中有一個(gè)學(xué)生轉(zhuǎn)學(xué)了，那么在這個(gè)保存學(xué)生信息的數(shù)組中就需要?jiǎng)h除此學(xué)生。

此時(shí)，可以利用delete關(guān)鍵字刪除該數(shù)組元素的值。

delete關(guān)鍵字只能刪除數(shù)組中指定下標(biāo)的元素值，刪除后該元素依然會(huì)占用一個(gè)空的存儲(chǔ)位置。

??解構(gòu)賦值

除了前面學(xué)習(xí)過(guò)的變量聲明與賦值方式，ES6中還提供了另外一種方式——解構(gòu)賦值。例如，若把數(shù)組[1,2,3]中的元素分別賦值為a、b和c，傳統(tǒng)的做法是單獨(dú)為變量聲明和賦值。

• 當(dāng)左側(cè)變量的數(shù)量小于右側(cè)的元素的個(gè)數(shù)，則忽略多余的元素。
• 當(dāng)左側(cè)變量數(shù)量大于右側(cè)的元素個(gè)數(shù)時(shí)，則多余的變量會(huì)被初始化為undefined。

• 解構(gòu)賦值時(shí)右側(cè)的內(nèi)容還可以是一個(gè)變量。
• 通過(guò)解構(gòu)賦值完成兩個(gè)變量數(shù)值的交換。

總結(jié)

到此這篇關(guān)于JavaScript第一個(gè)分水嶺之?dāng)?shù)組基本操作的文章就介紹到這了,更多相關(guān)JS數(shù)組基本操作內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！