JavaScript中常见数组函数map、filter、find、sort的解析

前言

说起JavaScript中常见的数组函数，如果突然让你说出五个，你可能一下子还想不出，不过，当你冷静以下，你就会列出包括forEach、map、filter、find、sort、some在内的众多函数。对于这些常见的数组函数，面试中主要的考察的有两点，一是手写实现这些函数，如果你还处于懵懂状态，请看这里前端面试中常见的原生JS手写实现函数。

二是面试官会问，请说出这些函数的特性。这一点或许很多人会忽略或者不够重视，这样说不定就会在面试中吃亏。所以，这里我们将讲解这些函数的特性，让你更好的理解这些数组函数，这样在手写实现这些函数时，印象会更加深刻。

map函数

map函数功能很强大，顾名思义，“map"即"映射”，也就是原数组被"映射"成对应新数组。

特点

• 新建一个数组，需要有承载对象，也意味着原始数组在调用它后不会发生变化;
• 该数组中的每个元素都调用一个提供的函数后返回结果。
• 创建新数组不代表不能用它改变原有数组，你用原有数组去承载就可以：let arr = [1,2,3]; arr = arr.map(item => { return item * 2 })
• map()中每个元素都要执行相应的回调函数，所以必须要有return，如果你想给数组做一定的过滤处理，那map()基本上行不通：

let newArr = [1,2,3,4,5].map(item => { if(item > 3) return item })
// => [undefined, undefined, undefined, 4, 5]
最终得到的结果是[undefined, undefined, undefined, 4, 5]。别和我说你简单处理一下就能凑合用， 人生不能凑合，代码也是！

filter函数

特点

• map()没法做到的过滤，就交给filter()去完成，这个大家肯定也都知道。filter()和map()很像，也是创建一个新数组，新数组中的元素是筛选出来的符合条件的所有对象。简单写个例子：

let newArr = [1,2,3,4,5].filter(item =>{
   if(item > 3) return item 
})
//  => [4,5]

forEach函数

特点

• 可以改变数组自身，没有返回值；
• 中途不能用常规操作跳出循环，可以用抛出异常（try/catch）的方式，但不推荐这样做；
• forEach()不一定改变自身数组。我们可以看看数组中的元素是值类型和引用类型场景下，是否都能获得改变：当数组中元素是值类型，forEach绝对不会改变数组；当是引用类型，则可以改变数组
• 不支持链式操作

sort函数

特点

• sort()用于对数组的元素进行排序。排序顺序可以是字母或数字，并按升序或降序
• 默认排序按字母升序（更准确一些是根据字符串Unicode码点）
• 直接改变原始数组
• 如果想按照其他标准进行排序，就需提供比较函数compareFunction(a,b)，数组会按照调用该函数的返回值排序，即a和b是两个将要比较的元素：
  • 如果compareFunction(a,b)小于0，则a排列到b之前；
  • 如果 compareFunction(a, b)等于0，a和b的相对位置不变（并不保证）;
  • 如果 compareFunction(a, b)大于0，b排列到a之前； 直接上例子

[3,4,2,1,5].sort()
// => [1,2,3,4,5]

['Javascript','Vue','React','Node','Webpack'].sort();
// => ["Javascript", "Node", "React", "Vue", "Webpack"]

some函数

特点

• 用于检查数组中是否有某些符合条件
• 只要有一个满足即返回true，之后的不再执行
• 返回Boolean值

var result = [
   {name:'浙江省',age:76},
   {name:'江苏省',age:98}
].some(item => {
	return item.age > 80 
});
=> true

every函数

特点

• 如果说some()是"||“判断，那every()就是”&&"判断，它用于检测数组中的每一项是否都满足条件，只有都满足了才会返回true

var result = [
   {name:'霍去病',age:16},
   {name:'卫青',age:32}
].every(item => {
	return item.age > 20 
});
=> false

find函数

特点

• find()顾名思义，就是用来在数组中找到我们所需要的元素，并且和some()一样，只要有一个满足即返回该元素，不会多余遍历，对性能很友善