本文分三类总结数组方法:1.会改变原数组,2.不会改变原数组,3.数组的遍历方法。 此文根据OBkoro1的文章总结而来,juejin.cn/post/684490…
创建一个数组
- 字面量方式 const arr = [3, 11, 8]
- 构造器 const arr = Array()
ES6 Array.of()和Array.from()
- Array.of() 返回由所有参数值组成的数组,如果没有参数,就返回一个空数组
- 目的:为了解决构造器因参数个数不同,导致行为差异的问题
- Array.from() 用于将两类对象转为真正的数组(不改变原对象,返回新的数组)
- 参数:第一个参数必需,传入需要转化为真正数组的对象;第二个参数可选,类似数组map的方法,对每个元素进行处理,将处理后的值放入返回的数组;第三个参数可选,用来绑定this
改变原数组的数组方法(9个)
对于能够改变原数组的方法,要注意避免在循环遍历中改变原数组的选项,比如改变数组的长度导致遍历的长度出现问题。
- splice(index, howmany, ...items) 添加/删除元素,返回包含被删除项目的新数组;index必需,规定添加/删除项目的位置,这个方法可以删除元素/删除并添加元素/添加元素。
- sort((a, b) => {}) 对数组元素进行排序并返回这个数组;默认按字母升序,此方法可选参数为规定排序顺序的比较函数,比较函数有两个默认要比较的参数,根据比较值(是否大于小于或等于0)规定排列顺序。
- push() 向数组末尾添加元素,返回数组新的长度
- pop() 删除数组中最后一个元素,返回删除的这个元素
- shift() 删除数组的第一个元素,返回删除的这个元素
- unshift() 向数组开头添加元素,返回数组新的长度
- reverse() 颠倒数组中元素的顺序
- ES6:copyWithin(target, start, end) 指定位置的成员复制到其他位置,返回这个数组;第一个参数是开始被替换的元素位置,第二个参数是开始读取的元素,第三个参数前面一个元素停止读取,数组长度不会改变,读取几个元素就从开始被替换的地方替换几个元素(读取一个元素替换一个,读取两个元素替换两个)
- ES6:fill(value, start, end) 填充数组;第一个参数是要填充数组的值,第二个参数是填充开始的位置,默认为0,第三个参数是填充结束的位置,默认是this.length
不改变原数组的数组方法(8个)
- slice(begin, end) 浅拷贝数组的元素,返回一个从开始到结束(不包括结束)选择的数组的一部分浅拷贝到一个新数组对象,原数组不会被修改;第一个参数索引值,默认为0,第二个参数索引值,默认数组末尾
- 浅拷贝:元素是简单数据类型,改变之后不会互相干扰;元素是复杂数据类型(对象,数组),改变其中一个,另外一个也会改变。
- join(str) 数组转字符串,把数组中的所有元素通过指定的分隔符进行分割放入一个字符串中,返回生成的字符串
- 若元素为数组,则元素也会调用join()方法;若元素是对象,对象会被转为[object Object]字符串
- toLocaleString() 数组转字符串,返回一个表示数组元素的字符串,字符串由数组中每个元素的toLocaleString()返回值经调用join()方法连接组成
- toString() 数组转字符串(不推荐);该方法效果和join()一样,用于数组转字符串,但是与join方法相比没有优势,也不能自定义字符串的分隔符,因此不推荐
- concat(...arrayx) 用于合并两个或多个数组,返回一个新数组;参数可以是具体的值或数组对象,可以是任意多个
- ES6拓展运算符...合并数组:ES6的语法更简洁易懂,通常用拓展运算符来合并数组
- indexOf(searchElement, fromIndex) 查找数组是否存在某个元素,返回数组中找到的第一个元素的索引,如果不存在返回-1
- lastIndexOf(searchElement, fromIndex) 查找指定元素在数组中的最后一个位置,返回索引,如果不存在返回-1
- ES7 includes(searchElement, fromIndex=0) 查找数组是否包含某个元素,返回布尔值,此方法是为了弥补indexOf方法的缺陷出现的,因为indexOf方法不能识别NaN,indexOf方法检查不够语义化,通过-1判断是否包含
不改变原数组的遍历数组方法(12个)
遍历的要点:1.不要在遍历的时候,修改后面要遍历的值;2.不要在遍历的时候修改数组的长度
- forEach(function(currentValue, index, arr), thisValue) 按升序为数组中含有效值的每一项执行一次回调函数;forEach()无法中途退出循环,只能return退出本次回调进行下次回调,总是返回undefined值,即使return了一个值
- every(function(currentValue, index, arr), thisValue) 检查数组所有元素是否都符合判断条件;如果数组中有一个元素不满足,则整个表达式返回false,且不再检测剩余元素(短路操作),如果所有元素满足条件,返回true
- some(function(currentValue, index, arr), thisValue) 检查数组中是否有满足判断条件的元素;如果有一个元素满足条件,则表达式返回true,剩余的元素不再检测(短路操作),如果没有满足条件的元素,返回false
- filter(function(currentValue, index, arr), thisValue) 通过所提供的函数测试过滤数组中的所有元素,返回新的数组
- map(function(currenValue, index, arr), thisValue) 对数组中的每个元素进行函数处理,返回新的数组
- reduce(function(total, currentValue, currentIndex, arr), initialValue) 为数组提供累加器,合并为一个值,对累加器和数组中的每个元素应用一个函数,最终合并为一个值
- reduceRight() 从右至左累加,这个方法除了与reduce执行方向相反外,其他完全一致
- ES6:find(function(currentValue, index, arr), thisArg)&findIndex(function(currentValue, index, arr), thisArg) 根据条件找到数组成员,前一个方法找出第一个符合条件的数组成员并返回该成员,如果没有符合条件的成员则返回undefined;第二个方法返回第一个符合条件的数组成员的索引,如果所有成员都不符合条件,返回-1。这两个方法都可以识别NaN,弥补了indexOf的不足
- ES6:keys()&values()&entries() 遍历键名、遍历键值、遍历键名+键值;三个方法都返回一个新的Array Iterator对象,对象根据方法不同包含不同的值