一.陣列及陣列的方法

1.陣列的概念:
是值資料的集合,在JavaScript中陣列中的資料型別可以是不同的.
2.陣列的宣告:
(1)var 陣列的名稱=new Array();
(2)var 陣列的名稱=[];
3.陣列的初始化
(1)var 陣列的名稱=new Array(‘值1’,值2,‘值3’,…)//js 是一種弱型別的指令碼語言索引可以儲存不同的資料型別.
(2)var 陣列的名稱=[值1,值2,值3,…]
(3)var 陣列的名稱=new Array()
例:

<script type="text/javascript">
	var arr=new Array('Hello','InLett',100,true,34.23);
//	根據索引獲取值
	alert(arr[1]);//輸出結果InLett
</script>
 

重點:通過遍歷陣列的方式來獲取陣列中的資料
4.運算元組資料的方式
(1)join():將陣列成員通過一個分割符合併成字串
例:

<script type="text/javascript">
//	(1)join():將陣列成員通過一個分割符合併成字串
	var arr=[12,23,1,0,23,45];
	var str=['L','O','V','E'];
//	alert(str.join('-'));//輸出結果為L-O-V-E
	alert(arr.join('*'));	//輸出結果為12*23*1*0*23*45
</script>

(2)push()和pop(): 在陣列的最後新增或是刪除成員
例:

<script type="text/javascript">
	var arr1=['html','JavaScript','css'];
	var num= arr1.push('jQuery'); 
	alert(arr1);
</script>

例:

<script type="text/javascript">
	var arr1=['html','JavaScript','css'];
	arr1.pop();
	alert(arr1);
</script>

(3)unshift()和shift(): 在陣列的最前面新增或是刪除成員
例:

<script type="text/javascript">
	var arr1=['html','JavaScript','css'];
	arr1.unshift('jQuery');
	alert(arr1);
</script>

例:

<script type="text/javascript">
	var arr1=['html','JavaScript','css'];
	arr1.shift();
	alert(arr1);
</script>

(4)reverse(): 表示為將陣列的資料進行翻轉
例:

<script type="text/javascript">
	var num1=[1,2,3,4,5,6];
	num1.reverse();
	alert(num1);
</script>

(5)indexOf()和lastIndexOf:這兩個方法都是用來搜尋整個陣列中具有給定值的元素,返回找到的第一個元素的索引,如果沒找到,則返回-1.
indexOf表示返回陣列中元素第一次出現的索引值,
lastIndexOf則是反向搜尋.
例:

<script type="text/javascript">
	var num2=[1,2,13,1,2,2];
	var index= num2.indexOf(2);//返回第一次出現2的索引
	alert(index);//輸出結果為1
</script>

例:第一個值表示要查詢的資料;第二個值表示起始要查詢的索引;查詢不到返回-1

<script type="text/javascript">
	var num2=[1,2,13,1,2,2];
	var index= num2.indexOf(2,3);
	//var index=num2.indexOf(2,6);  //查詢不到返回-1
	alert(index);//輸出結果為4
</script>

(6)splice():在陣列中新增成員
例:

<script type="text/javascript">
	var num4=[1,2,3,4,5,6];
	num4.splice(1,2,7,8,9);//第一個值1表示要開始新增成員的索引位置;第二個值2表示刪除2兩個成員(包含自身);第三個值7,8,9 表示 在此位置上新增 7,8,9
	alert(index);//輸出結果為1789456
</script>

(7)slice():從一個數組中選擇(擷取)元素
例:第一個值表示開始擷取的位置索引;第二個值表示擷取結束位置的索引,但是並不包含結束位置索引所對應的成員

<script type="text/javascript">
	var num5=[2,3,4,5,6,7];
	var num6= num5.slice(2,4);
	alert(num6);//輸出結果為4,5
</script>

(8)sort():返回排序後的陣列.如果陣列包含undefined,會被排序到陣列的尾部.如果不帶引數的用sort(),陣列元素以字母表順序排序.

<script type="text/javascript">
	var a=[2,33,1111,444];
	a.sort();
	alert(a);
</script>

<script type="text/javascript">
	var a=['a','c','g','j','r','e','d','q','z','u'];
	a.sort();
	alert(a);
</script>

<script type="text/javascript">
	var c=['a','abc','def','b','zyujg','jgi','j',1,222,777,55,44,66,8888,99];
	c.sort();
	alert(c);
</script>

如果是數字從小到大排序:

<script type="text/javascript">
	var a=[2,33,1111,444]
	a.sort(function(a,b){
		return a-b
	})
	alert(a);
</script>

(9)concat():建立並返回一個新的陣列
例:

<script type="text/javascript">
	var a = [1,2,3];      
	var b = a.concat(4,5);         
	var c = a.concat([4,5]);         
	console.log(a); //返回的還是1,2,3
	console.log(b); //返回1,2,3,4,5
	console.log(c);  //返回1,2,3,4,5
</script>

這個方法還可以用來複制陣列。
例:

<script type="text/javascript">
	var a = [1,2,3];        
	var b = a.concat();                 
	console.log(a); //返回1,2,3
	console.log(b); //返回1,2,3
</script>

(10).toString()和toLocaleString()

toString()方法將每個元素轉化為字串,類似於不傳參的join()方法.

toLocaleString()方法是toString()的本地化版本.
(11).forEach()方法,從頭至尾遍歷陣列,為每個元素呼叫指定的函式.
例:

<script type="text/javascript">
	var a = [1,2,3,4,5];       
	var sum = 0;             
	a.forEach(function (value) {
	    sum += value
	})             
	console.log(sum); //sum = 15
</script>

(12)map()方法:
和forEach()類似,呼叫陣列的每個元素傳遞給指定函式,並返回一個數組,所以它和forEach()的區別在於,有一個返回值.不修改原陣列,返回的陣列長度和原陣列相同.
例:

<script type="text/javascript">
	var a = [1,2,3,4,5];             
	var b = a.map(function (value) {
  		  return value+1
	})         
	console.log(b); //返回2,3,4,5,6
</script>

(13)filter()方法，返回的是呼叫陣列的一個子集。
例:

<script type="text/javascript">
	var a = [1,2,3,4,5];          
	var b = a.filter(function (value) {
  		return value > 3
	})         
	console.log(b); //返回4,5
</script>

注:如果使用map()方法,返回的是false, false, false, true, true
filter()會跳過稀疏陣列中缺少的元素,他的返回陣列總是稠密的.所以可以用一下方法來壓縮稀疏陣列的空缺.
例:

<script type="text/javascript">
	var a = [1,2,,,5];          
	var b = a.filter(function (value) {
  		 return true
	})         
	console.log(b); //返回1,2,5
</script>

(14)every()和some()
every()方法是隻有陣列中所以元素都滿足某個條件才會返回true;some()方法是隻要有滿足條件的值,就返回true。
以every()方法為例:

<script type="text/javascript">
	var a = [1,2,3,4,5];
	var b=a.every(function (value) {
		return value < 10
	})
	var c=a.every(function (value) {
   	 	return value % 2 === 0
	}) 
	alert(b); //true
	alert(c)//false
</script>