JavaScript數(shù)組定義和使用

 JavaScript數(shù)組

1.定義和使用

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

    數(shù)組是一個值的集合,每個值都有一個索引號,從0開始,每個索引都有一個相應(yīng)的值,根據(jù)需要添加更多數(shù)值。

    創(chuàng)建一個數(shù)組,有三種方法:

  1. 1)常規(guī)方式:使用Array對象創(chuàng)建空數(shù)組。

 

var myCars=new Array();

 

myCars[0]="Benz";     

 

myCars[1]="Volvo";

 

myCars[2]="BMW";

 
  1. 2)簡潔方式:使用Array對象創(chuàng)建數(shù)組。

 

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

 
  1. 3)   字面量方式

 

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

 

    訪問數(shù)組

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

以下實(shí)例可以訪問myCars數(shù)組的第一個值:

 

var name=myCars[0];

 

以下實(shí)例修改了數(shù)組 myCars 的第一個元素:

 

myCars[0]="Ferrari ";

 

2.數(shù)組屬性和方法

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

表 5-8數(shù)組的屬性  

 

屬性

 
 

描述

 
 

constructor

 
 

返回創(chuàng)建數(shù)組對象的原型函數(shù)。

 
 

length

 
 

設(shè)置或返回?cái)?shù)組元素的個數(shù)。

 
 

prototype

 
 

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

 

使用數(shù)組對象預(yù)定義屬性和方法:

 

var x=myCars.length             // myCars 中元素的數(shù)量

 

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

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

表 5-9數(shù)組的方法                                                          

 

方法

 
 

描述

 
 

concat()

 
 

連接兩個或更多的數(shù)組,并返回結(jié)果。

 
 

copyWithin()

 
 

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

 
 

fill()

 
 

使用一個固定值來填充數(shù)組。

 
 

filter()

 
 

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

 
 

find()

 
 

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

 
 

forEach()

 
 

數(shù)組每個元素都執(zhí)行一次回調(diào)函數(shù)。

 
 

includes()

 
 

判斷一個數(shù)組是否包含一個指定的值。

 
 

indexOf()

 
 

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

 
 

isArray()

 
 

判斷對象是否為數(shù)組。

 
 

join()

 
 

把數(shù)組的所有元素放入一個字符串

 
 

keys()

 
 

返回?cái)?shù)組的可迭代對象,包含原始數(shù)組的鍵(key)。

 
 

lastIndexOf()

 
 

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

 
 

pop()

 
 

刪除數(shù)組的最后一個元素并返回刪除的元素。

 
 

push()

 
 

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

 
 

reverse()

 
 

反轉(zhuǎn)數(shù)組的元素順序。

 
 

shift()

 
 

刪除并返回?cái)?shù)組的第一個元素。

 
 

slice()

 
 

選取數(shù)組的的一部分,并返回一個新數(shù)組。

 

合并兩個數(shù)組:

 

<script>

 

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

 

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

 

var children = hege.concat(stale);

 

document.write(children);

 

</script>

 

數(shù)組的末尾添加新的元素:

 

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

 

fruits.push("Kiwi")

 

document.write(fruits);

 

在數(shù)組的開頭添加新元素:

 

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

 

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

 

document.write(fruits);

 

forEach 數(shù)組遍歷:

 

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

 

const copy = [];    

 

items.forEach(function(item){

 

copy.push(item)

 

});

 

find()傳入一個回調(diào)函數(shù),找到數(shù)組中符合當(dāng)前搜索規(guī)則的第一個元素,返回它,并且終止搜索:

 

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

 

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

 

copyWithin()選擇數(shù)組的某個下標(biāo),從該位置開始復(fù)制數(shù)組元素,默認(rèn)從 0 開始復(fù)制。也可以指定要復(fù)制的元素范圍

 

arr.copyWithin(target, start, end)

 

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

 

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

 

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

 

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

 

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

 

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

 

3.二維數(shù)組

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

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

 

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)   遍歷二維數(shù)組中的每個元素--循環(huán)的嵌套

 

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/>")

 

}