JS基礎精煉之Array方法精煉

  • 創(chuàng)建:
var colors1 = new Array('blue','red');    //構造函數形式
var colors2 = ['blue','red'];    //數組字面量形式
  • Array.isArray():檢測數組
if(Array.isArray(arr)){
    //
}
  • 數組的toString()
var arr = ['green','blue','red'];
console.log(arr.toString());    //'green,blue,red'(返回以逗號間隔的字符串)
  • 數組的valueOf()
var arr = ['green','blue','red'];
console.log(arr.valueOf());    //['green','blue','red'];(返回原數組)
  • push()
var colors = ['blue'];
console.log(colors.push('green','red'));    //3(返回推入后數組的長度)
console.log(colors)    //['blue','green','red'](將元素推入數組末端)
  • pop()
var colors = ['blue','green','red'];
console.log(colors.pop());    //'red'(返回彈出的那個元素)
console.log(colors)    //['blue','green'](從數組末端彈出一個元素)
  • unshift()
var colors = ['red'];
console.log(colors.unshift('blue','green'));    //3(返回推入后數組的長度)
console.log(colors);    //['blue','green','red'](將元素整體推入數組前端)
  • shift()
var colors = ['blue','green','red'];
console.log(colors.shift());    //'blue'(返回彈出的那個元素)
console.log(colors);    //['green','red'](從數組前端彈出一個元素)
  • reverse()
var values = [1,2,3,4,5];
console.log(values.reverse());    //[5,4,3,2,1](反轉數組元素順序)
  • sort()
var values = [1,3,15,8];
console.log(values.sort());    //[1,15,3,8](對每項調用toString()后升序排列)
function compare(value1,value2){    //(自定義一個比較函數)
  if(value1 < value2){
      return -1;
  } else if(value1 > value2){
      return 1;
  } else{
      return 0;
  }
}
var values = [1,3,15,8];
console.log(values.sort(compare));    //[1,3,8,15](按比較函數的規(guī)則進行了排序)

比較函數接收兩個參數,如果第一個參數應該位于第二個之前則返回一個負數,如果兩個參數相等 則返回 0,如果第一個參數應該位于第二個之后則返回一個正數。——《JavaScript高級程序設計(第3版)》

  • concat():增量復制
var colors = ['blue','red','gray'];
var colors2 = colors.concat();
console.log(colors2);    //['blue','red','gray'](colors2是colors的一個副本)
console.log(colors);    //['blue','red','gray'](原數組不變)
var colors = ['blue','red','gray'];
var colors2 = colors.concat({});
console.log(colors2);    //['blue','red','gray',Object](colors2復制了colors之后并入參數值。如果參數值是一或多個數組,逐一將數組元素并入;如果不是數組,則直接并入)
console.log(colors);    //['blue','red','gray'](原數組不變)
  • slice():截取復制
var  colors = ['red','orange','yellow','green','blue','indigo','purple'];
var colors2 = colors.slice(4);
console.log(colors2);    //['blue','indigo','purple'](從索引4處截取到最后)
console.log(colors);    //['red','orange','yellow','green','blue','indigo','purple'](原數組不變)
var  colors = ['red','orange','yellow','green','blue','indigo','purple'];
var colors2 = colors.slice(4,6); 
console.log(colors2);    //['blue','indigo'](從索引4處截取到索引6,不包括6)
console.log(colors);    //['red','orange','yellow','green','blue','indigo','purple'](原數組不變)
  • splice():刪除與插入
    arr.splice(startIndex,deleteCount,insertValue1,insertValue2,***);
var colors = ['red','green','blue'];
var resultColors = colors.splice(1,2);    //從索引1處開始刪除2個元素
console.log(resultColors);    //['green','blue'](返回一個被刪除元素組成的數組)
console.log(colors);    //['red'](原數組改變)
var colors = ['red','green','blue'];
var resultColors = colors.splice(1,0,'black','white');    //從索引1處刪除0個元素并插入元素
console.log(resultColors);    //[](空數組,因為沒有元素被刪除)
console.log(colors);    //['red','black','white','green','blue']
  • indexOf() 、 lastIndexOf():查找元素位置
    arr.indexOf(value, startIndex)
var arr = [1,4,5,8,3,5,6];
console.log(arr.indexOf(7));    //-1(找不到則返回-1)
var arr = [1,4,5,8,3,5,6];
console.log(arr.indexOf(5));    //2(第一次找到的位置)
var arr = [1,4,5,8,3,5,6];
console.log(arr.indexOf(5, 3));    //5(從索引3的位置開始查找元素5的位置)
var arr = [1,4,5,8,3,5,6];
console.log(arr.lastIndexOf(5));    //5(從末端往前查找元素5的位置)
  • every()
    迭代方法。對數組中的每一項運行給定函數,如果該函數對每一項都返回 true,則返回 true。
var arr = [1,2,3,4,5];
var everyResult = arr.every(function(item, index, array){
    return item > 0;
});
console.log(everyResult);    //true
  • some()
    迭代方法。對數組中的每一項運行給定函數,如果該函數對任一項返回 true,則返回 true。
var arr = [1,2,3,4,5];
var someResult = arr.some(function(item, index, array){
    return item > 5;
});
console.log(someResult);    //false
  • filter()
    迭代方法。對數組中的每一項運行給定函數,返回該函數會返回 true 的項組成的數組。
var arr = [1,2,3,4,5];
var filterResult = arr.filter(function(item, index, array){
    return item > 3;
});
console.log(filterResult);    //[4,5]
  • map()
    迭代方法。對數組中的每一項運行給定函數,返回每次函數調用的結果組成的數組。
var arr = [1,2,3,4,5];
var mapResult = arr.map(function(item, index, array){
    return item * 2;
});
console.log(mapResult);    //[2,4,6,8,10]
  • forEach()
    迭代方法。對數組中的每一項運行給定函數。沒有返回值。
var arr = [1,2,3,4,5];
arr.forEach(function(item, index, array){
    //do something
});
  • reduce() 、 reduceRight()
    歸并方法。迭代數組的所有項,然后構建一個最終返回的值。
var values = [1,2,3,4,5];
var sum = values.reduce(fucntion(prev, cur, index, array){
    return prev + cur;
});
console.log(sum);    //15(第一次:1+2=3;第二次:3+3=6;第三次:6+4=10;第四次:10+5=15)
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

友情鏈接更多精彩內容