javascript数组里的27个方法总合详解
作者:为什么不运行
1.concat()
concat() 方法用于连接两个或多个数组。方法不会更改现有数组,而是返回一个新数组,其中包含已连接数组的值。
var str1 = [1,2,3,4,5,6] var str2 = ['a','b','c','d','e'] console.log(str1.concat(str2));// [1, 2, 3, 4, 5, 6, 'a', 'b', 'c', 'd', 'e']
2.copyWithin()
copyWithin() 复制数组的一部分数据覆盖到数组的另一个位置。会修改数组,但是不会修改数组的长度。
var str1 = [1,2,3,4,5,6] // 从索引为0开始复制,到索引1结束(不包括结束位置),替换到索引为2的位置, console.log(str1.copyWithin(2,0,1)); //[1, 2, 1, 4, 5, 6] // 因为省略一个参数,所以从索引为3位置后的所有元素,从索引为1开始复制替换 console.log(str1.copyWithin(1,3)); //[1, 4, 5, 6, 5, 6]
3.Object.entries()
返回一个数组,其元素是与直接在object上找到的可枚举属性键值对相对应的数组
var str3 = { 100: 'a', 2: 'b', 7: 'c' }; console.log(Object.entries(str3)); //['2', 'b']['7', 'c']['100', 'a']
4.every()
every()方法用来判断数组的所有元素是否都满足指定的条件。
var str1 = [1,2,3,4,5,6] // 创造一个函数来作为判断条件 function checkAdult(value,index) { return value > 0; } // every() 方法用来判断数组的所有元素是否都满足指定的条件。 console.log(str1.every(checkAdult)); //true
5.fill()
fill()方法用来把数组所有元素替换成静态元素
var str1 = [1,2,3,4,5,6] console.log(str1.fill(1)); //[1, 1, 1, 1, 1, 1]
6.filter()
它用于把Array的某些元素过滤掉,然后返回剩下的元素。
var str1 = [1,2,3,4,5,6] console.log(str1.filter(function(x){return x > 2})); //[3, 4, 5, 6]
7.find()和findIndex()
find()返回数组中第一个通过测试的元素的值。
findIndex()返回数组中通过测试的第一个元素的索引。
var str1 = [1,2,3,4,5,6] console.log(str1.find(function(x){return x > 2})); //3 console.log(str1.findIndex(function(x){return x > 2})); //2
8.forEach()
forEach()为每个数组元素都调用函数。
var str1 = [1,2,3,4,5,6] str1.forEach(x => console.log(x)); //依次输出123456
9.from()
以对象创建数组。
console.log(Array.from('string')); //['s', 't', 'r', 'i', 'n', 'g']
10.includes()
includes()检查数组是否包含指定的元素。第二个参数可以指定从哪个位置开始检测
var str1 = [1,2,3,4,5,6] console.log(str1.includes(2,0)); //true
11.indexOf()和lastIndexOf()
indexOf()在数组中搜索元素并返回其索引。第二个参数可以指定从哪个位置开始搜索
lastIndexOf()在数组的末尾开始搜索元素并返回其索引。第二个参数可以指定从哪个位置开始搜索
var str1 = [1,2,3,4,5,6] console.log(str1.indexOf(2,0)); //1 console.log(str1.lastIndexOf(2,5)); //1
12.isArray()
可以用来判断是否为数组对象
var str1 = [1,2,3,4,5,6] console.log(Array.isArray(str1)); //true
13.join()
将数组的所有元素连接成一个字符串。元素将由指定的分隔符分隔。默认分隔符是逗号 (,)。
var str2 = ['a','b','c','d','e'] const a = str2.join() console.log(a); //a,b,c,d,e const a = str2.join('') console.log(a); //abcde
14.keys()
返回一个数组,数组里的属性是数组所对应的键
var str3 = { 100: 'a', 2: 'b', 7: 'c' }; console.log(Object.keys(str3)); //['2', '7', '100'] //字符串则返回索引 console.log(Object.keys("string")); //['0', '1', '2', '3', '4', '5']
15.map()
为每个数组元素调用函数的结果来创建新数组。
var str1 = [1,2,3,4,5,6] const a = str1.map(item => item * 10) console.log(a); // [10, 20, 30, 40, 50, 60]
16.pop()
删除数组的最后一个元素,并返回该元素。方法会改变数组的长度。
var str1 = [1,2,3,4,5,6] console.log(str1.pop(), str1); // 6 , [1, 2, 3, 4, 5]
17.push()
将新元素添加到数组的末尾,并返回新的长度。方法会改变数组的长度。
var str1 = [1,2,3,4,5,6] console.log(str1.push(7), str1); // 7 , [1, 2, 3, 4, 5, 6, 7]
18.reduce()和reduceRight()
reduce()执行顺序是从左到右 reduceRight()执行顺序是从右到左
为数组中的每一个元素依次执行回调函数,一般用于累加器。
有四个参数,第一个为初始值, 或者计算结束后的返回值。第二个为当前元素。第三个为当前元素的索引。第四个为当前元素所属的数组对象。
initiavalue:当数组为空时,可以设置传递给函数的初始值,放在对象的后面
var str1 = [1,2,3,4,5,6] // 累加器的使用 console.log(str1.reduce(function(total,num,index,add){return total+num}));// 21 //initiavalue的使用 var arr=[] console.log(arr.reduce(function(total){return total},0)); //0
19.reverse()
反转数组中元素的顺序。
var str1 = [1,2,3,4,5,6] console.log(str1.reverse()); // [6, 5, 4, 3, 2, 1]
20.shift()
删除数组的第一个元素,并返回该元素。
var str1 = [1,2,3,4,5,6] console.log(str1.shift(),str1); // 1 , [2, 3, 4, 5, 6]
21.slice()
选择数组的一部分,并返回新数组。
var str1 = [1,2,3,4,5,6] // 两个参数 从索引为1开始到索引为3结束,不包括结束位置,形成新数组 console.log(str1.slice(1,3)); // [2, 3] // 一个参数 表示从索引为1开始的所有元素形成一个新数组 console.log(str1.slice(1)); // [2, 3, 4, 5, 6]
22.some()
检查数组中的任何元素是否通过测试。和every()差不多
some如果遇到 true 就不在执行了。 如果都为 false 返回false。 不会改变原数组
var str1 = [1,2,3,4,5,6] function some(item,index,array){ return item>5 } console.log(str1.some(some)); //true function some(item,index,array){ return item>7 } console.log(str1.some(some)); //false
23.sort()
srot()如果不带参数,是将按字母顺序对数组中的元素进行排序,也就是是按照字符编码的顺序进行排序。
如果为number类型其实也不是按正常的从小到大排序,更像是根据元素的第一位数字的大小排序。
如果想正常进行从大到小 从小到大的排序。可以进行比较值的大小来实现。
从小到大,a-b的含义:a-b大于0,说明a大,则把a放在在后面。a-b小于0,说明b大,则b在后面。如果a-b等于0,则不变。 从大到小就是上面的相反,就不说了(不想写了,程序员的美德就是偷懒)
至于为什么是a - b,b - a可以去看这篇文章https://www.jb51.net/article/238275.htm
var arr1 = ['a', 'd', 'c', 'b']; arr.sort(); //['a', 'b', 'c', 'd'] var arr2 = [10, 5, 40, 25, 100, 1]; arr2.sort(); //[1, 10 ,100, 25, 40, 5] //从小到大的排序 var arr2 = [10, 5, 40, 25, 100, 1]; arr2.sort((a,b) => a-b) console.log(arr2); // [1, 5, 10, 25, 40, 100] //从大到小的排序 var arr2 = [10, 5, 40, 25, 100, 1]; arr2.sort((a,b) => b-a) console.log(arr2); // [100, 40, 25, 10, 5, 1]
24.splice()
从数组中添加/删除元素。
var str1 = [1,2,3,4,5,6] // 删除,从索引为1开始,删除2个 console.log(str1.splice(1,2), str1); // [2, 3] , [1, 4, 5, 6] // 添加,从索引为1开始到索引为2开始替换为'0' console.log(str1.splice(1,2,'0','0'), str1); // [2, 3] , [1, '0', '0', 4, 5, 6]
25.toString()
将数组转换为字符串,并返回结果。
var str1 = [1,2,3,4,5,6] console.log(str1.toString(), str1); // 1,2,3,4,5,6 [1, 2, 3, 4, 5, 6]
26.unshift
将新元素添加到数组的开头,并返回新的数组长度值。
var str1 = [1,2,3,4,5,6] console.log(str1.unshift(0), str1); // 7 , [0, 1, 2, 3, 4, 5, 6]
27.valueOf()
valueOf() 方法返回其自身。
var str1 = [1,2,3,4,5,6] str1.push(7) console.log(str1.valueOf(),str1); // [1, 2, 3, 4, 5, 6, 7] , [1, 2, 3, 4, 5, 6, 7]
总结
本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注脚本之家的更多内容!