当前位置: 首页 > 编程笔记 >

Javascript中数组方法汇总(推荐)

邬阳
2023-03-14
本文向大家介绍Javascript中数组方法汇总(推荐),包括了Javascript中数组方法汇总(推荐)的使用技巧和注意事项,需要的朋友参考一下

Array.prototype中定义了很多操作数组的方法,下面介绍ECMAScript3中的一些方法

1.Array.join()方法

该方法将数组中的元素都转化为字符串并按照指定符号连接到一起,返回最后生成的字符串,可以包含一个参数,为连接数组元素的符号,默认为逗号。

var ay = [1,2,3];
ay.join();       // =>"1,2,3" 
ay.join("+");     // => "1+2+3" 
ay.join(" ");     // =>"1 2 3"
ay.join("");      // =>"123"

var by = new Array(10) //新建一个长度为10的空数组
by.join("-");      //=> "---------" 连接10个空元素

2.Array.reverse()方法

该方法将数组中的元素颠倒顺序,返回逆序的数组,该方法会改变当前数组,不会创建新数组。


var a = [1,2,3];

a.reverse().join();    //=>"3,2,1" ,此时a=[3,2,1]    

3.Array.sort()方法

该方法将数组中的元素排序并返回排序后的数组。当sort()方法不带参数时,数组按照字母表顺序排序,如果数组包含undefined元素,会排到数组尾部。


var as = ["banana","cherry","apple"];

as.sort();

as.join("+ ");          //=>"apple+ banana+ cherry"

我们也可以给sort()方法传入一个比较函数作为参数,让数组以指定的比较函数进行排序。比较函数返回值小于0,则第一个参数在前,相反返回值大于0,则第二个参数在前,两个参数值相等,则返回0


var sy = [1111,222,4,33];

sy.sort();                               //=>"1111,222,33,4"

sy.sort(function(a,b){

            return a-b;

});                                        //=> "4,33,222,1111"


注:这里使用匿名函数最合适,因为只调用一次,无需指定函数名称

4.Array.concat()方法

该方法创建并返回一个新数组,连接原数组元素和方法中每个元素,组成一个新数组。该方法不会递归调用方法中的参数。


var a = [1,2,3];

a.concat(4,5);             //=>"1,2,3,4,5"

a.concat([4,5]);           //=>"1,2,3,4,5"

a.concat([4,5],[6,7]);  //=>"1,2,3,4,5,6,7"

a.concat(4,[5,[6,7]]);  //=>"1,2,3,4,5,[6,7]"

5.Array.slice()方法

该方法返回指定数组的一个片段或子数组,该方法可以有两个参数,分别制定片段的开始和结束位置,返回的数组包含第一个参数指定的元素和所有到但不包含第二个参数指定的位置的数组元素。如果只有一个参数,则包含从指定开始位置到数组末尾,参数可以为负值,表示相对于数组中最后一个元素的位置。该方法不会修改被调用的数组。


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

d.slice(1,2);              //=>"2"

d.slice(1,-1);             //=>"2,3,4"

d.slice(3);                 //=>"4,5"

d.slice(-3,-1);           //=>"3,4"

6.Array.splice()方法

该方法是在数组中插入或删除元素的通用方法,该方法会修改原始数组。该方法可以包含多个参数,第一个参数指定要在数组中插入或删除的起始位置,第二个参数制定了删除元素的个数,若不指定则将起始位置以及后面元素全部删除,两个参数之后的参数指定了插入数组的元素,该方法返回由删除元素组成的数组。

var e = [1,2,3,4,5,6];
e.splice(4);          //=> 返回[5,6] ; e是[1,2,3,4]
e.splice(1,2);         //=> 返回[2,3] ; e是[1,4]
      
var f = [1,2,3,4,5];
f.splice(2,0,"a","b");   //=>返回[]; f是[1,2,a,b,3,4,5]
f.splice(2,2,[6,7],3);   //=>返回[a,b]; f是[1,2,[6,7],3,4,5]

7.push()和pop()方法

这两个方法将数组当做栈使用,push()方法是在数组尾部添加一个或多个元素,并返回数组的长度。pop()方法是删除数组的最后一个元素,减少数组长度并返回删除的值。

8.unshift()方法和shift()方法

这两个方法是在数组头部进行添加删除操作,unshift()方法是在数组头部添加一个或多个元素,返回数组长度。shift()方法是删除数组第一个元素并返回。

var a=[];     //[]
a.push(1,2);  //[1,2]
a.pop();      //[1]

a.unshift(2,3); //[2,3,1]
a.shift();      //[3,1]

9.toString()和toLocaleString()方法

这两个方法是将数组每个元素转化为字符串,toString()是将每个元素转化为字符串并且输出用逗号隔开。toLocaleString()方法是数组每个元素调用toLocaleString()转化为字符串,并使用本地化分隔符连接。

下面在介绍几个ECMAScript5中特有的数组方法,在介绍方法之前首先做一个大致了解。大多数方法的第一个参数接受一个函数,并且对数组每个元素调用一次这个函数,如果说稀疏数组,不存在的元素不调用函数。大多数情况下,调用的函数使用三个参数:数组元素,元素的索引以及数组本身。

1.forEach()方法

该方法从头到尾遍历数组,数组每个元素都调用指定的函数。该方法在遍历完所有数组元素之前不会终止。若想提前终止,必须将forEach()放到try块中,并可以抛出异常。

var data=[1,2,3,4,5]
var sum = 0;
data.forEach(function(value){   //=>value为数组元素
  sum+=value;
})                        //=>15

data.forEach(function(value,i,a){ //=>三个参数分别指代数组元素,元素索引和数组
  a[i] = v+1;
})                        //=>data=[2,3,4,5,6]

2.map()方法

该方法将数组的每个元素传递给指定的函数,并返回一个新数组,该数组包含了数组元素调用函数对应的返回值。如果是稀疏数组,返回的新数组也是同样结构的系数数组。

var a=[1,2,3];
var b=a.map(function(v){
  return v*v;
})  //=> b=[1,4,9]

3.filter()方法--类似于条件筛选

该方法返回的是原始数组的一个子集,传递的函数用来做逻辑判定,返回true或false,如果返回的值为true或可以转化为true,则当前数组元素就是子集的成员,添加到返回的数组中。该方法会跳过稀疏数组的空元素。

var a=[5,4,3,2,1]
var smalla=a.filter(function(v){
  return v<3; 
})                         //=>返回[2,1]
var everya=a.filter(function(v,i){ //=>i表示元素索引
  return i%2==0; 
})                         //=>返回[5,3,1]


4.every()和some()方法

这两个方法是对数组进行逻辑判定,对数组每个元素运用指定函数进行判定返回true或false。
every()方法是当且仅当数组中所有元素调用判定函数都返回true,才返回true,否则返回false。
some()方法是当数组中至少有一个元素调用判定函数返回true,就返回true,否则返回false。

这两个方法都是一旦确认返回值后就不在遍历数组元素了。

5.reduce()和reduceRight()方法

这两个方法使用指定的函数将数组元素进行组合,生成单个值。
reduce()需要两个参数,第一个是执行化简组合的操作函数,第二个是组合的初始值。和前面几个方法不同的是,常见的三个参数(数组元素、元素索引和数组本身)会作为操作函数的2~4个参数传递给函数,第一个参数是到目前为止进行计算组合的结果。
如果是针对空数组,并不指定初始值时调用reduce()方法会导致类型错误异常
reduceRight()方法和reduce()方法的工作原理相同,不同的是其按数组索引从高到低进行处理(即从右到左进行合并处理)

6.indexOf()和lastIndexOf()方法

这两个方法都是用于在整个数组中搜索具体给定的值,并返回第一个匹配元素的索引值,若没有则返回-1.indexOf()方法是从头到尾进行搜索,而lastIndexOf()是从尾到头进行搜索。

 类似资料:
  • 本文向大家介绍javascript中数组方法汇总,包括了javascript中数组方法汇总的使用技巧和注意事项,需要的朋友参考一下 js数组元素的添加和删除一直比较迷惑,今天终于找到详细说明的资料了,先给个我测试的代码^-^ shift:删除原数组第一项,并返回删除元素的值;如果数组为空则返回undefined unshift:将参数添加到原数组开头,并返回数组的长度 注:在IE6.0下测试返回值

  • 本文向大家介绍JavaScript中使用数组方法汇总,包括了JavaScript中使用数组方法汇总的使用技巧和注意事项,需要的朋友参考一下 定义数组 或 使用: 数组中也可以放入单个值 如: 循环数组取值 输出:1 1 2 2 js中数组的用法 1、数组的创建 要说明的是,虽然第二种方法创建数组指定了长度,但实际上所有情况下数组都是变长的,也就是说即使指定了长度为5,仍然可以将元素存储在规定长度以

  • 本文向大家介绍javascript数组去重方法汇总,包括了javascript数组去重方法汇总的使用技巧和注意事项,需要的朋友参考一下 javascript数组去重方法汇总 其中第1种和第3种方法都用到了数组的indexOf方法。此方法的目的是寻找存入参数在数组中第一次出现的位置。很显然,js引擎在实现这个方法的时候会遍历数组直到找到目标为止。所以此函数会浪费掉很多时间。 而第2中方法用的是has

  • 本文向大家介绍javascript数组去重的方法汇总,包括了javascript数组去重的方法汇总的使用技巧和注意事项,需要的朋友参考一下 四种算法来实现这个目的: 第一种: 第二种: 第二种改进版:    第三种:     其中第1种和第3种方法都用到了数组的indexOf方法。此方法的目的是寻找存入参数在数组中第一次出现的位置。很显然,js引擎在实现这个方法的时候会遍历数组直到找到目标为止。所

  • 本文向大家介绍javascript数组去重方法总结(推荐),包括了javascript数组去重方法总结(推荐)的使用技巧和注意事项,需要的朋友参考一下  第一种--对象键值去重 第二种--splice删除去重 第三种--利用数组indexOf方法 第四种--数组下标 第五种 第六种 第七种--es6 set 第八种--filter 以上所述是小编给大家介绍的javascript数组去重方法详解整合

  • 本文向大家介绍超详细的javascript数组方法汇总,包括了超详细的javascript数组方法汇总的使用技巧和注意事项,需要的朋友参考一下 一、数组的常用方法 1:join(); 将数组转为字符串显示。不输入参数,默认以逗号连接;输入参数,则以参数连接。 原数组不变。 2:reverse(); 将数组逆序排列,原数组被修改。 3:sort(); 默认按升序排列数组项,调用每个数组项的toStr