前言

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

聽懂了接下來就很容易，聽不懂就難辦了，大家要認真看喲。希望大家讀完有所收獲，那我辛苦碼字也就值了。

一、初識數(shù)組

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

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

下標：又稱索引，以數(shù)字表示，默認從0開始依次遞增，用于識別元素。

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

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

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

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

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

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

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

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

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

• 實例化Array對象的方式。
• 直接使用“[]”的方式。

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

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

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

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

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

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

??獲取數(shù)組長度

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

數(shù)組arr2中沒有值的數(shù)組元素會占用空的存儲位置。

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

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

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

??若length的值大于數(shù)組中原來的元素個數(shù)，則沒有值的數(shù)組元素會占用空存儲位置。

??若length的值等于數(shù)組中原來的元素個數(shù)，數(shù)組長度不變。

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

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

??注意

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

??訪問數(shù)組元素

數(shù)組元素訪問方式：“數(shù)組名[下標]”。

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

• 利用下標遍歷數(shù)組可以使用：for（已學）。
• 利用下標遍歷數(shù)組可以使用：for…in語句。

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

??注意

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

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

??元素的添加與修改

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

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

??添加元素

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

??修改元素

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

??元素的刪除

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

例如，一個保存全班學生信息的多維數(shù)組，若這個班級中有一個學生轉(zhuǎn)學了，那么在這個保存學生信息的數(shù)組中就需要刪除此學生。

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

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

??解構(gòu)賦值

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

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

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

總結(jié)

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

最新評論