JavaScript數組定義和使用

 JavaScript數組

1.定義和使用

    我們知道變量用來存儲數據,一個變量只能存儲一個內容。假設你想存儲10個人的姓名或者存儲20個人的數學成績,就需要10個或20個變量來存儲,如果需要存儲更多數據,那就會變的更麻煩。我們用數組解決問題,一個數組變量可以存放多個數據。好比一個團,團里有很多人。

    數組是一個值的集合,每個值都有一個索引號,從0開始,每個索引都有一個相應的值,根據需要添加更多數值。

    創建一個數組,有三種方法:

  1. 1)常規方式:使用Array對象創建空數組。

 

var myCars=new Array();

 

myCars[0]="Benz";     

 

myCars[1]="Volvo";

 

myCars[2]="BMW";

 
  1. 2)簡潔方式:使用Array對象創建數組。

 

var myCars=new Array("Benz  ","Volvo","BMW");

 
  1. 3)   字面量方式

 

var myCars=[" Benz  ","Volvo","BMW"];

 

    訪問數組

    通過指定數組名以及索引號碼(索引從0開始),你可以訪問某個特定的元素。

以下實例可以訪問myCars數組的第一個值:

 

var name=myCars[0];

 

以下實例修改了數組 myCars 的第一個元素:

 

myCars[0]="Ferrari ";

 

2.數組屬性和方法

  1. 1)  數組的屬性,如下表5-8所示

表 5-8數組的屬性  

 

屬性

 
 

描述

 
 

constructor

 
 

返回創建數組對象的原型函數。

 
 

length

 
 

設置或返回數組元素的個數。

 
 

prototype

 
 

允許你向數組對象添加屬性或方法。

 

使用數組對象預定義屬性和方法:

 

var x=myCars.length             // myCars 中元素的數量

 

    var  y=myCars.indexOf("Volvo")    // "Volvo" 值的索引值

 
  1. 2)   數組的方法,如下表5-9所示

表 5-9數組的方法                                                          

 

方法

 
 

描述

 
 

concat()

 
 

連接兩個或更多的數組,并返回結果。

 
 

copyWithin()

 
 

從數組的指定位置拷貝元素到數組的另一個指定位置中。

 
 

fill()

 
 

使用一個固定值來填充數組。

 
 

filter()

 
 

檢測數值元素,并返回符合條件所有元素的數組。

 
 

find()

 
 

返回符合傳入測試(函數)條件的數組元素。

 
 

forEach()

 
 

數組每個元素都執行一次回調函數。

 
 

includes()

 
 

判斷一個數組是否包含一個指定的值。

 
 

indexOf()

 
 

搜索數組中的元素,并返回它所在的位置。

 
 

isArray()

 
 

判斷對象是否為數組。

 
 

join()

 
 

把數組的所有元素放入一個字符串

 
 

keys()

 
 

返回數組的可迭代對象,包含原始數組的鍵(key)。

 
 

lastIndexOf()

 
 

返回一個指定的字符串值最后出現的位置,在一個字符串中的指定位置從后向前搜索。

 
 

pop()

 
 

刪除數組的最后一個元素并返回刪除的元素。

 
 

push()

 
 

向數組的末尾添加一個或更多元素,并返回新的長度。

 
 

reverse()

 
 

反轉數組的元素順序。

 
 

shift()

 
 

刪除并返回數組的第一個元素。

 
 

slice()

 
 

選取數組的的一部分,并返回一個新數組。

 

合并兩個數組:

 

<script>

 

var hege = ["Cecilie", "Lone"];

 

var stale = ["Emil", "Tobias", "Linus"];

 

var children = hege.concat(stale);

 

document.write(children);

 

</script>

 

數組的末尾添加新的元素:

 

var fruits = ["Banana", "Orange",  "Apple", "Mango"];

 

fruits.push("Kiwi")

 

document.write(fruits);

 

在數組的開頭添加新元素:

 

var fruits = ["Banana", "Orange",  "Apple", "Mango"];

 

fruits.unshift("Lemon","Pineapple");

 

document.write(fruits);

 

forEach 數組遍歷:

 

const items = ['item1', 'item2', 'item3'];

 

const copy = [];    

 

items.forEach(function(item){

 

copy.push(item)

 

});

 

find()傳入一個回調函數,找到數組中符合當前搜索規則的第一個元素,返回它,并且終止搜索:

 

const arr = [1, "2", 3, 3, "2"]

 

console.log(arr.find(n => typeof n ===  "number")) // 1

 

copyWithin()選擇數組的某個下標,從該位置開始復制數組元素,默認從 0 開始復制。也可以指定要復制的元素范圍

 

arr.copyWithin(target, start, end)

 

const arr = [1, 2, 3, 4, 5]

 

console.log(arr.copyWithin(3))// [1,2,3,1,2] 從下標為3的元素開始,復制數組,所以4, 5被替換成1, 2

 

const arr1 = [1, 2, 3, 4, 5]

 

console.log(arr1.copyWithin(3, 1))// [1,2,3,2,3] 從下標為3的元素開始,復制數組,指定復制的第一個元素下標為1,所以4, 5被替換成2, 3

 

const arr2 = [1, 2, 3, 4, 5]

 

console.log(arr2.copyWithin(3, 1, 2)) // [1,2,3,2,5] 從下標為3的元素開始,復制數組,指定復制的第一個元素下標為1,結束位置為2,所以4被替換成2

 

3.二維數組

    二維數組:從整體上看是一個數組,但是其中一個元素又是一個數組,即數組中的數組。二維數組就是一個table表格。

  1. 1)  訪問二維數組中的某個元素

 

var arr1=[[11,12,13],[21,22,23],[31,32,33]];

 

consolo.load(arr1[0][0]);   //值為11

 

arr1[1][2]=230;     //把23改成230

 
  1. 2)   遍歷二維數組中的每個元素--循環的嵌套

 

for(var i=0;i<arr1.length;i++){

 

for(var j=0;j<arr[i].length;j++){

 

document.write(arr[i][j] + "&nbsp;");

 

    }

 

document.write("<br/>")

 

}