js數組方法匯總
下面主要匯總一下數組的方法
數組方法:
1、檢測是否為數組的方法:Array.isArrray();
var arr=[1,2,3,4,5];
var str=‘string‘;
console.log(Array.isArray(arr));//true
console.log(Array.isArray(str));//false
2、轉換方法:toLocaleString()、toString()、valueOf()
valueOf():返回數組本身
toString():返回由數組中每個值的字符串形式拼接而成的一個以逗號分隔的字符串
toLocaleString():調用的是每一項的toLocaleString()方法,而不是toString()方法,這三個方法通常返回同樣的值,不過多討論
var colors=["red","blue","green"];
console.log(colors.toString());//red,blue,green
console.log(colors.valueOf());//["red", "blue", "green"]
console.log(colors.toLocaleString());//red,blue,green
3、join()方法:用於將數組以指定符號分隔成字符串數組
var colors=["red","blue","green"]; console.log(colors.join());//red,blue,green console.log(colors.join(‘,‘));//red,blue,green console.log(colors.join(‘||‘));//red||blue||green
4、棧方法 push()、pop()方法
push():接收任意數量的參數,把他沒逐個添加到數組末尾,並返回修改後的數組長度!(不是修改後的數組);
pop():從數組末尾移除最後一項,返回移除的項
var colors=new Array(); var count=colors.push("red","green","blue"); console.log(colors)//["red", "green", "blue"] console.log(count);//3 var item=colors.pop(); console.log(colors)//["red", "green"] console.log(item);//blue
5、隊列方法 shift()、unshift()
shift():與pop()方法對應,能夠移除數組中的第一個項並且返回該項
unshift():與push()方法對應,能夠在數組前面添加若幹項
var colors=["red"];
var count=colors.unshift("green","blue");
console.log(colors)//["green", "blue", "red"]
console.log(count);//3
var item=colors.shift();
console.log(colors)//["blue", "red"]
console.log(item);//green
6、重排序方法 reverse()、sort()
reverse():會翻轉數組項的順序
sort():默認按字符編碼的大小升序排列,通常我們會傳入一個比較函數作為參數來對數字數組進行排序
var numberArr=[0,1,5,10,15]; numberArr.reverse(); console.log(numberArr);//[15, 10, 5, 1, 0] numberArr.sort(); console.log(numberArr);//[0, 1, 10, 15, 5] 按字符編碼大小升序排序(此方法會先調用toString()方法) //定義一個比較函數 function compare(value1,value2){ if(value1<value2){ return -1; }else if(value1>value2){ return 1; }else{ return 0; } } numberArr.sort(compare); console.log(numberArr);//[0, 1, 5, 10, 15] // 若想降序排序,將大於號小於號顛倒即可
7、操作方法 concat()、slice()、splice()
concat():數組合並,此方法會將傳遞給它的一個或多個數組中的每一項添加到結果數組的後面
var colors=["red","blue","green"];
var colors2=colors.concat();
var colors3=colors.concat("black",["yellow","brown"]);
console.log(colors2);//["red", "blue", "green"]
console.log(colors3);//["red", "blue", "green", "black", "yellow", "brown"]
slice():截取數組,接收一或兩個參數,返回索引之間的數組項組成的一個數組(包括開頭不包括結尾)
當一個參數時是截取從此索引開始到末尾的數組
當兩個參數時是截取兩個索引之間的數組
當參數為負數時,可以用數組長度加上此參數,截取倆參數之間的項
var colors=["red", "blue", "green", "black", "yellow", "brown"];
var colors2=colors.slice(2);
var colors3=colors.slice(1,4);
var colors4=colors.slice(-2,-1);
console.log(colors2);//["green", "black", "yellow", "brown"]
console.log(colors3);//["blue", "green", "black"]
console.log(colors4);//["yellow"] 與slice(4,5)一樣
splice():一個非常強大的方法,可以完成數組的刪除、插入、替換工作、
接收兩個或三個或更多參數:第一個參數指定開始的索引、第二個參數指定刪除的長度、第三個參數及後面的參數指定插入的項,刪除返回的項
var colors=["red", "blue", "green","yellow","brown"];
var colors2=colors.splice(0,1);//刪除第一項
console.log(colors2);//["red"]
console.log(colors);//["blue", "green", "yellow", "brown"]
var colors3=colors.splice(1,0,"哈哈","恰恰");//在索引1並插入兩項
console.log(colors3);//[]
console.log(colors);//["blue", "哈哈", "恰恰", "green", "yellow", "brown"]
var colors4=colors.splice(3,1,"替換");//替換索引為3的項
console.log(colors4);//["green"]
console.log(colors);// ["blue", "哈哈", "恰恰", "替換", "yellow", "brown"]
8、位置方法 indexOf()、lastIndexOf()
接收1或2個參數
indexof();從前向後查找匹配到的第一項,若有第二個參數,則從第二個參數指定的索引開始向後查找,返回匹配第一項所在的索引,沒匹配到則返回-1
lastIndexOf():從後往前查找匹配到的第一項,若有第二個參數,則從第二個參數指定的索引開始想前查找,返回匹配到的第一項所在的索引,沒匹配到返回-1
var numbers=[1,2,3,4,5,4,3,2,1];
console.log(numbers.indexOf(4));//3
console.log(numbers.lastIndexOf(4));//5
console.log(numbers.indexOf(4,4));//5
console.log(numbers.lastIndexOf(4,4));//3
console.log(numbers.indexOf(6));//-1
console.log(numbers.lastIndexOf(6));//-1
9、叠代與歸並方法 every()、filter()、forEach()、map()、some()、reduce()、reduceRight()
var numbers=[1,2,3,4,5,4,3,2,1];
var some=numbers.some(function(item,index,arr){
return (item>2);
})
console.log(some)//true 有一個返回true最終就返回true
var every=numbers.every(function(item,index,arr){
return (item>2);
})
console.log(every)//false 全部為true才是true
var filter=numbers.filter(function(item,index,arr){
return (item>2);
})
console.log(filter)//[3, 4, 5, 4, 3] 滿足條件的項組成一個數組
var map=numbers.map(function(item,index,arr){
return (item*2)
})
console.log(map)// [2, 4, 6, 8, 10, 8, 6, 4, 2] 返回每個項執行的結果
var foreach=numbers.forEach(function(item,index,arr){
console.log(item)
})//相當於for循環 給每一個項執行一個函數 無返回值
var reduce=numbers.reduce(function(prev,cur,index,arr){
return prev+cur;
})
console.log(reduce)//25
var reduceright=numbers.reduceRight(function(prev,cur,index,arr){
return prev+cur;
})
console.log(reduceright)//25
js數組方法匯總