JS常用数组处理

循环

1、普通for循环

var arr = [1,2,3,9];
for ( var i = 0， len = arr.length; i< len; i++){
    console.log(arr[i]);       // 1 2 3 9
}

2、for of 循环 ES6语法  // 还支持字符串遍历

var arr = [1,2,3,9];

for (i of arr){
   console.log(i);       // 1 2 3 9
}

3、forEach 循环          // 不能中止循环

var arr = [1,2,3,9];

arr.forEach((item) =>{
  console.log(item)     // 1 2 3 9
})

4、map 循环            // forEach 和 map 都不能中止循环，不支持ie9以下浏览器

一般用来处理需要修改某一个数组的值

var arr = [1,2,3,9];

var square = arr.map(item => item*item )   
var square = arr.map(item => {
            item = item * item
            item = item - 1
            return item
        })   // 多个处理操作需要return
console.log(square)  // [1, 4, 9, 81]

5、filter 循环

filter函数可以看成是一个过滤函数，返回符合条件的元素的数组

var arr = [1,3,4,6];
var newArr = arr.filter(item => item>=3)  
console.log(newArr) // [3,4,6]

map循环适合在返回一个数组的时候使用，在不考虑低版本浏览器的时候用for of循环即可，其他时候用for循环。

map和filter都不修改原数组

6、reduce 循环

array.reduce(function(accumulator, arrayElement, currentIndex, arr), initialValue)

1、previousValue （上一次调用回调返回的值，或者是提供的初始值（initialValue））
2、currentValue （数组中当前被处理的元素）

initialValue为初始值

（1）数组求和

let arr = [1,2,3,4];

arr.reduce(function(pre,cur){return pre + cur});  // return 10

（2）对象里的属性求和

let result = [
  {
    subject:'math',
    score: 10
  },
  {
    subject:'chinese',
    score: 20
  },
  {
    subject:'english',
    score: 30
  }
]

let sum = result.reduce(function(prev,cur){
  return prev+cur.score;
},0)

（3）将二维数组转化为一维

let arr = [[0, 1], [2, 3], [4, 5]]
let newArr = arr.reduce((pre,cur)=>{
    return pre.concat(cur)
},[])
console.log(newArr); // [0, 1, 2, 3, 4, 5]

（4）使用reduce计算数组中的重复项

var cars = ['BMW','Benz', 'Benz', 'Tesla', 'BMW', 'Toyota'];
var carsObj = cars.reduce(function (obj, name) { 
   obj[name] = obj[name] ? ++obj[name] : 1;
  return obj;
}, {});

console.log(carsObj); // => { BMW: 2, Benz: 2, Tesla: 1, Toyota: 1 }

7、findIndex() 查到之后返回元素的索引值，查不到返回-1。

let i = list.findIndex(item => item.id == 4);
if(i>=0){
// 查到元素然后进行操作
}

8、find()  查找第一个符合条件的数组元素，查到返回该元素，查不到返回undefined

const myArr=[1,2,3,4,5,6];

var v=myArr.find(value=>value>4);

console.log(v);// 5

9、toString()  转为字符串

let arr = [1,2,3];
arr.toString()  // 1,2,3

10、join() 将数组转为字符串，且用分隔符分割

let arr = [1,2,3];

arr.join('|')  // 1|2|3

11、添加、移除

push()    从数组末尾添加

pop()     从数组末尾移除

unshift() 从数组前端添加

shift()   从数组前端移除

12、sort()  数组排序

var arr = [22, 12, 3, 43, 56, 47, 4];

arr.sort(function (a, b) {
  return a - b;  b-a // 从大到小
})

console.log(arr);  // [3, 4, 12, 22, 43, 47, 56]

13、concat() 复制或从尾部添加  使用...展开运算符代替或者push()

let arr1 = [1,2,3];

let arr2 = [4,5];

[...arr1,...arr2]  // [1,2,3,4,5]

arr1.push(...arr2) // [1,2,3,4,5]

14、slice(start,end) 第一个参数是数组的开始位置，第二个参数是数组的结束位置。

let arr1 = [1,2,3];

var arr2 = arr1.slice(1);   // [2,3]  只有一个参数时，返回指定位置到尾部的数组。

var arr3 = arr1.slice(1,2); // [2]    两个参数返回指定位置到结束位置之前的数组。

15、splice() 用于删除、插入、替换

let arr1 = [1,2,3];

let arr2 = arr1.splice(0,2); // [1,2]  删除第一项的位置和要删除的项数

let arr3 = arr1.splice(1,0,3,2) // [1,3,2,2,3] 至少3个参数实现插入或替换 第一个参数是起始位置，第二个是要删除的项，第三个及以后是要插入替换的值

16、indexOf() 用includes()代替