map,some,every,filter,find的相同与区别

751 阅读3分钟

1.map()

map()方法定义在JavaScript的Array中,它返回一个处理过的新数组

map()不会对空数组进行检查

map()不会改变原数组

1.语法:

 array.map(function(value, index, arr), thisIndex)
 function(value, index, arr):为一个函数,数组中的每个元素都会执行这个函数。
 
其中函数参数:
value:必须。当前元素的的值。
index:可选。当前元素的索引。
arr:可选。当前元素属于的数组对象。
thisValue:可选。对象作为该执行回调时使用,传递给函数,用作"this"的值。

2.实例:

1.创建新的数组

(1) js方法
 array = [
    { id: 1, name: "选择一" },
    { id: 2, name: "选择二" },
    { id: 3, name: "选择三" }
  ];
  var array2 = array.map(function(item, index, arr) {
    return Object.assign({}, { value: item.id });
  });
  
 (2)箭头函数

 var array2 = array.map((item, index) => {
    return  item.name
  });

2.给对象数据添加新属性

 (1)箭头函数
 array=[{index:0},{index:1},{index:2}];
  array.map(item=>{
    item.active=false;
    return item;
  })

2.some()

some()用于检测数组中的元素是否满足指定条件

some()不会对空数组进行检查

some()不会改变原数组

some() 方法会依次执行数组的每个元素:

如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。

如果没有满足条件的元素,则返回false。

1.语法:

 array.some(function(value, index, arr), thisIndex)
 function(value, index, arr):为一个函数,数组中的每个元素都会执行这个函数。
 
 其中函数参数:
 value:必须。当前元素的的值。
 index:可选。当前元素的索引。
 arr:可选。当前元素属于的数组对象。
 thisValue:可选。对象作为该执行回调时使用,传递给函数,用作"this"的值。

2.实例:

1.判断数组中符合条件的

 var ages = [3, 10, 18, 20];
 var b = [];
  ages.some((item, index) => {
    if (item > 5) {
   b.push(item);
    }
  });

2.查看数组中是否包含这个值

  var ages = [3, 10, 18, 20];
  var b = [];
  var s = 10;
  ages.some((item, index) => {
    if (item == s) {
      b.push(item);
    }
  });

3.every()

every()用于检测数组中的元素是否满足指定条件

  every()不会对空数组进行检查
  every()不会改变原数组
  
 every() 方法会依次执行数组的每个元素:
  如果有一个元素不满足条件,则表达式返回false, 剩余的元素不会再执行检测。 
  如果所有元素都满足条件,则返回 true。
  
 1.语法:
 类似于some()
 
 2.实例:
  var ages = [3, 10, 18, 20];
  ages.every((item, index) => {
    if (item >10 ) {
      b.push(item);
    }
  });

4.filter()

filter() 方法返回一个通过检查指定数组中符合条件元素的新数组
filter()不会对空数组进行检查
filter()不会改变原数组

 1.语法:
类似于map()

 2.实例:
 var b = ages.filter((item, index) => {
    if (item > 10) {
      return item;
    }
  });

5.find()

find() 方法返回返回通过测试(函数内判断)的数组的第一个元素的值
find()不会对空数组进行检查
find()不会改变原数组
find()
当数组元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后不会再调用
如果没有符合条件的元素返回 undefined

1.语法:
类似于some()

2.实例:

   var ages = [3, 4, 5, 6];
   var b = ages.find(item => {
    if (item > 4) {
      return item;
    }
  });
 //b=5;

6.小结:

 map(),some(),every(),filter()的相同和区别

 相同:map(),some(),every(),filter()的语法,用法都类似;

 1.map(),filter(),都是返回一个新的数组,map()是返回处理过的数据,filter()是返回符合条件的数据

 2.some(),every(),都是返回布尔值,some()只要有一个值符合就返回true,every()是每个都要符合才返回true