js數組的一些用法-聲明、添加、移除、遍歷

數組作爲js中比較常用的一個容器,簡單記錄一些常用的方法,作爲查詢工具使用;

1 聲明,驗證;

var array1=new Array();//比較標準的方式
var array2=[];//也可以隨意一些,據說此種方式效率更高一些;推薦此種
var array3=[1,2,3,4];//直接初始化

//Array.isArray(判斷對象是否是數組) 
Array.isArray(array3);//true

2 添加移除元素;

2.1 array.push(item...);array.unshift(item...);array.pop();array.shift();

		//push()pop()
        var array1=[];
		array1[0]=1;//直接賦值,且不用擔心下標越界的問題
		array1.push(2);//直接在後面追加 
		array1.push(3);// array1[1,2,3]
		array1.pop();//末尾刪除 類似堆棧(stack) array1[1,2]
		array1.push(3,4);//也可以同時多個 array1[1,2,3,4]
		array1.push([5,6,7,],8);//不限制類型 array1[1,2,3,4,[5,6,7],8]
        
        //unshift(),shift()
        var array2=[2,3,4];//
		array2.unshift(1);//頭部添加 array2[1,2,3,4]
		array2.shift();//頭部珊瑚  array2[2,3,4]
		

2.2 splice();從指定位置添加刪除元素;

2.2.1 splice(startIndex,count,newItem);

startIndex:起始索引,數組添加刪除元素的位置-即新元素的位置;

count:要刪除的元素數量,如果是0,則不刪除;

newItem:要添加的元素,如果不填寫,則沒有添加新元素;

 

		var arrayS=[1,2,3];
		//參數1 splice(index,0,newItem)-添加新元素
		arrayS.splice(2,0,'new1');//添加1個
		console.log(arrayS);//[1,2,'new1',3]
		arrayS.splice(3,0,'new2','new3');//添加多個
		console.log(arrayS);//[1,2,'new1','new2','new3',3]
		//參數2 splice(index,count)-刪除元素
		arrayS.splice(2,3);
		console.log(arrayS);//[1,2,3]
		//參數2 splice(index,count,newItem)-移除元素並替換
		arrayS.splice(2,1,[3,4,5,6]);
		console.log(arrayS);//[1,2,[3,4,5,6]]

3 遍歷迭代-forEach;for 循環;every();some();reduce();map();filter();

3.1 forEach

var array1=[10,20,30,40];
		//循環前一般需要做下判斷
		if(array1&&array1.length){
			//TO-DO 
		}else{
			//數組不存在或者 爲空的情況
		}
        
        //1 forEach
		array1.forEach(function(item,index){//forEach;比較少用
			console.log('forE:'+item);
		});
		array1.forEach((i,index)=>{//forEach + Lambda表達式
			console.log("forEach:"+i);
		});

3.2 for循環

//2 for循環
		for(var a in array1){// 不考慮順序可以用;比較少用
			console.log('a:'+array1[a]);
		}
		for(var i=0;i<array1.length;i++){//普通for循環 排序時使用;一般的用法
			console.log('for:'+array1[i]);
		}
		for(var i=0,j=0;j=array1.length,i<j;i++){//數組比較大時的一點兒優化
			console.log('forj:'+array1[i]);
		}

3.3 every(),some()

//3.3 every() 與some()
        //3.3.1 every()該方法接受一個返回爲布爾值的函數,若數組所有元素均返回true,則結果爲true
        //3.3.2 some() 類似every(),只不過是只要 有一個元素返回true,則結果爲true; 
        //some()與every()  類似於邏輯運算 or與and
        var array3=[1,2,3,4,5,6,7,8];
		var array4=[2,4,6,8];
		
        var isEven=function(num){//是否爲偶數
			return num%2==0;
		}
		var even1=array3.every(isEven);
		var even2=array4.every(isEven);
		var even3=array3.some(isEven);
		var even4=array4.some(isEven);
		console.log(even1,even2,even3,even4);//false true true true

3.4 reduce(),reduceRight();

//4 reduce()方法接受一個函數 ,該函數依次作用於數組中的元素,最終返回一個值;
		//執行順序大概是  
        //var result1= func(index1 index2);var result2= func(result,index3),依次類推;
		//使用場景:求累加值等
		var add=function(num1,num2){
			return num1+num2;
		}
		var array5=[1,2,3,4,5,6,7,8,9,10];
		var total=array5.reduce(add);
		console.log(total);//55
//4.1 reduceRight()方法,  reduce()的變種,原理就是 array.reverse()+reduce();執行順序 由後往前;
		var contact=function(item1,item2){
			return item1+item2;
		}
		var array6=['how ','are ','you '];
		console.log(array6.reduceRight(contact));//you are how

3.5 map();與every()類似,方法接收一個函數,數組中所有元素依次執行,返回的新值會生成一個新的數組;


		var add5=function(item){
			return item+5;
		}
		var array7=[1,2,3,4,5];
		var newArray7=array7.map(add5);
		console.log(newArray7);//6,7,8,9,10
		console.log(array7);//1,2,3,4,5
		//注意如果數組內是個對象數組
		var array8=[{data:1},{data:2},{data:3},	{data:4},{data:5}]
		var array9=array8.map((item, idx) => {
			item.data=item.data+5//array8的內容會改變
			return item;
		});
		console.log(array8);//?
		console.log(array9);//?

3.6 filter(),過濾方法-接受一個函數,數組每個元素依次執行,滿足條件的元素生成一個新的數組;

//基數
		var isOdd=function(num){
			return num%2!=0;
		}
		var array10=[1,2,3,4,5,6,7,8];
		var newArray10=array10.filter(isOdd);
		console.log(newArray10);//[1,3,5,7]

4 複製,檢索array.slice(start,end);索引位置包含start,不包含end;

array.indexOf();

//slice方法針對array中的一段做淺複製
//第一個參數是起始位置,第二個可選,默認是數組的長度
//一般來說 截取後的值a + 截取後的數組值就是 截取前完整的數組的值
var array11=[1,2,3,4,5,6,7];
var array11Slice=array11.slice(1,3);
console.log(array11Slice);//[2,3]
console.log(array11);//[1,2,3,4,5,6,7]
//indexOf 判斷數組是否包含某個元素,一般可以配合 splice方法刪除元素
//當然返回的結果是第一個匹配成功的,若需要全部刪除還需要另外考慮
var array4=[111,222,333];
var index = array4.indexOf(222);//index==1
if(index > -1) {
	array4.splice(index, 1);//array4-[111,333]
}

5 反轉, array.reverse();

var array12=[1,2,3,4,5]
array12.reverse();
console.log(array12);//[5,4,3,2,1]

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章