JavaScript中Array数组方法总结
JavaScript 中 Array 数组方法总结
方法 | 是否修改原始值 | 是否有返回值 | 描述 |
---|---|---|---|
join() | 否 | 是 | 把数组的所有元素放入一个字符串。原始值不变。 |
concat() | 否 | 是 | 连接两个或更多的数组,并返回结果,返回新数组,原始值不变。 |
reverse() | 是 | 是 | 反转数组的元素顺序。原始值改变。 |
sort() | 是 | 是 | 对数组的元素进行排序。原始值改变。 |
pop() | 是 | 是 | 删除数组的最后一个元素并返回删除的元素。原始值改变。 |
push() | 是 | 是 | 向数组的末尾添加一个或更多元素,并返回新的长度。原始值改变。 |
shift() | 是 | 是 | 删除并返回数组的第一个元素。原始值改变。 |
unshift() | 是 | 是 | 向数组的开头添加一个或更多元素,并返回新的长度。原始值改变。 |
slice() | 否 | 是 | 选取数组的一部分,并返回一个新数组。原始值不变。 |
splice() | 是 | 是 | 从数组中添加或删除元素。原始值改变。 |
forEach() | 否 | 否 | 数组每个元素都执行一次回调函数。原始值不变。 |
every() | 否 | 是 | 检测数值元素的每个元素是否都符合条件。布尔值。如果所有元素都通过检测返回 true,否则返回 false。原始值不变。 |
some() | 否 | 是 | 检测数组元素中是否有元素符合指定条件。布尔值。如果数组中有元素满足条件返回 true,否则返回 false。原始值不变。 |
filter() | 否 | 是 | 检测数值元素,并返回符合条件所有元素的数组。返回数组,包含了符合条件的所有元素。如果没有符合条件的元素则返回空数组。原始值不变。 |
map() | 否 | 是 | 通过指定函数处理数组的每个元素,并返回处理后的数组。返回新数组,原始值不变。 |
indexOf() | 否 | 是 | 搜索数组中的元素,并返回它所在的位置。从左向右查找,元素在数组中的位置,如果没有搜索到则返回 -1。原始值不变。 |
lastIndexOf() | 否 | 是 | 搜索数组中的元素,并返回它最后出现的位置。从右向左查找,元素在数组中的位置,如果没有搜索到则返回 -1。原始值不变。 |
includes() | 否 | 是 | 判断一个数组是否包含一个指定的值。布尔值。如果找到指定值返回 true,否则返回 false。原始值不变。 |
copyWithin() | 是 | 是 | 从数组的指定位置拷贝元素到数组的另一个指定位置中。原始值改变。 |
from() | 否 | 是 | 将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括 ES6 新增的数据结构 Set 和 Map)。返回数组对象。原始值不变。 |
fill() | 是 | 是 | 使用一个固定值来填充数组。并返回一个新数组。原始值改变。 |
find() | 否 | 是 | 返回符合传入测试(函数)条件的数组元素。当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。如果没有符合条件的元素返回 undefined。原始值不变。 |
findIndex() | 否 | 是 | 返回符合传入测试(函数)条件的数组元素索引。当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。如果没有符合条件的元素返回 -1,原始值不变。 |
isArray() | 否 | 是 | 判断对象是否为数组。如果对象是数组返回 true,否则返回 false。布尔值。原始值不变。 |
keys() | 否 | 是 | 包含原始数组的键名(key), 键名的遍历器对象,可以用 for...of 循环进行遍历。 |
values() | 否 | 是 | 包含原始数组的键值(value), 键值的遍历器对象,可以用 for...of 循环进行遍历。 |
entries() | 否 | 是 | 包含原始数组的键名(key)、键值(value),键值对的遍历器对象,可以用 for...of 循环进行遍历。 |
of() | 否 | 是 | 总是将一组值,转换为数组。 |
flat() | 否 | 是 | 用于将嵌套的数组“拉平”,变成一维的数组。该方法返回一个新数组,对原数据没有影响。 |
flatMap() | 否 | 是 | 总对原数组的每个成员执行一个函数,然后对返回值组成的数组执行 flat()方法。该方法返回一个新数组,不改变原数组。只能展开一层数组。 |
at() | 否 | 是 | 接受一个整数作为参数,返回对应位置的成员,支持负索引。这个方法不仅可用于数组,也可用于字符串和类型数组(TypedArray)。 |
reduce() | 否 | 是 | 对数组里每个元素执行一次回调函数,将数组元素计算为一个值(从左到右)。 |
reduceRight() | 否 | 是 | 对数组里每个元素执行一次回调函数,将数组元素计算为一个值(从右到左)。 |
toString() | 否 | 是 | 把数组转换为字符串,并返回结果。 |
valueOf() | 否 | 是 | 返回数组对象的原始值。 |
跳出循环/结束遍历方法
方法 | break | continue | return | return true | return false | 结论 |
---|---|---|---|---|---|---|
for 循环 | 成功 | 跳出本次循环 | 不合法 | 不合法 | 不合法 | √ |
Array.forEach() | 不合法 | 不合法 | 跳出本次循环 | 跳出本次循环 | 跳出本次循环 | × |
for...in | 成功 | 跳出本次循环 | 不合法 | 不合法 | 不合法 | √ |
Array.map() | 不合法 | 不合法 | 跳出本次循环 | 跳出本次循环 | 跳出本次循环 | × |
Array.some() | 不合法 | 不合法 | 跳出本次循环 | 成功 | 跳出本次循环 | √ |
Array.every() | 不合法 | 不合法 | 成功 | 跳出本次循环 | 成功 | √ |
Array.find() | 不合法 | 不合法 | 跳出本次循环 | 成功 | 跳出本次循环 | √ |
Array.findIndex() | 不合法 | 不合法 | 跳出本次循环 | 成功 | 跳出本次循环 | √ |
方法解析
代码没有特殊标注情况下,本文环境均是在 Chrome 环境下测试输出
array.join()
: 把数组的所有元素放入一个字符串。原始值不变。
- 默认值是
,
let arr1 = [1,2,3,4,5,6,7,8,9];
// 1,2,3,4,5,6,7,8,9 [1, 2, 3, 4, 5, 6, 7, 8, 9]
console.log( arr1.join(), arr1);
// 1-2-3-4-5-6-7-8-9 [1, 2, 3, 4, 5, 6, 7, 8, 9]
console.log( arr1.join('-'), arr1);
array.concat()
: 连接两个或更多的数组,并返回结果,返回新数组,原始值不变。
- 可以放数组,字符串任何东西
let str1 = 'hello';
let obj1 = { age: 19};
let arr1 = [1,2,3];
let arr2 = [4,5];
// [1, 2, 3, 'hello', {…}, 4, 5]
console.log( arr1.concat( str1, obj1 ,arr2 ) );
// [1, 2, 3]
console.log( arr1 );
array.reverse()
: 反转数组的元素顺序。原始值改变。
let arr1 = [1,2,3,4,5,6,7,8,9];
// [9, 8, 7, 6, 5, 4, 3, 2, 1] [9, 8, 7, 6, 5, 4, 3, 2, 1]
console.log( arr1.reverse(), arr1);
array.sort( [排序规则] )
: 对数组的元素进行排序。原始值改变。
条件:
1,规则必须是一个函数。
2,函数必须有返回值。
3,返回值必须是 number 类型的数字。
排序方式: 每次挑选两个值进行排序,直到把所有的位置关系都确定下。
1,如果返回值是一个正数,就会交换两个比较值的位置。
2,如果返回值是负数或者零,就不会交换两个比较值的位置。(0 表示两个比较值是相等的。)
注意: 自定义规则必须返回一个 number 类型的数字,否则规则无效,不会排序。
let arr1 = [11,12,13,14,135,16,17,18,19];
// [9, 8, 7, 6, 5, 4, 3, 2, 1] [9, 8, 7, 6, 5, 4, 3, 2, 1]
console.log( arr1.sort(), arr1);
// [11, 12, 13, 14, 16, 17, 18, 19, 135] [11, 12, 13, 14, 16, 17, 18, 19, 135]
console.log( arr1.sort( ( n1, n2)=>{ return n1-n2 } ), arr1);
// [135, 19, 18, 17, 16, 14, 13, 12, 11] [135, 19, 18, 17, 16, 14, 13, 12, 11]
console.log( arr1.sort( ( n1, n2)=>{ return n2-n1 } ), arr1);
array.pop()
: 删除数组的最后一个元素并返回删除的元素。原始值改变。
let arr1 = [1,2,3,4,5];
// 5
console.log( arr1.pop() );
// [1, 2, 3, 4]
console.log( arr1 );
array.push()
: 向数组的末尾添加一个或更多元素,并返回新的长度。原始值改变。
let arr1 = [1,2,3,4,5];
// 6
console.log( arr1.push(6) );
// [1, 2, 3, 4, 5, 6]
console.log( arr1 );
// 8
console.log( arr1.push(6,7) );
// [1, 2, 3, 4, 5, 6, 6, 7]
console.log( arr1 );
// 9
console.log( arr1.push([6,7]) );
// [1, 2, 3, 4, 5, 6, 6, 7, [6,7]]
console.log( arr1 );
array.shift()
: 删除并返回数组的第一个元素。原始值改变。
let arr1 = [1,2,3,4,5];
// 1
console.log( arr1.shift() );
// [2, 3, 4, 5]
console.log( arr1 );
array.unshift()
: 向数组的开头添加一个或更多元素,并返回新的长度。原始值改变。
let arr1 = [1,2,3,4,5];
// 6
console.log( arr1.unshift(6) );
// [6, 1, 2, 3, 4, 5]
console.log( arr1 );
// 8
console.log( arr1.unshift(6,7) );
// [6, 6, 7, 1, 2, 3, 4, 5]
console.log( arr1 );
// 9
console.log( arr1.unshift([6,7]) );
// [[6,7], 6, 7, 6, 1, 2, 3, 4, 5]
console.log( arr1 );
array.slice( start, end )
: 选取数组的一部分,并返回一个新数组。原始值不变。
- start : 必需。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。
- end : 可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。
- 不包含 end 元素,原数组不变,返回的是新数组,如果传负数,则用数组长度加上该数来确定相应的位置
- 如果 end 结束位置小于 start 起始位置,则返回空数组
let arr1 = [1,2,3,4,5];
// [1, 2, 3, 4, 5]
console.log( arr1.slice() );
// [3, 4, 5]
console.log( arr1.slice( 2 ) );
// [5]
console.log( arr1.slice( -1 ) );
// []
console.log( arr1.slice( 3, 1 ) );
// []
console.log( arr1.slice( -1, -3 ) );
// [3]
console.log( arr1.slice( -3, -2 ) );
// []
console.log( arr1.slice( -30, 0 ) );
array.splice( index, howmany, item1, ....., itemX )
: 从数组中添加或删除元素。原始值改变。
- 如果仅删除元素,则返回删除元素的数组。 如果未删除任何元素,则返回空数组。
- index : 必需。规定从何处添加/删除元素。该参数是开始插入和(或)删除的数组元素的下标,必须是数字。
- howmany : 可选。规定应该删除多少元素。必须是数字,但可以是 "0"。如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
- item1, ..., itemX : 可选。要添加到数组的新元素
let arr1 = [1,2,3,4,5,6,7,8,9];
// [] [1, 2, 3, 4, 5, 6, 7, 8, 9]
console.log( arr1.splice(), arr1);
// [3, 4, 5, 6, 7, 8, 9] [1, 2]
console.log( arr1.splice( 2 ), arr1 );
let arr2 = [1,2,3,4,5,6,7,8,9];
// [7, 8, 9] [1, 2, 3, 4, 5, 6]
console.log( arr2.splice( -3 ), arr2 );
let arr3 = [1,2,3,4,5,6,7,8,9];
// [4, 5, 6] [1, 2, 3, 7, 8, 9]
console.log( arr3.splice( 3, 3 ), arr3 );
array.forEach( fn )
: 数组每个元素都执行一次回调函数。原始值不变。
- 不会对空数组进行检测。
- fn( item, index, arr) : fn 必须。函数,数组中的每个元素都会执行这个函数, item 必须。当前元素的值, index 可选。当前元素的索引值, arr 可选。当前元素属于的数组对象
- 基本类型我们当次循环拿到的 ele,只是 forEach 给我们在另一个地方复制创建新元素,是和原数组这个元素没有半毛钱联系的!所以,我们使用 forEach 循环拿到的 ele 赋值都是无用功!如果 fn 里面的 item 是对象,可就不是这种情况了,是会修改原始值的!!!
- 针对每一个元素执行提供的函数(executes a provided function once for each array element)。除了抛出异常以外,没有办法中止或跳出 forEach() 循环。如果你需要中止或跳出循环,forEach() 方法不是应当使用的工具。
forEach() 被调用时,不会改变原数组,也就是调用它的数组(尽管 callback 函数在被调用时可能会改变原数组)。(译注:此处说法可能不够明确,具体可参考 EMCA 语言规范:‘forEach does not directly mutate the object on which it is called but the object may be mutated by the calls to callbackfn.’,即 forEach 不会直接改变调用它的对象,但是那个对象可能会被 callback 函数改变。)
let sum = 0;
let arr1 = [11,12,13,14,135,16,17,18,19];
arr1.forEach( ( item) => { sum += item; } );
// 255
console.log(sum);
array.every( fn )
: 检测数值元素的每个元素是否都符合条件。布尔值。如果所有元素都通过检测返回 true,否则返回 false。原始值不变。
- 不会对空数组进行检测。
- 如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。如果所有元素都满足条件,则返回 true。
- fn( item, index, arr) : fn 必须。函数,数组中的每个元素都会执行这个函数, item 必须。当前元素的值, index 可选。当前元素的索引值, arr 可选。当前元素属于的数组对象
let arr1 = [11,12,13,14,135,16,17,18,19];
// true [11, 12, 13, 14, 135, 16, 17, 18, 19]
console.log( arr1.every( ( item, index, arr )=>{ return item >9 } ), arr1);
// false [11, 12, 13, 14, 135, 16, 17, 18, 19]
console.log( arr1.every( ( item, index, arr )=>{ return item >150 } ), arr1);
let arr2 =[];
// true []
console.log( arr2.every( ( item, index, arr )=>{ return item >9 } ), arr2);
// true []
console.log( arr2.every( ( item, index, arr )=>{ return item >150 } ), arr2);
array.some()
: 检测数组元素中是否有元素符合指定条件。布尔值。如果数组中有元素满足条件返回 true,否则返回 false。原始值不变。
- 不会对空数组进行检测。
- 如果有一个元素满足条件,则表达式返回 true , 剩余的元素不会再执行检测。如果没有满足条件的元素,则返回 false。
- fn( item, index, arr) : fn 必须。函数,数组中的每个元素都会执行这个函数, item 必须。当前元素的值, index 可选。当前元素的索引值, arr 可选。当前元素属于的数组对象
let arr1 = [11,12,13,14,135,16,17,18,19];
// true, [11, 12, 13, 14, 135, 16, 17, 18, 19]
console.log( arr1.some( ( item, index, arr )=>{ return item += 15 } ), arr1);
// true, [11, 12, 13, 14, 135, 16, 17, 18, 19]
console.log( arr1.some( ( item, index, arr )=>{ return item += 150 } ), arr1);
let arr2 =[];
// false, []
console.log( arr2.some( ( item, index, arr )=>{ return item += 9 } ), arr2);
// false, []
console.log( arr2.some( ( item, index, arr )=>{ return item += 150 } ), arr2);
array.filter( fn )
: 检测数值元素,并返回符合条件所有元素的数组。返回数组,包含了符合条件的所有元素。如果没有符合条件的元素则返回空数组。原始值不变。
- 不会对空数组进行检测。
- 结果是执行 fn 函数会返回 true 的项组成的数组。
- fn( item, index, arr) : fn 必须。函数,数组中的每个元素都会执行这个函数, item 必须。当前元素的值, index 可选。当前元素的索引值, arr 可选。当前元素属于的数组对象
let arr1 = [11,12,13,14,135,16,17,18,19];
// [135, 16, 17, 18, 19] [11, 12, 13, 14, 135, 16, 17, 18, 19]
console.log( arr1.filter( ( item, index, arr )=>{ return item > 15 } ), arr1);
// [] [11, 12, 13, 14, 135, 16, 17, 18, 19]
console.log( arr1.filter( ( item, index, arr )=>{ return item > 150 } ), arr1);
let arr2 =[];
// [] []
console.log( arr2.filter( ( item, index, arr )=>{ return item > 9 } ), arr2);
// [] []
console.log( arr2.filter( ( item, index, arr )=>{ return item > 150 } ), arr2);
array.map()
: 通过指定函数处理数组的每个元素,并返回处理后的数组。返回新数组,原始值不变。
- 不会对空数组进行检测。
- fn( item, index, arr) : fn 必须。函数,数组中的每个元素都会执行这个函数, item 必须。当前元素的值, index 可选。当前元素的索引值, arr 可选。当前元素属于的数组对象
- 创建一个新的数组,其中每一个元素由调用数组中的每一个元素执行提供的函数得来(creates a new array with the results of calling a provided function on every element in the calling array)。map 方法会给原数组中的每个元素都按顺序调用一次 callback 函数。callback 每次执行后的返回值(包括 undefined)组合起来形成一个新数组。 callback 函数只会在有值的索引上被调用;那些从来没被赋过值或者使用 delete 删除的索引则不会被调用。
let arr1 = [11,12,13,14,135,16,17,18,19];
// [26, 27, 28, 29, 150, 31, 32, 33, 34] [11, 12, 13, 14, 135, 16, 17, 18, 19]
console.log( arr1.map( ( item, index, arr )=>{ return item += 15 } ), arr1);
// [161, 162, 163, 164, 285, 166, 167, 168, 169] [11, 12, 13, 14, 135, 16, 17, 18, 19]
console.log( arr1.map( ( item, index, arr )=>{ return item += 150 } ), arr1);
let arr2 =[];
// [] []
console.log( arr2.map( ( item, index, arr )=>{ return item += 9 } ), arr2);
// [] []
console.log( arr2.map( ( item, index, arr )=>{ return item += 150 } ), arr2);
array.indexOf( searchItem, fromIndex )
: 搜索数组中的元素,并返回它所在的位置。从左向右查找,元素在数组中的位置,如果没有搜索到则返回 -1。原始值不变。
- searchItem : 必须。查找的元素。
- fromIndex : 可选,表示从这个位置开始向右搜索,若缺省或格式不合要求,使用默认值 0
let arr1 = [2, 5, 7, 3, 5];
// 1 ("x"被忽略)
console.log(arr1.indexOf(5, "x"));
// 4 (从3号位开始向右搜索)
console.log(arr1.indexOf(5, "3"));
// -1 (未找到)
console.log(arr1.indexOf(4));
// -1 (未找到,因为5 !== "5")
console.log(arr1.indexOf("5"));
array.lastIndexOf( searchItem, fromIndex )
: 从右向左查找,元素在数组中的位置,如果没有搜索到则返回 -1。原始值不变。
- searchItem : 必须。查找的元素。
- fromIndex : 可选,表示从这个位置开始向左搜索,若缺省或格式不合要求,使用默认值 array.length - 1
let arr1 = [2, 5, 7, 3, 5];
// -1 ("x"被忽略)
console.log(arr1.lastIndexOf(5, "x"));
// 1 (从倒数3号位开始向左搜索)
console.log(arr1.lastIndexOf(5, "3"));
// -1 (未找到)
console.log(arr1.lastIndexOf(4));
// -1 (未找到,因为5 !== "5")
console.log(arr1.lastIndexOf("5"));
array.includes( searchItem, fromIndex )
: 判断一个数组是否包含一个指定的值。布尔值。如果找到指定值返回 true,否则返回 false。原始值不变。
- searchItem : 必须。查找的元素。
- fromIndex : 可选,表示从这个位置开始向右搜索,如果为负值,则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。
- 如果 fromIndex 大于等于数组长度 ,则返回 false 。该数组不会被搜索
let arr1 = [2, 5, 7, 3, 5];
let arr2 = [2, 5, 7, 3, NaN];
// true
console.log(arr1.includes( 7));
// false
console.log(arr1.includes( 4 ));
// true
console.log(arr1.includes( 3, 3 ));
// false
console.log(arr1.includes( 3, -1));
// true
console.log(arr2.includes( NaN ));
array.copyWithin( target, start, end )
: 从数组的指定位置拷贝元素到数组的另一个指定位置中。返回拷贝后的数组,原始值改变。
- target : 必需。复制到指定目标索引位置。
- start : 可选。元素复制的起始位置。从该位置开始读取数据,默认为 0。如果为负值,表示倒数。
- end : 可选。停止复制的索引位置 (默认为 array.length)。如果为负值,表示倒数。
- 这三个参数都应该是数值,如果不是,会自动转为数值。
- 会连空位一起拷贝。
let arr1 = [1, 2, 3, 4, , 5];
// [4, 空白, 5, 4, 空白, 5] [4, 空白, 5, 4, 空白, 5]
console.log(arr1.copyWithin(0, 3), arr1);
let arr2 = [1, 2, 3, 4, 5];
// [4, 2, 3, 4, 5] [4, 2, 3, 4, 5]
console.log(arr2.copyWithin(0, 3, 4), arr2);
let arr3 = [1, 2, 3, 4, 5];
// [4, 2, 3, 4, 5] [4, 2, 3, 4, 5]
console.log(arr3.copyWithin(0, -2, -1), arr3);
array.from( object, mapFunction, thisValue )
: 将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括 ES6 新增的数据结构 Set 和 Map)。返回数组对象。原始值不变。
- object : 必需,要转换为数组的对象。
- mapFunction : 可选,数组中每个元素要调用的函数。
- thisValue : 可选,映射函数(mapFunction)中的 this 对象。
let setObj = new Set(['a', 'b', 'c']);
let arrObj = Array.from(setObj);
// Set(3) {'a', 'b', 'c'} (3) ['a', 'b', 'c']
console.log( setObj, arrObj);
let arr1 = [1, 2, 3];
let arr2 = Array.from(arr1, x => x * 10);
// [1, 2, 3] [10, 20, 30]
console.log(arr1, arr2);
array.fill( target, start, end)
: 使用一个固定值来填充数组。并返回一个新数组。原始值改变。
- target : 将要填充的内容
- start : 可选,填充的开始位置索引
- end : 可选,填充的结尾位置索引
['a', 'b', 'c'].fill(7)
// [7, 7, 7]
new Array(3).fill(7)
// [7, 7, 7]
let arr1 = [1, 2, 3, 4, 5];
// [1, 2, 'aa', 'aa', 5] [1, 2, 'aa', 'aa', 5]
console.log(arr1.fill('aa', 2, 4), arr1);
array.find( fn )
: 返回符合传入测试(函数)条件的数组元素。当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。如果没有符合条件的元素返回 undefined。原始值不变。
- 不会对空数组进行检测。
- 当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。如果没有符合条件的元素返回 undefined。
- fn( item, index, arr) : fn 必须。函数,数组中的每个元素都会执行这个函数, item 必须。当前元素的值, index 可选。当前元素的索引值, arr 可选。当前元素属于的数组对象
let arr1 = [1, 2, 3, 4, 5];
// 1 [1, 2, 3, 4, 5] 返回第一个小于3的元素
console.log(arr1.find( (n) => n < 3 ), arr1);
array.findIndex()
: 返回符合传入测试(函数)条件的数组元素索引。当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。如果没有符合条件的元素返回 -1,原始值不变。
- 不会对空数组进行检测。
- 当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。如果没有符合条件的元素返回 -1。
- fn( item, index, arr) : fn 必须。函数,数组中的每个元素都会执行这个函数, item 必须。当前元素的值, index 可选。当前元素的索引值, arr 可选。当前元素属于的数组对象
let arr1 = [1, 2, 3, 4, 5];
// 3 [1, 2, 3, 4, 5] 返回第一个大于3的元素索引
console.log(arr1.findIndex( (n) => n > 3 ), arr1);
Array.isArray()
: 判断对象是否为数组。如果对象是数组返回 true,否则返回 false。布尔值。原始值不变。
let arr1 = [1, 2, 3, 4, 5];
// true [1, 2, 3, 4, 5]
console.log(Array.isArray( arr1 ), arr1);
array.keys()
: 包含原始数组的键名(key), 键名的遍历器对象,可以用 for...of 循环进行遍历。
array.values()
: 包含原始数组的键值(value), 键值的遍历器对象,可以用 for...of 循环进行遍历。
array.entries()
: 包含原始数组的键名(key)、键值(value),键值对的遍历器对象,可以用 for...of 循环进行遍历。
let arr = ['a', 'b', 'c'];
console.log( arr.entries()); //Array Iterator {}
console.log( arr.keys()); //Array Iterator {}
console.log( arr.values()); //Array Iterator {}
for (let index of ['a', 'b', 'c'].keys()) {
console.log(index);
}
// 0
// 1
// 2
for (let elem of ['a', 'b', 'c'].values()) {
console.log(elem);
}
// 'a'
// 'b'
// 'c'
for (let [index, elem] of ['a', 'b', 'c'].entries()) {
console.log(index, elem);
}
// 0 "a"
// 1 "b"
// 2 "c"
Array.of()
: 总是将一组值,转换为数组。
console.log(Array.of()) // []
console.log(Array.of(undefined)) // [undefined]
console.log(Array.of(1)) // [1]
console.log(Array.of(1, 2,'1',{name:'tom'})) // [1, 2, '1', {name: 'tom'}]);
array.flat(num)
: 用于将嵌套的数组“拉平”,变成一维的数组。该方法返回一个新数组,对原数据没有影响。
num: 拉平数组嵌套的层数,默认值是 1,Infinity 代表无限拉平
原数组有空位,flat()方法会跳过空位
[1, [2, [3]]].flat(Infinity)
// [1, 2, 3]
[1, 2, , 4, 5].flat()
// [1, 2, 4, 5]
array.flatMap(fn, thisArg)
: 总对原数组的每个成员执行一个函数,然后对返回值组成的数组执行 flat()方法。该方法返回一个新数组,不改变原数组。
只能展开一层数组。
fn(currentValue, index, array): 一个遍历函数,该函数可以接受三个参数,分别是当前数组成员、当前数组成员的位置(从零开始)、原数组。
thisArg:第二个参数,用来绑定 fn 遍历函数里面的 this。
// 相当于 [[2, 4], [3, 6], [4, 8]].flat()
[2, 3, 4].flatMap((x) => [x, x * 2])
// [2, 4, 3, 6, 4, 8]
// flatMap()只能展开一层数组。
// 相当于 [[[2]], [[4]], [[6]], [[8]]].flat()
[1, 2, 3, 4].flatMap(x => [[x * 2]])
// [[2], [4], [6], [8]]
array.at()
: 接受一个整数作为参数,返回对应位置的成员,支持负索引。这个方法不仅可用于数组,也可用于字符串和类型数组(TypedArray)。
参数位置超出了数组范围,at()返回 undefined。
let arr = [5, 12, 8, 130, 44];
console.log(arr.at(1)); // 12
console.log(arr.at(-1)); // 44
console.log(arr.at(10)); // undefined
console.log(arr.at(-10)); // undefined
array.reduce(function(previousValue, currentValue, currentIndex, arr), initialValue)
: 对数组里每个元素执行一次回调函数。将数组元素计算为一个值(从左到右)。
- function : 必需。用于执行每个数组元素的函数。
- previousValue : 必需。初始值(initialValue), 或者上一次调用回调(function)返回的值。
- currentValue : 必需。数组中当前被处理的元素
- currentIndex : 可选。当前元素在数组中的索引
- arr : 可选。当前元素所属的数组对象。
- initialValue :可选。传递给函数的初始值
- reduce() 对于空数组是不会执行回调函数的。
- 没有设置函数的初始迭代值
let arr = [1, 2, 3, 4];
let sum = arr.reduce(function(prev, cur, index, arr) {
console.log('prev--', prev, 'cur--', cur, 'index--', index);
return prev + cur;
})
console.log(arr, sum);
// 打印结果:
// prev-- 1 cur-- 2 index-- 1
// prev-- 3 cur-- 3 index-- 2
// prev-- 6 cur-- 4 index-- 3
// (4) [1, 2, 3, 4] 10
这里可以看出,上面的例子没有设置 initialValue 的时候,会把回调函数 index 是从 1 开始的,第一次的 previousValue 的值是数组的第一个值。数组长度是 4,但是 reduce 函数循环 3 次。
- 设置初始迭代值
let arr = [1, 2, 3, 4];
let sum = arr.reduce(function (prev, cur, index, arr) {
console.log('prev--', prev, 'cur--', cur, 'index--', index);
return prev + cur;
},5);
console.log(arr, sum);
// 打印结果:
// prev-- 5 cur-- 1 index-- 0
// prev-- 6 cur-- 2 index-- 1
// prev-- 8 cur-- 3 index-- 2
// prev-- 11 cur-- 4 index-- 3
// (4) [1, 2, 3, 4] 15
这里我们添加了一个初始的迭代值,也就是让 prev 从 5 开始计算,可以看到,这里迭代了 4 次,结果也加上了初始值。
- 计算数组中每个元素出现的次数
let arr = ['name','age','long','short','long','name','name']
let arrResult = arr.reduce((pre,cur) =>{
console.log(pre,cur)
if(cur in pre){
pre[cur]++
}else{
pre[cur] = 1
}
return pre
},{})
console.log(arrResult)//结果:{name: 3, age: 1, long: 2, short: 1}
// 打印结果:
// {} 'name'
// {name: 1} 'age'
// {name: 1, age: 1} 'long'
// {name: 1, age: 1, long: 1} 'short'
// {name: 1, age: 1, long: 1, short: 1} 'long'
// {name: 1, age: 1, long: 2, short: 1} 'name'
// {name: 2, age: 1, long: 2, short: 1} 'name'
// {name: 3, age: 1, long: 2, short: 1}
- 去除数组中重复的元素
let arr = ['name','age','long','short','long','name','name']
let arrResult = arr.reduce((pre,cur) =>{
if(!pre.includes(cur)){
pre.push(cur)
}
return pre;
},[])
console.log(arrResult)//结果:["name", "age", "long", "short"]
- 对对象的属性求和
let person = [
{
name: 'xiaoming',
age: 18
},{
name: 'xiaohong',
age: 17
},{
name: 'xiaogang',
age: 19
}
]
let result = person.reduce((a,b) =>{
a = a + b.age;
return a;
},0)
console.log(result)//结果:54
array.reduceRight(function(total, currentValue, currentIndex, arr), initialValue)
: 对数组里每个元素执行一次回调函数。将数组元素计算为一个值(从右到左),用法同 reduce,顺序不同而已。
- function : 必需。用于执行每个数组元素的函数。
- total : 必需。初始值, 或者计算结束后的返回值。
- currentValue : 必需。当前元素
- currentIndex : 可选。当前元素的索引
- arr : 可选。当前元素所属的数组对象。
- initialValue :可选。传递给函数的初始值
- reduceRight() 对于空数组是不会执行回调函数的。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· AI技术革命,工作效率10个最佳AI工具