JavaScript数组常用方法

标签：返回 常用 console log JavaScript arr 数组 var

数组的常用方法有push()，unshift()，pop()，shift()，reverse()，sort()，splice()，concat()，join()，slice()，.....

在工作中常用到的有增删改查，前增unshift，后增push()，前删shift()，后删pop()，修改指定元素splice()，查找indexOf()，lastindexof()，和ES6新增的数组方法forEach() 、map()、filter()、reduce()、some()、every()，ES6新增的数组方法都不会改变 原数组

序列	方法名	功能	返回值	是否改变原数组
1	unshift()	在数组前面新增一个或多个元素	返回增加元素后的新数组	是
2	push()	在数组后面新增一个或 多个元素	返回增加元素后的新数组	是
3	shift()	删除数组中第一个元素	返回被删除的数据	是
4	pop()	删除数组最后一个元素	返回被删除的数据	是
5	splice()	在指定位置删除指定个数元素再增加任意个数元素 （实现数组任意位置的增删改)	返回修改后的数组	是
6	indexOf()	查询某个元素第一次出现的位置(从前)	存在返回下标，不存在返回-1	否
7	lastIndexOf()	反向查询某个元素第一次出现的位置	存在返回下标，不存在 返回-1	否
8	sort()	以字母顺序(字符串Unicode码点)对数组进行排序	返回重新排序后的新数组	是
9	reverse()	反转数组中的元素	返回反转后的数组	是
10	concat()	合并数组	返回合并后的数组	否
11	join()	通过自定义字符合并连接数组	返回合并后 的数组	否
12	slice()	切割数组	返回被切割的元素组成的新数组	否
13	toString()	把数组 转化为字符串	返回字符串	否

ES6新增数组方法

序号	方法名	功能	返回值
1	foreach()	(迭代) 遍历数组,每次循环中执行传入的回调函数	没有返回值
2	map()	(迭代) 遍历数组, 每次循环时执行传入的回调函数,根据回调函数的返回值,生成一个新的数组	返回一个新数组
3	fliter()	遍历数组, 每次循环时执行传入的回调函数,回调函数返回一个条件,把满足条件的元素筛选出来放到新数组中	返回新数组
4	some()	判断数组中是否存在,满足某个条件的元素	只要有一个元素满足条件就返回true,都不满足返回false
5	every()	全都满足返回true 只要有一个不满足 返回false	全都满足返回true 只要有一个不满足 返回false
6	reduce()	(归并)遍历数组, 每次循环时执行传入的回调函数,回调函数会返回一个值,将该值作为初始值prev,传入到下一次函数中	让数组的前后两项进行某种计算，返回最终操作的结果

以上6个方法均为ES6语法，IE9及以上才支持。不过可以通过babel转意支持IE低版本。 
以上均不改变原数组。 
some、every返回true、false。 
map、filter返回一个新数组。 
reduce让数组的前后两项进行某种计算，返回最终操作的结果。 
forEach 无返回值。

unshift()

在数组第一位添加一个或多个元素，并返回新数组的长度，改变原数组。(添加多个元素用逗号隔开)

 var arr = [1, 2, "3"];
    var lis = arr.unshift("6", "6");
    console.log(arr); // [ "6", "6",1, 2, "3"]
    console.log(lis); //  5  (数组长度)

push()

在数组最后一位添加一个或多个元素，并返回新数组的长度，改变原数组。(添加多个元素用逗号隔开)

 var arr = [1, 2, "3"];
    var lis = arr.push("4");
    console.log(arr); // [  1,2,3,4]
    console.log(lis); // 4 (数组长度)

shift()

删除数组的第一位，并且返回删除的数据，会改变原来的数组。(该方法不接受参数,且每次只能删除最后一个)

 var arr = [1, 2, "3"];
    var lis = arr.shift();
    console.log(arr); // [  2,3]
    console.log(lis); // 2 (数组长度)

pop()

删除数组的最后一位，并且返回删除的数据，会改变原来的数组。(该方法不接受参数,且每次只能删除最后一个)

 var arr = [1, 2, "3"];
    var lis = arr.pop();
    console.log(arr); // [  1，2]
    console.log(lis); // 2 (数组长度)

reverse()

将数组的数据进行反转，并且返回反转后的数组，会改变原数组

var arr = [1,2,3,4,5]
var lis = arr.reverse
console.log(arr) //[1,2,3,4,5]
console.log(lis) //[5,4,3,2,1]

sort()

对数组的元素进行排序,并返回数组。默认排序顺序是根据字符串Unicode码点。

语法： arr.sort(function(a,b)) 
参数： function可选。用来指定按某种顺序进行排列的函数。如果省略，元素按照转换为的字符串的诸个字符的Unicode位点进行排序。
具体用法：

如果 function(a, b) {return: a - b;} ，=> a - b > 0 那么 a 会被排列到 b 之前; (从小到大排序)
如果 function(a, b) {return: b - a;} ，=> b - a > 0 那么b会被排列到 a 之前； (从大到小排序)

    var arr = [ 1, 5, 2, 3];
    arr.sort(function (a, b) {
      return a - b;
    });
    console.log(arr);//[1,2,3,5]

splice()

向数组中添加，或从数组删除，或替换数组中的元素，然后返回被删除/替换的元素所组成的数组。可以实现数组的增删改

语法： arrayObject.splice(index,howmany,item1,…,itemX)

参数：

index：必需。整数，规定添加/删除项目的位置（元素下标），使用负数可从数组结尾处规定位置

howmany：必需。要删除的项目数量。如果设置为 0，则不会删除项目。

item1, …, itemX：可选。向数组添加的新项目。

var arr = [1,2,3]
arr.splice(1,1,6,6)
console.log(arr) // [1,6,6,3]

concat()

功能： 数组的拼接(将多个数组或元素拼接形成一个新的数组),不改变原数组
如果拼接的是数组 则将数组展开,之后将数组中的每一个元素放到新数组中.
如果是其他类型, 直接放到新数组中
如果不给该方法任何参数，将返回一个和原数组一样的数组（复制数组）

var arr = [1,2,3]
var arr1 = arr.concat(6,6)
console.log(arr) // [1,2,3]
console.log(arr1) // [1,2,3,6,6]

join()

用特定的字符,将数组拼接形成字符串 (默认",")

var arr = [1,2,3]
var arr1 = arr.join("*")
console.log(arr1) // "1*2*3"

slice()

裁切指定位置的数组，返回值为被裁切的元素形成的新数组 ，不改变原数组

语法： arr[].slice(star,end)
参数

star:起始下标 默认值 0

end:终止下标 默认值 length,可以接收负数,(倒着数)

注意！起始下标和终止下标的区间是 左闭右开 [ a ，b) 能取到起始，取不到终止

  var arr = [1, 2, 3, 4];
    var lis= list.slice(1, 3);
    console.log(result);  // [2,3]

toString()

直接将数组转换为字符串,并且返回转换后的新数组,不改变原数组

var arr = [1,2,3]
var lis = arr.toString()
consloe.log(lis) // "123"
consloe.log(arr) // [1,2,3]

indexOf()

查找某个元素在数组中第一次出现的位置 存在该元素,返回下标,不存在 返回 -1 (可以通过返回值 变相的判断是否存在该元素)

var arr = [1,2,3]
var lis = arr.indexOf(1)
var dem = arr.indexOf(a)
console.log(lis) // 0
console.log(dem) // -1

lastIndexOf()

查找某个元素在数组中最后一次出现的位置 (或者理解为反向查询第一次出现的位置) 存在该元素,返回下标,不存在 返回 -1

var arr = [1,2,3]
var lis = arr.indexOf(1)
var dem = arr.indexOf(a)
console.log(lis) // 0
console.log(dem) // -1

forEach()

遍历数组,每次循环中执行传入的回调函数 。(注意: forEach() 对于空数组是不会执行回调函数的。) 没有返回值,或理解为返回值为undefined,不改变原数组

语法：arr[].forEach(function(item,index,array){})

参数

item：当前循环的元素

index：当前元素的下标

array：原数组

var arr = [1,2,3,4]
var lis = arr.forEach(function(item,index,array){
console.log(item,index,array)
})

打印结果

map()

遍历数组, 每次循环时执行传入的回调函数,根据回调函数的返回值,生成一个新的数组 ,
同forEach() 方法,但是map()方法有返回值,可以return出来

语法:

arr[].map(function(item,index,array){
　　return XXX
})

参数： 

item:每次循环的当前元素,

index:当前项的索引,

array:原始数组；

var list = [1, 2, 3, 4, 5];
    var res = list.map(function (item, index, array) {
      return item + 1 ;
    });
    console.log("原数组", list);
    console.log("新数组", res);

打印结果

filter()

遍历数组, 每次循环时执行传入的回调函数,回调函数返回一个条件,把满足条件的元素筛选出来放到新数组中

语法: 

arr[].filter(function(item,index,array){
　　//do something
　　return XXX //条件
})

参数： item:每次循环的当前元素, index:当前项的索引, array:原始数组

   var arr = [1, 2, 3, 4, 5];
    var lis = lis.filter(function (item, index, array) {
      return item >= 3; // true || false
    });
    console.log(lis);// [3,4,5]

every()

遍历数组, 每次循环时执行传入的回调函数,回调函数返回一个条件,全都满足返回true 只要有一个不满足 返回false => 判断数组中所有的元素是否满足某个条件

var arr = [1, 2, 3, 4, 5];
    var lis = lis.filter(function (item, index, array) {
      return item >= 3; // true || false
    });
    console.log(lis);// false

some()

遍历数组, 每次循环时执行传入的回调函数,回调函数返回一个条件,只要有一个元素满足条件就返回true,都不满足返回false

var arr = [1, 2, 3, 4, 5];
    var lis = lis.filter(function (item, index, array) {
      return item >= 3; // true || false
    });
    console.log(lis);// true

reduce()

遍历数组, 每次循环时执行传入的回调函数,回调函数会返回一个值,将该值作为初始值prev,传入到下一次函数中, 返回最终操作的结果;

语法: arr.reduce( function(prev,item,index,array){} , initVal)

educe()方法里边，有两部分，第一是个回调函数，第二个参数是设置的初始值。
回调函数中可以有四个参数，
prev 回调初始值 (类似求和是 sum=0) 可以设置初始值( 参数),如果不设置初始值默认是数组中的第一个元素,遍历时从第二个元素开始遍历
item 每次循环的当前元素
index 每次循环的当前下标
array 原数组,

initVal初始值

    var arr = [2, 3, 4, 5];
    var sum = arr.reduce(function (prev, item, index, array) {
      console.log(prev, item, index, array);
      return prev + item;
    });
    console.log(arr, sum);

参考文章：文章链接

标签：返回,常用,console,log,JavaScript,arr,数组,var
From： https://blog.csdn.net/weixin_74100422/article/details/137032772