JavaScript Array常用方法

228 阅读5分钟

ECMAScript中的数组与其他语言最大的不同在于数组的每一项可以保存任何类型的数据,而且数组的大小可以动态调整。对于数组的操作在前端开发中还是很频繁的,js本身提供了很多方法供开发者使用,现在对数组的常用方法进行一些总结。

1.创建数组

  • 使用Array构造函数,在创建时,可以传递数组的长度,也可以传递数组中每一项的值;在使用这种方式创建时,可以省略new关键字;

  • 对象字面量;在使用对象字面量创建数组时,不会调用数组的构造函数;所以instanceof会返回false;

    var colors = new Array()

    var colors = new Array(20) // 传入数组长度

    var colors = new Array('red', 'blue', 'green') // 传入数组元素

2.数组方法

(1)检测数组

  • instanceof:检测某个对象是不是数组;value instanceof Array
  • isArray:检测某个对象是不是数组;Array.isArray(value)

(2)转换方法

  • toString:返回由数组中每个值的字符串形式拼接而成的一个由逗号分隔的字符串;Array.toString()

  • valueOf:与toString返回相同的值,但返回数组;Array.valueOf()

  • toLocaleString: 与toString返回相同的值,类型是字符串;Array.toLocaleString();

  • join:返回拼接的字符串,可以接收一个参数作为分隔符,默认的分隔符是逗号;

    var animals = ['dog','cat','tiger']
    console.log(animals.join(',') // dog,cat,tiger 
    console.log(animals.join('|') // dog|cat|tiger
    
  • tips: 如果数组中的某一项是null、undefined,那么该值在数组调用toString、valueOf、toLocaleString和join方法时,返回空字符串;

(3)栈方法

  • push:接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后的数组的长度;
  • pop:从数组末尾删除最后一项,减少数组的长度,返回移除的项;

(4)队列方法

  • shift:移除数组的第一项并返回该项,同时将数组的长度减1;
  • unshift:在数组的前端添加任意项,并返回新数组的长度;

(5)重排序方法

  • reverse:反转数组项的顺序;返回经过排序过的数组;
  • sort:将数组中的元素进行排序,接收一个排序函数作为参数,指明排序的顺序;调用每个数组项的toString()方法,得到比较的字符串,返回经过排序后的数组;

(6)操作方法

  • concat:创建一个当前数组的副本,然后将接收到的参数添加到这个副本的末尾,最后返回新的数组。原来的数组保持不变;
  • slice:接收两个参数,分别是返回项的开始位置和结束位置,不包括结束位置的项。
  • splice:向数组中插入若干项,返回一个数组,数组中包含从原始数组中删除的项,如果没有删除则返回一个空数组。主要用途包括:
    • 删除:指定两个参数,要删除的起始项以及项数;
    • 插入:需要插入至少三个参数,起始位置,要删除的项数,以及要插入的元素(可以传入多个);
    • 替换:先删除任意项,再插入任意项。需要指定三个参数,起始项数,要删除的项数,以及插入的项;插入的项不必与删除的项数相等;

(7)位置方法

  • indexOf:接收两个参数,要查找的元素和查找位置起点的索引,返回查找元素在数组中的位置索引,没找到返回-1。indexOf表示从头开始查找;
  • lastIndexOf:与indexOf功能相同,从数组的末尾开始查找;
  • tips:在查找元素进行比较时,进行的是全等(===)比较;

(8)迭代方法

接收两个参数,在每一项上运行的函数和运行该函数的作用域对象(可选)。操作不会修改数组本身的值;

  • every:对数组中的每一项运行给定的函数,如果每一项都返回true,则返回true;
  • filter:对数组中的每一项运行给定函数,返回数组中返回为true的项组成的数组;
  • forEach:对数组中的每一项运行给定的函数,没有返回值;与for in循环功能相同;
  • map:对数组中的每一项运行给定的函数,返回运行结果组成的数组;
  • some:对数组中的每一项运行给定的函数,如果任意一项返回true,则返回true;

(9)归并方法

接收两个参数,分别是在每一项上的执行的函数和作为归并基础的初始值;

  • reduce:迭代数组中的所有项,构建一个最终的返回值。从数组中的第一项开始,逐个遍历到最后;
    var list = [1, 2, 3, 4, 5];
    var sum = list.reduce(function(prev, cur, index, array) {
        return prev + cur;
    });
    console.log(sum); // 15
    
  • reduceRight:迭代数组中的所有项,构建一个最终的返回值,从数组的最后一个开始,向前遍历到第一项
  • tips:传递给归并方法的函数接收四个参数,分别是前一个值,当前值,项的索引和数组对象。这个函数返回的任何值都会作为第一个参数自动传给下一项;作为归并的基础值可以不传,不传默认基本值是数组的第一项或最后一项;