js数组方法讲解大全，不够用你找我
文章目录
- 前言
- 新增
-
- push(element1,...elementN)
- unshift(element1,...elementN)
- 删除
-
- pop()
- shift()
- 更新
-
- []
- copyWithin(target, start, end])
- fill(value,start,end)
- reverse()
- sort(compareFunction)
- splice(start,deleteCount,item1, item2, ...)
- 组合
-
- concat(value1,...,valueN)
- slice(begin,end)
- 查询
-
- []
- at()
- filter(callback)
- find(callback)
- indexOf(value,fromIndex)
- lastIndexOf(value,fromIndex)
- keys()
- values()
- 判定
-
- Array.isArray(obj)
- every(callback)
- includes(value,fromIndex)
- some(callback)
- 特殊
-
- Array.from(arrayLike,mapFn)
- Array.of()
- flat(depth)
- flatMap(callback)
- forEach(callback)
- join(separator)
- map(callback)
- reduce(callback,initialValue)
- reduceRight(callback,initialValue)
- toString()
- toLocaleString(locales,options )
- 总结
前言
- 此文基于项目经验和各方文档汇总而成，如果各位有其他关于数组的高级用法欢迎评论交流。
- 篇幅过长不建议通篇阅读，可根据自己需要直接在目录查找对应方法即可。
- 如果有用请三连~
分类说明
注：splice()功能太强大，增删改都可以就放到了更新了。
新增
push(element1,…elementN)
- 将一个或多个元素
添加到数组的末尾，并返回该数组的新长度。
let myArray = ['a', 'b', 'c', 'd'];myArray.push('e', 'f');console.log(myArray); //['a','b','c','d','e','f']- push（）高级
let myArray = ['a', 'b', 'c', 'd'];let charArr = ['e', 'f'];//等同于myArray.push('e','f');myArray.push(...charArr);//等同于myArray.push('e','f');Array.prototype.push.apply(myArray, charArr);console.log(myArray); unshift(element1,…elementN)
- 将一个或多个元素
添加到数组的开头，并返回该数组的新长度(该方法修改原有数组)。
let myArray = ['a', 'b', 'c', 'd'];myArray.unshift('e', 'f');console.log(myArray); //['e','f','a', 'b', 'c', 'd']- unshift（）高级
let myArray = ['a','b', 'c', 'd'];let charArr = ['e','f'];//等同于myArray.unshift('e','f');myArray.unshift(...charArr);//等同于myArray.unshift('e','f');Array.prototype.unshift.apply(myArray, charArr); console.log(myArray); //['e','f','a', 'b', 'c', 'd']删除
pop()
- 从数组中
删除最后一个元素，并返回该元素的值。 如果数组为空则返回undefined。 此方法会更改数组的长度。
let myArray = ['a', 'b', 'c', 'd'];let popCity = myArray.pop();console.log(popCity);//'dconsole.log(myArray); //['a', 'b', 'c']shift()
- 从数组中
删除第一个元素，并返回该元素的值。 如果数组为空则返回undefined。 此方法更改数组的长度。
let myArray = ['a', 'b', 'c', 'd'];let shiftCity = myArray.shift();console.log(shiftCity);//'a'console.log(myArray); //['b', 'c', 'd']更新
[]
let myArray = ['a','b', 'c', 'd'];myArray[0] = 'e';console.log(myArray); // ['e','b', 'c', 'd']copyWithin(target, start, end])
浅复制数组的一部分到同一数组中的另一个位置，并返回它，不会改变原数组的长度。
let myArray = ['a', 'b', 'c', 'd', 'e']// 将从角标3开始到角标为4截止（不包含4）所有元素复制到角标为0开始的地方myArray.copyWithin(0, 3, 4)console.log(myArray)//["d", "b", "c", "d", "e"]// 将从角标3开始的所有元素复制到角标为1开始的地方myArray.copyWithin(1, 3)console.log(myArray)//["d", "d", "e", "d", "e"]let array2 = [['a'], 'b', 'c', 'd']// 将从角标0开始到角标为2截止（不包含2）所有元素复制到角标为2开始的地方array2.copyWithin(2, 0, 2)console.log(array2)//[['a'], 'b', ['a'], 'd']array2[0].push('e')console.log(array2)//[['a'.'e'], 'b', ['a'.'e'], 'd']fill(value,start,end)
- 用一个固定值
替换一个数组中从起始索引（默认为0）到终止索引（默认为array.length)内的全部元素。不包括终止索引。其实索引与终止索引均支持负数，若为负数则自动计算为length+start或length+end
let myArray = ['a', 'b', 'c', 'd']myArray.fill('f', 0, 2)console.log(myArray) //['f', 'f', 'c', 'd']let newArray = myArray.fill(['f', 'g'], 2, 4)console.log(newArray) //['f', 'f', ['f', 'g'], ['f', 'g']]console.log(myArray) //['f', 'f', ['f', 'g'], ['f', 'g']] //原数组被改变reverse()
- 将数组中元素的
位置颠倒，并返回该数组的引用。数组的第一个元素会变成最后一个，数组的最后一个元素变成第一个。该方法会改变原数组。
let myArray = ['a', 'b', 'c', 'd', 'e']let newArray = myArray.reverse()console.log(newArray)//['e', 'd', 'c', 'b', 'a']console.log(myArray)//['e', 'd', 'c', 'b', 'a']sort(compareFunction)
- 用原地算法对数组的元素进行排序，并返回数组引用。默认排序顺序是在
将元素转换为字符串，然后比较它们的UTF-16代码单元值序列时构建的。改变原数组。 compareFunction可选用来指定按某种顺序进行排列的函数。如果省略，元素按照转换为的字符串的各个字符的Unicode位点进行排序。
let months = ['March', 'Jan', 'Feb', 'Dec']let newMonths = months.sort()console.log(newMonths)//['Dec', 'Feb', 'Jan', 'March']console.log(months)//['Dec', 'Feb', 'Jan', 'March']let myArray = [1, 30, 4, 21, 100000]let newArray = myArray.sort()//比较的数字会先被转换为字符串，所以在Unicode顺序上 "100000" 要比 "21" 要靠前。console.log(newArray)//[1, 100000, 21, 30, 4]console.log(myArray)//[1, 100000, 21, 30, 4]let numbers = [1, 30, 4, 21, 100000]numbers.sort(function (a, b) { return a - b})//加入比较函数来保证number类元素的正常排序console.log(numbers)//[1, 4, 21, 30, 100000]- 如果 compareFunction(a, b)
小于 0，那么a会被排列到 b 之前； - 如果 compareFunction(a, b)
等于 0， a 和 b 的相对位置不变。备注： ECMAScript 标准并不保证这一行为，而且也不是所有浏览器都会遵守（例如 Mozilla 在 2003 年之前的版本）； - 如果 compareFunction(a, b)
大于 0，b会被排列到 a 之前。 - compareFunction(a, b) 必须总是对相同的输入返回相同的比较结果，否则排序的结果将是不确定的。
splice(start,deleteCount,item1, item2, …)
- 通过
删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。返回一个由删除元素组成的数组，无删除元素则返回空数组。 start指定修改的开始位置（从0计数）。如果超出了数组的长度，则从数组末尾开始添加内容；如果是负值，则表示从数组末位开始的第几位（从-1计数，这意味着-n是倒数第n个元素并且等价于array.length-n）；如果负数的绝对值大于数组的长度，则表示开始位置为第0位。deleteCount可选。表示要移除的数组元素的个数。如果 deleteCount 被省略了，或者它的值大于等于array.length - start(也就是说，如果它大于或者等于start之后的所有元素的数量)，那么start之后数组的所有元素都会被删除（含第 start 位）。如果 deleteCount 是0 或者负数，则不移除元素。这种情况下，至少应添加一个新元素。item1, item2, ...可选。要添加进数组的元素,从start位置开始。如果不指定，则 splice() 将只删除数组元素。
let myArray = ['a', 'b', 'c', 'd']//从索引2开始删除一个元素，并在该位置插入元素'g'、'h'let removedArray = myArray.splice(2, 1, 'g','h')console.log(removedArray)//['c']console.log(myArray)//['a', 'b', 'g', 'h', 'd']//从索引-3的位置开始删除一个元素let myArray2 = ['a', 'b', 'c', 'd']let removedArray2 = myArray2.splice(-3, 1)console.log(removedArray2)//['b']console.log(myArray2)//['a', 'c', 'd']组合
concat(value1,…,valueN)
- 用于合并
两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。原数组不改变。
let myArray = ['a', 'b', 'c', 'd'];let charArr = ['e', 'f'];let newArr = myArray.concat(charArr);console.log(newArr);//['a','b', 'c', 'd','e','f']console.log(myArray); //['a', 'b', 'c', 'd']- 提示：concat()执行的是
浅拷贝， 也就是说，如果引用的对象被修改，则更改对于新数组和原始数组都是可见的。
let myArray = [['a'], 'b', 'c', 'd'];let charArr = ['e', 'f'];let newArr = myArray.concat(charArr);myArray[0].push('g');console.log(newArr);//[['a','g'], 'b', 'c', 'd','e','f'];console.log(myArray); //[['a','g'], 'b', 'c', 'd'];slice(begin,end)
- 返回一个新的数组对象，这一对象是一个由 begin 和 end 决定的原数组的
浅拷贝（包括 begin，不包括end）。原始数组不会被改变。
let myArray = ['a', 'b', 'c', 'd'];let newArr = myArray.slice(1,3);console.log(newArr);//['b', 'c']console.log(myArray); //['a', 'b', 'c', 'd']- 提示：slice()执行的是
浅拷贝， 也就是说，如果引用的对象被修改，则更改对于新数组和原始数组都是可见的。
let myArray = [['a'], 'b', 'c', 'd'];let newArr = myArray.slice(0,2);myArray[0].push('g');console.log(newArr);//[['a','g'], 'b'];console.log(myArray); //[['a','g'], 'b', 'c', 'd'];查询
[]
let myArray = ['a', 'b', 'c', 'd'];let city0 = myArray[0];//获取第一个值let city1 = myArray[myArray.length - 1];//获取最后一个值let city2 = myArray[-1];//参数不能为负或者超限，比如此时myArray[myArray.length]都会返回undefinedlet i = 0;let city3 = myArray[i];//支持变量console.log(city0, city1, city2, city3);//'a' 'd' undefined 'a'console.log(myArray); //['a','b', 'c', 'd']at()
- 接收一个整数值并返回该索引的项目，允许
正数和负数。负整数从数组中的最后一个项目开始倒数。 - A polyfill of Array.prototype.at is available in core-js,现在需要自己安装，已发行的JavaScript版本还没有实装
let myArray = ['a','b', 'c', 'd'];let city0 = myArray.at(0);//获取第一个值let city1 = myArray.at(-1);//获取最后一个值let city2 = myArray.at(myArray.length);//参数不能超限，会返回undefinedlet i = 0;let city3 = myArray.at(i);//支持变量console.log(city0, city1, city2, city3);//'a' 'd' undefined 'a'console.log(myArray); //['a','b', 'c', 'd']filter(callback)
- 创建一个新数组, 其包含满足条件的所有元素。
原数组不变。没有满足条件的元素时，返回空数组’[ ]’
let myArray = [1, 2, 3, 4, 5]let newArray = myArray.filter(value => { return value > 3})console.log(newArray) //[4, 5]console.log(myArray) //[1, 2, 3, 4, 5]- filter() 高级
- filter 遍历的元素范围在
第一次调用 callback 之前就已确定了。在调用 filter 之后添加到数组中的元素不会被 callback 访问到。
let myArray = [1, 2, 3, 4, 5]let newArray = myArray.filter((value,index) => { console.log(value)//1 2 3 4 5 myArray.push(index + 6) return value > 3})console.log(newArray) //[4, 5]console.log(myArray) //[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]- 如果数组中存在的元素
被更改，则他们传入 callback 的值是 filter访问到他们那一刻的值。那些被删除的元素或从来未被赋值的元素将不会被访问到。
let myArray = [1, 2, 3, 4, 5]let newArray = myArray.filter((value, index) => { console.log(value)//1 2 3 //更改数组部分元素 if (value > 2) myArray.splice(index) return value < 5})console.log(newArray) //[1, 2, 3]console.log(myArray) //[1, 2]let myArray = [1, 2, 3, 4, 5]let newArray = myArray.filter((value, index) => { console.log(value)//1 2 3 //删除数组部分元素 if (value > 2) myArray.splice(index) return value < 5})console.log(newArray) //[1, 2, 3]console.log(myArray) //[1, 2]find(callback)
- 返回数组中满足提供的测试函数的
第一个元素的值。否则返回undefined。
let myArray = [1, 2, 3, 4]let foundBody = myArray.find(value => { return value > 2})let foundBody2 = myArray.find(value => { return value > 20})console.log(foundBody) //3console.log(foundBody2) //undefined- findIndex(callback) 方法返回数组中满足提供的测试函数的
第一个元素的索引。否则返回-1。
let myArray = [1, 2, 3, 4]let foundBodyIndex = myArray.findIndex(value => { return value > 2})let foundBodyIndex2 = myArray.findIndex(value => { return value > 20})console.log(foundBodyIndex) //3console.log(foundBodyIndex2) //undefinedindexOf(value,fromIndex)
- 返回在数组中可以找到一个给定元素的
第一个索引，如果不存在，则返回-1。
let myArray = [1, 2, 3, 4,3]let index = myArray.indexOf(3)let index2 = myArray.indexOf(2,2)console.log(index) //2console.log(index2) //-1- 注：如果 fromIndex 大于等于数组的长度，则将直接返回
-1，且不搜索该数组。 - 从
fromIndex索引处开始查找 value。如果为负值，则按升序从 array.length + fromIndex 的索引开始搜 （即从末尾开始往前跳 fromIndex 的绝对值个索引，然后往后搜寻）。fromIndex默认为0。如果计算出的索引小于 0，则整个数组都会被搜索，即相当于0。
let myArray = ['a', 'b', 'c']console.log(myArray.indexOf('a', -100)) // 0 -100+3=-97<0console.log(myArray.indexOf('a', -2)) // -1 -2+3=1,索引1及以后的元素没有'a'lastIndexOf(value,fromIndex)
- 返回在数组中可以找到一个给定元素的
最后一个索引，如果不存在，则返回-1。
let myArray = [1, 2, 3, 4, 3]let lastIndex = myArray.lastIndexOf(3)let lastIndex2 = myArray.lastIndexOf(4,2)console.log(lastIndex) //4console.log(lastIndex2) //-1- 注：如果 fromIndex 为负数且
计算后依然小于0，则将直接返回-1，且不搜索该数组。 - 从
fromIndex索引处开始逆向查找 value。如果为负值，则按升序从 array.length + fromIndex 的索引开始搜 （即从末尾开始往前跳 fromIndex 的绝对值个索引，然后从后向前搜寻）。fromIndex默认为arr.length - 1。如果计算出的索引大于或等于数组长度，则整个数组都会被搜索，即相当于arr.length - 1。
let myArray = ['a', 'b', 'c']console.log(myArray.lastIndexOf('a', -100)) // -1 -100+3=-97<0console.log(myArray.lastIndexOf('a', -2)) // 0 -2+3=1,搜索索引1向前的元素keys()
- 返回一个包含数组中每个
索引键的Array Iterator对象。
let myArray = [1, 2, 3, , 5]let iterator = myArray.keys();for (const key of iterator) { console.log(key);//0 1 2 3 4}console.log(myArray) //[1, 2, 3, , 5]values()
- 返回一个包含数组中每个
索引的值的Array Iterator对象。
let myArray = [1, 2, 3, , 5]let iterator = myArray.keys();for (const key of iterator) { console.log(key);//0 1 2 3 4}console.log(myArray) //[1, 2, 3, , 5]- 值: 数组迭代器中存储的是原数组的
地址，而不是数组元素值。
let myArray = [1, 2, 3, , 5]let iterator = myArray.values()console.log(myArray) //[1, 2, 3, , 5]console.log(iterator.next().value) //1myArray[1] = 10console.log(myArray) //[1, 10, 3, , 5]console.log(iterator.next().value) //10判定
Array.isArray(obj)
- 用于确定传递的值是否是一个 Array。
console.log(Array.isArray([1, 2, 3])); // trueconsole.log(Array.isArray({foo: 123})); // falseconsole.log(Array.isArray('foobar')); // falseconsole.log(Array.isArray(undefined)); // falseevery(callback)
- 测试一个数组内的所有元素是否
都能通过某个指定函数的测试。它返回一个布尔值。不会改变原数组。 - 注：若收到一个
空数组，此方法在一切情况下都会返回true。
let flaglet myArray = [1, 2, 3, 4, 5]flag = myArray.every(value => { return value > 3})console.log(flag) //falselet array2 = []let flag2 = array2.every(value => { return value > 3})//没有不满足条件的就是都满足条件console.log(flag2) //true- every() 高级
- every 遍历的元素范围在
第一次调用 callback 之前就已确定了。在调用 every 之后添加到数组中的元素不会被 callback 访问到。
let flaglet myArray = [1, 2, 3, 4, 5]flag = myArray.every((value, index) => { console.log(value)//1 2 3 4 5 myArray.push(index + 6) return value < 6})console.log(myArray) //[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]console.log(flag) //true- 如果数组中存在的元素
被更改，则他们传入 callback 的值是 every访问到他们那一刻的值。那些被删除的元素或从来未被赋值的元素将不会被访问到。
let flaglet myArray = [1, 2, 3, 4, 5]flag = myArray.every((value, index) => { console.log(value)//1 2 if (value > 1) myArray.splice(index) return value < 3})console.log(myArray) //[1]console.log(flag) //trueincludes(value,fromIndex)
- 用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回
true，否则返回false。
let myArray = [1, 2, 3, 4, 5]let flag = myArray.includes(3)let flag2 = myArray.includes(30)console.log(flag) //trueconsole.log(flag2) //falseconsole.log(myArray) //[1, 2, 3, 4, 5]- 注：如果 fromIndex 大于等于数组的长度，则将直接返回
false，且不搜索该数组。 - 从
fromIndex索引处开始查找 value。如果为负值，则按升序从 array.length + fromIndex 的索引开始搜 （即从末尾开始往前跳 fromIndex 的绝对值个索引，然后往后搜寻）。fromIndex默认为 0。如果计算出的索引小于 0，则整个数组都会被搜索，即相当于0。
let myArray = ['a', 'b', 'c']console.log(myArray.includes('a', -100)) // true -100+3=-97<0console.log(myArray.includes('a', -2)) // false -2+3=1,索引1及以后的元素没有'a'some(callback)
- 测试数组中是不是
至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。 - 注：若收到一个
空数组，此方法在一切情况下都会返回false。
let flaglet myArray = [1, 2, 3, 4, 5]flag = myArray.some(value => { return value > 3})console.log(flag) //truelet array2 = []let flag2 = array2.some(value => { return value > 3})console.log(flag2) //false- some() 高级
- some 遍历的元素范围在
第一次调用 callback 之前就已确定了。在调用 some 之后添加到数组中的元素不会被 callback 访问到。
let flaglet myArray = [1, 2, 3, 4, 5]flag = myArray.some((value, index) => { console.log(value)//1 2 3 4 5 myArray.push(index + 6) return value > 6})console.log(myArray) //[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]console.log(flag) //false- 如果数组中存在的元素
被更改，则他们传入 callback 的值是 some访问到他们那一刻的值。那些被删除的元素或从来未被赋值的元素将不会被访问到。
let flaglet myArray = [1, 2, 3, 4, 5]flag = myArray.some((value, index) => { console.log(value)//1 2 if (value > 1) myArray.splice(index) return value > 3})console.log(myArray) //[1]console.log(flag) //false特殊
Array.from(arrayLike,mapFn)
- 对一个类似数组或可迭代对象创建一个
新的，浅拷贝的数组实例。 - 可选参数
mapFn，让你可以在最后生成的数组上再执行一次map方法后再返回。
let myArray = [1, 2, 3, 4, 5]let newArray = Array.from(myArray, value => value * 2)let newArray2 = myArray.map(value => value * 2)let newArray3 = Array.from('abcde')console.log(newArray) //[2, 4, 6, 8, 10]console.log(newArray2) //[2, 4, 6, 8, 10]console.log(newArray3) //['a', 'b', 'c', 'd', 'e']console.log(myArray) //[1, 2, 3, 4, 5]Array.of()
创建一个具有可变数量参数的新数组实例，而不考虑参数的数量或类型。- Array.of() 和 Array 构造函数之间的区别在于处理整数参数：
Array.of(7)创建一个具有单个元素7 的数组，而Array(7)创建一个长度为7的空数组（注意：这是指一个有7个空位(empty)的数组，而不是由7个undefined组成的数组）。
Array.of(7);// [7]Array.of(1, 2, 3); // [1, 2, 3]Array(7); // [ , , , , , , ]Array(1, 2, 3); // [1, 2, 3]flat(depth)
- 会按照一个可指定的深度
递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。原数组不改变。
let myArray = [1, 2, 3, [4, 5]]let newArray = myArray.flat()//扁平深度默认为1console.log(newArray) //[1, 2, 3, 4, 5]console.log(myArray) //[1, 2, 3, [4, 5]]let myArray2 = [1, 2, 3, [[4, 5]]]let newArray2 = myArray2.flat()let newArray3 = myArray2.flat(2)console.log(newArray2) //[1, 2, 3, [4, 5]]console.log(newArray3) //[1, 2, 3, 4, 5]console.log(myArray2) //[1, 2, 3, [[4,5]]]- flat() 高级
- flat() 方法会移除数组中的
空项:
let myArray = [1, 2, , [4, 5]]let newArray = myArray.flat()console.log(newArray) //[1, 2, 4, 5]console.log(myArray) //[1, 2, , [4, 5]]- 使用
Infinity，可展开任意深度的嵌套数组
let myArray = [1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]]let newArray = myArray.flat(Infinity)console.log(newArray) //[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]console.log(myArray) //[1, 2, [3, 4, [5, 6, [7, 8, [9, 10]]]]]flatMap(callback)
- 首先使用映射函数
映射每个元素，然后将结果压缩成一个新数组。它与map连着深度值为1的flat几乎相同，但 flatMap 通常在合并成一种方法的效率稍微高一些。
let myArray = [1, 2, 3, 4]let newArrayMap = myArray.map(value => [value * 2])let newArrayFlatMap = myArray.flatMap(value => [value * 2])console.log(newArrayMap) //[[2], [4], [6], [8]]console.log(newArrayFlatMap) //[2, 4, 6, 8]console.log(myArray) //[1, 2, 3, 4]//只能flat一层let arrFlatMap2 = myArray.flatMap(value => [[value * 2]])console.log(arrFlatMap2) //[[2], [4], [6], [8]]- flatMap() 高级：在一个 map() 期间增加或去除一些项。只需返回一个
单元素数组以保留该项，返回一个多元素数组以添加项，或返回一个0项元素数组以删除该项。
//移除所有的负数，保留所有的偶数，将奇数拆分为偶数和1let myArray = [5, 4, -3, 20, 17, -33, -4, 18]let newArrayFlatMap = myArray.flatMap((n) => (n < 0) ? [] : //移除负数 (n % 2 == 0) ? [n] : //保留偶数 [n - 1, 1]) //拆分奇数console.log(newArrayFlatMap) //[4, 1, 4, 20, 16, 1, 18]console.log(myArray) //[5, 4, -3, 20, 17, -33, -4, 18]forEach(callback)
- 对数组的每个元素执行一次给定的函数。原数组不改变。返回值为
undefined
let myArray = [1, 2, 3, 4]myArray.every(value => value * 2)console.log(myArray) //[1, 2, 3, 4- forEach() 高级
- forEach 遍历的元素范围在
第一次调用 callback 之前就已确定了。在调用 forEach 之后添加到数组中的元素不会被 callback 访问到。
let myArray = [1, 2, 3, 4, 5]myArray.forEach((value, index) => { console.log(value)//1 2 3 4 5 myArray.push(index + 6)})console.log(myArray) //[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]- 如果数组中存在的元素
被更改，则他们传入 callback 的值是 forEach访问到他们那一刻的值。那些被删除的元素或从来未被赋值的元素将不会被访问到。如果已访问的元素在迭代时被删除了（例如使用 shift()），则下一个元素将被跳过。
let myArray = [1, 2, 3, 4, 5]myArray.forEach((value) => { console.log(value)//1 2 3 5 if (value === 3) myArray.shift()})console.log(myArray) //[2, 3, 4, 5]- 注：除了抛出异常以外，
没有办法中止或跳出forEach() 循环。如果需要中止或跳出循环，则不应该使用forEach() 方法。可以用for..of/for..in等。
join(separator)
- 将一个数组（或一个类数组对象）的所有元素连接成一个
字符串并返回这个字符串。如果数组只有一个项目，那么将返回该项目而不使用分隔符。 - 分隔符默认为
逗号‘,’ - 注：如果一个元素为
undefined或null，它会被转换为空字符串。
let myArray = [1, 2, 3, 4, 5, undefined, null, 6]let newArray = myArray.join()let newArray2 = myArray.join('')let newArray3 = myArray.join('-')console.log(newArray) //1,2,3,4,5,,,6console.log(newArray2) //123456console.log(newArray3) //1-2-3-4-5---6console.log(myArray) //[1, 2, 3, 4, 5, undefined, null, 6]map(callback)
- 创建一个
新数组，这个新数组由原数组中的每个元素都调用一次提供的函数后的返回值组成。
let myArray = [1, 2, 3, 4]myArray.every(value => value * 2)console.log(myArray) //[1, 2, 3, 4- map() 高级
- map 遍历的元素范围在
第一次调用 callback 之前就已确定了。在调用 map 之后添加到数组中的元素不会被 callback 访问到。
let myArray = [1, 2, 3, 4, 5]let newArray = myArray.map((value, index) => { console.log(value)//1 2 3 4 5 myArray.push(index + 6) return value*2})console.log(newArray) //[2, 4, 6, 8, 10]console.log(myArray) //[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]- 如果数组中存在的元素
被更改，则他们传入 callback 的值是 map访问到他们那一刻的值。那些被删除的元素或从来未被赋值的元素将不会被访问到。如果已访问的元素在迭代时被删除了（例如使用 shift()），则下一个元素将被跳过。
let myArray = [1, 2, 3, 4, 5]let newArray = myArray.map((value, index) => { console.log(value)//1 2 3 5 if (value === 3) myArray.shift() return value*2})console.log(newArray) //[2, 4, 6, 10, 空]console.log(myArray) //[2, 3, 4, 5]reduce(callback,initialValue)
- 对数组中的每个元素按序执行一个设定的
reducer 函数，每一次运行 reducer 会将先前元素的计算结果作为参数传入，最后将其结果汇总为单个返回值。 previousValue：上一次调用 callbackFn 时的返回值。在第一次调用时，若指定了初始值initialValue，其值则为 initialValue，否则为数组索引为 0 的元素array[0]。currentValue：数组中正在处理的元素。在第一次调用时，若指定了初始值initialValue，其值则为数组索引为 0 的元素array[0]，否则为array[1]。- 当数组为空且初始值 initialValue 未提供时，会报错TypeError。
//语法reduce((previousValue, currentValue) => { /* ... */ } )reduce((previousValue, currentValue, currentIndex) => { /* ... */ } )reduce((previousValue, currentValue, currentIndex, array) => { /* ... */ } )reduce((previousValue, currentValue, currentIndex, array) => { /* ... */ }, initialValue)let myArray = [1, 2, 3, 4]let initialValue = 0let sumWithInitial = myArray.reduce( (previousValue, currentValue) => previousValue + currentValue, initialValue)console.log(sumWithInitial)//10- reduce() 高级
- reduce 遍历的元素范围在
第一次调用 callback 之前就已确定了。在调用 reduce 之后添加到数组中的元素不会被 callback 访问到。
let myArray = [1, 2, 3, 4, 5]let sum = myArray.reduce((preValue, currentValue) => { console.log(currentValue)//1 2 3 4 5 myArray.push(currentValue + 5) return preValue + currentValue}, 0)console.log(sum) //15console.log(myArray) //[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]- 如果数组中存在的元素
被更改，则他们传入 callback 的值是 reduce访问到他们那一刻的值。那些被删除的元素或从来未被赋值的元素将不会被访问到。如果已访问的元素在迭代时被删除了（例如使用 shift()），则下一个元素将被跳过。
let myArray = [1, 2, 3, 4, 5]let sum = myArray.reduce((preValue, currentValue) => { console.log(currentValue)//1 2 3 5 if (currentValue === 3) myArray.shift() return preValue + currentValue}, 0)console.log(sum) //11console.log(myArray) //[2, 3, 4, 5]reduceRight(callback,initialValue)
- 对数组中的每个元素按序执行一个设定的 reducer 函数，每一次运行 reducer 会将先前元素的计算结果作为参数传入，最后将其结果汇总为单个返回值。
previousValue：上一次调用 callbackFn 时的返回值。在第一次调用时，若指定了初始值initialValue，其值则为initialValue，否则为数组索引为 array.length-1 的元素array[array.length-1]。currentValue：数组中正在处理的元素。在第一次调用时，若指定了初始值initialValue，其值则为数组索引为 array.length-1 的元素array[array.length-1]，否则为array[array.length-2]。- 当数组为空且初始值 initialValue 未提供时，会报错TypeError。
//语法reduceRight((previousValue, currentValue) => { /* ... */ } )reduceRight((previousValue, currentValue, currentIndex) => { /* ... */ } )reduceRight((previousValue, currentValue, currentIndex, array) => { /* ... */ } )reduceRight((previousValue, currentValue, currentIndex, array) => { /* ... */ }, initialValue)let myArray = [1, 2, 3, 4]let initialValue = 0let sumWithInitial = myArray.reduceRight( (previousValue, currentValue) => previousValue + currentValue, initialValue)console.log(sumWithInitial)//10- reduce()与reduceRight()的区别：前者
从左向右，后者从右向左。
let myArray = ['1', '2', '3', '4', '5']let left = myArray.reduce(function (prev, cur) { return prev + cur })let right = myArray.reduceRight(function (prev, cur) { return prev + cur })console.log(left) // "12345"console.log(right) // "54321"toString()
- 返回一个
字符串，表示指定的数组及其元素。 - Array对象覆盖了Object的 toString 方法。对于数组对象，toString 方法连接数组并返回一个字符串，其中包含用
逗号分隔的每个数组元素。等同于不写分隔符的join()或join(',')。 - 当一个数组被作为文本值或者进行字符串连接操作时，将会自动调用其 toString 方法。
let myArray = [1, 2, 3, 4, 5, undefined, null, 6]let newArray = myArray.toString()console.log(newArray) //1,2,3,4,5,,,6console.log(myArray) //[1, 2, 3, 4, 5, undefined, null, 6]toLocaleString(locales,options )
- 返回一个字符串表示数组中的元素。数组中的元素将使用
各自的toLocaleString方法转成字符串，这些字符串将使用一个特定语言环境的字符串（例如一个逗号 “,”）隔开。 - locales 可选。带有BCP 47语言标记的字符串或字符串数组，关于locales参数的形式与解释，请看Intl页面。
- options 可选。一个可配置属性的对象，对于数字 Number.prototype.toLocaleString()，对于日期Date.prototype.toLocaleString()。
- 注：如果一个元素为
undefined或null，它会被转换为空字符串。
let myArray = [1, 'a', new Date('21 Dec 1997 14:12:00 UTC')]let localeString = myArray.toLocaleString('en', { timeZone: 'UTC' })console.log(localeString)//1,a,12/21/1997, 2:12:00 PM总结
两万字码的长文总算完结了，如果有帮助来个三连呀~
创作打卡挑战赛 
赢取流量/现金/CSDN周边激励大奖
