【复习篇】- review数组的API和常用场景

107 阅读4分钟

本文章主要是想开发者自己review下自己的基础,且面试频率挺高,所以自己总结了一下

Array.join()

  • 版本来自ES5
  • 说明: 使用分隔符,将数组转为字符串并返回
  • 场景:返回一个目标字符串,如["h","e","l","l","o"].join("") 输出"hello"

Array.toString()

  • 版本来自ES5
  • 说明: 转化并返回字符串
  • 如需深入了解请自行深读js数据类型转换

Array.pop()

  • 版本来自ES5
  • 说明:删除最后一个元素,并立即返回删除的数据

Array.shift()

  • 版本来自ES5
  • 说明:删除第一个元素,并立即返回删除的数据

Array.push()

  • 版本来自ES5
  • 说明:从末尾添加一个或多个元素,返回数组长度

Array.unshift()

  • 版本来自ES5
  • 说明:从首位添加一个或多个元素,返回数组长度

Array.reverse()

  • 版本来自ES5
  • 说明:倒序排序数组

Array.slice()

  • 版本来自ES5
  • 说明:截取指定位置的数组,并返回

Array.sort()

  • 版本来自ES5
  • 说明:排序(字符规则),返回结果

Array.splice()

  • 版本来自ES5
  • 说明:删除指定位置,并替换,返回删除的数据

Array.concat()

  • 版本来自ES5
  • 说明: 合并数组,返回一个新数组
  • 场景:多个数组需要合并成一个新数组,要注意的是数组原来的顺序有没有发生改变,如["a"].concat(["b"])则返回["a", "b"]
  • 是否改变原数组:否

Array.indexOf()

  • 版本来自ES5
  • 说明: 从左到右(顺序)查询符合目标并返回数组的索引
  • 场景:判断是否含有目标元素在数组内

Array.lastIndexOf()

  • 版本来自ES5
  • 说明: 从右到左(逆序)查询符合目标并返回数组的索引
  • 场景:判断是否含有目标元素在数组内
  • indexOf和lastIndexOf的查找规则不一样(顺序和逆序查找),看具体需求决定用哪个

Array.forEach()

  • 版本来自ES6
  • 说明: 参数为回调函数,会遍历数组所有的项,回调函数接受三个参数,分别为value,index,self;forEach没有返回值
  • 思考:面试可能会问到跟普通的for循环两者有何区别,具体区别建议还是要了解一下

Array.map()

  • 版本来自ES6
  • 说明: 同forEach,同时回调函数返回数据,组成新数组由map返回
  • 场景:返回你想要的目标元素集合 如[1,2].map(item=>item*2))则返回[2,4]

Array.filter()

  • 版本来自ES6
  • 说明: 同forEach,同时回调函数返回布尔值,为true的数据,返回值为数组
  • 个人理解:filter就是过滤的意思,只留下你想要的目标数组

Array.find()

  • 版本来自ES6
  • 说明: 同forEach,同时回调函数返回布尔值,为true的数据,返回值为符合条件的第一个元素

Array.findIndex()

  • 版本来自ES6
  • 说明: 同forEach,同时回调函数返回布尔值,为true的数据,返回值为符合条件的元素的索引,没有则返回-1,跟indexOf类似

Array.every()

  • 版本来自ES6
  • 说明: 同forEach同时回调函数返回布尔值,全部为true,否则false
  • 个人理解:全真则真,一假则假

Array.some()

  • 版本来自ES6
  • 说明: 同forEach同时回调函数返回布尔值,遇到一个为真则true,否则false
  • 个人理解:一真则真,全假则假

Array.reduce()

  • 版本来自ES6
  • 说明: 归并,同forEach,迭代数组的所有项,并构建一个最终值,由reduce返回
  • 场景:求和,求累加,求阶乘
  • 个人理解:reduce是一个累算的概念,当你的业务需要一个不停叠加的结果,则应该想到用reduce

扩展话题

以上是array的大多数用法,但是必须是一个数组的实例,以下介绍几个关于Array的API

Array.isArray()

  • 说明:判断是否为数组,是则返回true,否则返回false,此方法经常用于区分对象和数组

Array.of()

  • 版本来自ES6
  • 说明:当没有出现此方法时,我们在创建数组的时候并给初始化数据是这样的
    let foo = []
    foo.push(1)
    现在,我们可以直接使用let foo = Array.of(1)直接创建数组并插入数据

结语

以上是大部分数组的操作,其实还是靠我们日常的积累,多撸代码多熟悉记忆,需要主要的是返回值若是一个数组,则考虑会不会改变原数组,注意区分深浅拷贝就行。用最精简的代码完成业务才是我们的共同努力的目标~