JS数组·高阶函数-笔记

73 阅读3分钟

高阶函数

ES5 高阶函数

forEach(),map(),some(),ervey(),filter(),reduce(),indexof()

ES6 高阶函数

find(),findIndex(),includes()

1.forEach()

只能做遍历,没有返回值
不能被中断
可以制造异常,结合 try..catch 中断
  var arr = [11, 22, 33, 44, 55];
  try {
    arr.forEach(function (item, index, aaa) {
      console.log(item, index, aaa);
      if (index == 2) {
        throw new Error("制造异常")
      }
    })
  } catch (error) {

  }
  console.log("11111");

2.map ()

能做遍历,返回一个新的数组
新数组的内容,由回调函数决定

  var arr = [11, 22, 33, 44, 55];
  var res = arr.map(function (item, index, arr) {
    return item * 10
  });

  console.log(res);
  console.log(arr);

3.some()

  只要有1个满足,就返回true
  在遍历过程中,条件满足,就中断遍历
  
  var arr = [11, 22, 33, 44, 55];
  var res = arr.some(function (item) {
    console.log(item);
    return item == 99
  });
  console.log(res);

4. ervery()

所有的满足条件,才会返回true,默认返回false

  var arr = [11, 22, 33, 44, 55];
  var res = arr.every(function (item) {
    return item > 10
  });
  console.log(res);

5.filter()

返回新的数组,数组的内容由回调函数的条件决定

  var arr = [11, 22, 33, 44, 55];
  var res = arr.filter(function (item) {
    return item > 30;
  })
  console.log(res);

6.find()

通过条件,查找某一项,如果存在,就返回这一项

  var arr = [
    { id: 1, name: "刘德华", age: 20 },
    { id: 2, name: "蔡徐坤", age: 21 },
    { id: 3, name: "吴彦祖", age: 23 },
    { id: 4, name: "彭于晏", age: 24 }];

  var res = arr.find(function (item, index) {
    return item.id == 4
  });
  console.log(res);
  

7.findIndex ()

返回满足条件某一项的下标
  var arr = [
    { id: 1, name: "刘德华", age: 20 },
    { id: 2, name: "蔡徐坤", age: 21 },
    { id: 3, name: "吴彦祖", age: 23 },
    { id: 4, name: "彭于晏", age: 24 }];

  var index = arr.findIndex(function (item) {
    return item.id == 3
  })
  console.log(index);
  

8.indexOf()

找到了返回下标,找不到返回-1
它有2个参数,第2个参数默认是从0开始,也可以指定开始位置

  var arr = [11, 22, 33, 44, 55];
  console.log(arr.indexOf(22, 2)); //22的下标是1

9.lastIndexOf()

indexOf的从后往前版 用得少

  var arr = [11, 22, 33, 44, 55, 22, 88, 22, 77];
  console.log(arr.lastIndexOf(22, 3));

10.includes()

  var arr = [11, 22, 33, 44, 55, 22, 88, 22, 77];
  console.log(arr.includes(100));//查看数组中是否有这个数 有100就返回true,没有就返回false
  

11.reduce()

  var arr = [11, 22, 33, 44, 55];
  现在的reduce只传入了一个参数 回调函数
  pre是上一次回调函数的返回值,没就是undefined
   arr.reduce(function (pre, cur, index, arr) {
   console.log(pre, cur);
   })

  reduce有2个参数,第1个参数是回调函数,第2参数给pre的初始值
   var arr = [11, 22, 34, 44, 55];
    arr.reduce(function (pre, cur) {
     console.log(pre, cur);
     return 1
    }, 100)

    arr.reduce(function (pre, cur) {
     console.log(pre, cur);
     return 1
    })

  var res = arr.reduce(function (pre, cur) {
    // pre 11 cur 22  -->33
    // pre 33 cur 34  -->67
    // pre 67 cur 44  -->111
    // pre 111 cur 55 --> 166
    return pre + cur;  //这个return决定了下一轮循环pre的值
  });
  console.log(res); //166


  //数组去重
  var arr = [1, 5, 7, 2, 5, 7, 1, 2, 5, 8, 6];
  function notRepeat(list) {
    var newArr = [];//新的空数组
    for (var i = 0; i < list.length; i++) {
      //把每一项放到空数组,在放到空数组之前,问 是否已存在,
      //如果存在,就不添加
      // if (newArr.indexOf(list[i]) == -1) {
      //   newArr.push(list[i])
      // }
      // includes 找到了返回true,找不到返回false
      if (!newArr.includes(list[i])) {
        newArr.push(list[i])
      }
    }
    return newArr;
  }
  console.log(notRepeat(arr));