javascript-数组的常用方法

时间:2022-06-05 03:45:55

除了第二点的方法以外,所有方法都不会改变数组本身

查了一下ECMAScript给数组这个对象已经原生地封装了许多很有用的方法,所以接下来我想在这里总结一下一些常用的数组内置方法:

1、join

var colors = ["red","blue","green"];

colors.join("$$");   

colors.toString();  //"red$$blue$$green"

join()用于改变数组的分割。

2、修改数组内部数据的方法

//*
//*插入方法
//* //push方法
var colors = ["red"];
colors.push("blue","green"); //
colors.toString(); //"red,blue,green" //unshift方法
var colors = ["red"];
colors.unshift("blue","green"); //
colors.toString(); //"blue,green,red" //*
//*删除(退出)数组项方法
//* //pop方法
var colors = ["red","blue","green"];
colors.pop(); //"green" //shift方法
var colors = ["red","blue","green"];
colors.shift(); //"red" //*
//*功能最强的方法——splice(索引位置,要删除的个数,要插入的若干项数据)
//* //作为删除用途
var colors = ["red","blue","green"];
colors.splice(1,1); //["blue"]
colors.toString() //"red,green" //作为替换用途
var colors = ["red","blue","green"];
colors.splice(1,2,"white","black"); //["blue", "green"]
colors.toString(); //"red,white,black" //作为插入用途
var colors = ["red","blue","green"];
colors.splice(1,0,"white","black"); //[]
colors.toString(); //"red,white,black,blue,green" //排序,也会改变本数组

values = [2, 4, 6, 8, 10];
  values.sort((a,b)=>{return b-a})

push()方法是从数组最后插入数组项,而unshift()则是从数组的最前插入数组项,注意插入的数组项在该数组的顺序保持与参数时候一致。

pop()方法是从数组最后“弹出”数组项,而unshift()则是从数组的最前“弹出”数组项。

而splice方法可以实现插入、删除、替换这3种功能:splice(索引位置,要删除的个数,要插入的若干项数据)

3、迭代方法

var numbers = [1,2,3,4,5,4,3,2,1];

//*
//*判断数组每一项
//* //every只有每一项都返回true,整个才会返回true
numbers.every(function(item,index,array){return item>2}) //false //some只要有一项返回true,整个就会返回true
numbers.some(function(item,index,array){return item>2}) //true //*
//*filter过滤器,返回一个由符合的项组成的数组
//*
numbers.filter(function(item,index,array){return item>2}) //[3, 4, 5, 4, 3] //*
//*逐项执行的迭代
//* //map有返回结果,我们叫它映射
numbers.map(function(item,index,array){return item*2}) //[2, 4, 6, 8, 10, 8, 6, 4, 2] //forEach没有返回结果
numbers.forEach(function(item,index,array){array[index] = item*2}) ;
alert(numbers); //[2, 4, 6, 8, 10, 8, 6, 4, 2]

大家可以根据不同的需求来调用js提供的原生的迭代方法!!

4、归并方法

reduce(callback[,initalValue]) 第二个参数是自定义初始值(就是第一次循环的pre)

最后是归并方法reduce()和reduceRight(),两者都会迭代数组所有项,其中reduce()从第一项开始,而reduceRight()从数组最后一项开始,出此之外两个函数完全相同

//reduce()中pre第一次为数组第一项,第二次开始为第一次函数返回值为pre
var values = [1,2,3,4,5];
var sum=values.reduce(function(pre,cur,index,array){return pre + cur});
alert(sum); // //reduceRight()中pre第一次为数组最后一项,第二次开始为第一次函数返回值为pre
var values = [1,2,3,4,5];
var sum=values.reduceRight(function(pre,cur,index,array){return pre + cur});
alert(sum); //

其实forEach()也完全可以实现,并且比以上两个归并方法更好理解,怎样实现这功能也看个人习惯。

ps:reduce除了用作求和,还可以用作递归寻找

例如说,有一个非常复杂的对象如果我们有一个path数组,存着一个路径,我们就可以用reduce来找到这个路径的“终点节点”:

path.reduce((obj,pathString=>obj[pathString],庞大的对象)

5、slice

slice是指定在一个数组中的元素创建一个新的数组,即原数组不会变

数组的 slice (非常类似于字符串的 slice。根据规范,slice 需要两个参数,起点和终点。它会返回一个包含了从起点开始,到终点之前之间所有元素的新数组。

理解 slice 的功能并不是太难:

'abc'.slice(1,2)   // "b"
[14, 3, 77].slice(1, 2) // [3]

6、concat

concat() 方法用于连接两个或多个数组。

该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。

  var mya = new Array(3);
mya[0] = "1";
mya[1] = "2";
mya[2] = "3";
document.write(mya.concat(4,5)+"");//1,2,3,4,5
document.write(mya); //1,2,3

 7.from(es6新增的)

从一个类似数组或可迭代对象中创建一个新的数组实例。

Array.from('foo');  // ["f", "o", "o"]

Array.from(["a", "b", "c"]);  // ["a", "b", "c"]

//特殊的可以从{length:num}返回一个长度为num的数组
Array.from({length:5}); //[undefined,undefined,undefined,undefined,undefined] //第二个参数是map函数
Array.from({length:5},(v, i) => i); // [0,1,2,3,4]

 8.delete

用于删除对象的某个属性,因此可以删除数组的某一项,或者对象的某一个属性。成功返回true,失败返回false

var a = [1,2,3];
delete a[1]; //true
a; //(3) [1, empty × 1, 3] var b = {name:'rick',age:21};
delete b.age; //true
b; //{name: "rick"}