本文共 4917 字，大约阅读时间需要 16 分钟。

1.length属性

要知道，数组的length属性并不是只读的，它是可读写的。手动设置length可实现数组的添加，删除项。

var arr = [1, 2, 3];    arr.length = 4;    console.log(arr[3]); //undefined

添加的项默认值为undefined,如果想在数组最后添加项，可用如下方法：

arr[arr.length] = 4;

如果减去：

var arr = [1, 2, 3];    arr.length--;    console.log(arr[3]);//undefined

被减去的项如果再访问自然就是返回undefined。

上面的栗子，原数组的长度为3，那么如果将length设置为100，会如何呢？

var arr = [1, 2, 3];    arr[99] = 100;    console.log(arr);//[1, 2, 3, empty × 96]    console.log(arr[98]);//undefined    console.log(arr[99])//100

索引号4-98并没有定义，所以自然是undefined。

2.Array.isArray()

检测一个值是否是数组Array。

var arr = [1, 2, 3];    var obj = {
           name: 'zed'    }    console.log(Array.isArray(arr));//true    console.log(Array.isArray(1));//false    console.log(Array.isArray([1]));//true    console.log(Array.isArray(obj));//false    console.log(Array.isArray(true));//false

3.join()

将数组转化为字符串格式并返回。可以接收一个参数作为数组中每一项的分隔符，传入undefined或者不传值，则默认以,隔开。

var arr = [1, 2, 3, 4, 5];    console.log(arr.join(undefined));//1,2,3,4,5

在join()方法中，数组项若是null或者undefined时，返回的是空字符串

var obj = {
           name: 'zed'    }    var arr = [1, 'a', null, undefined, obj, obj.name, false];    console.log(arr.join('|'));//1|a|||[object Object]|zed|false

有趣的是，IE7及更早版本会将传入的undefined错误地使用为分隔符（：D）

4.concat()

用来数组拼接，该方法会返回一个新的数组，即使没有参数也会返回一个原数组的副本。

如果参数是数组，那么会拼接到原数组的后面并返回；如果参数是几个数值，那么会将这几个数简单的拼接到原数组后面并返回。

var arr = [1, 2, 3, 4, 5]    var arr1 = ['a', 'b']    console.log(arr.concat(arr1));//[1,2,3,4,5,"a","b"]    console.log(arr.concat(6,'7',8));//[1,2,3,4,5,6,"7",8]

5. slice()

该方法会截取数组中的某一部分并作为新数组返回。可接收1-2个参数，不填写参数则返回原数组的副本。

第一个参数为开始截取的索引号（包括此索引号）；第二个参数为结束截取的索引号（不包括此索引号），不填写则默认截取至数组结尾。

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

6.splice()

这差不多是最强大的数组方法了，利用该方法可实现删除，插入，替换等功能。

值得注意的是，该方法和前面几种方法不太相同，该方法会直接影响原数组，返回值为删除的项组成的数组，即使不删除也会返回一个空数组。

• 删除
  • 需要传入两个参数，要删除的第一项的索引号，以及删除的项数。
  • 仅传入一个参数的话，则会从该索引号一直删除到数组结尾。
  • 返回值为删除项组成的数组。

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

• 插入
  • 需提供3个参数，插入的起始位置，删除项数（0），插入的项。
  • 如果起始位置超出数组长度，则会在数组最后一项后插入。
  • 如果插入项，仅需再写第四个，第五个…参数即可。
  • 返回值为空数组。

var arr = [1, 2, 3, 4, 5, 6];    var arr1 = [1, 2, 3, 4, 5, 6];    console.log(arr.splice(1, 0, 'a'));//[]    console.log(arr);//[1,"a",2,3,4,5,6]    console.log(arr1.splice(10, 0, 'a', 'b', 'c'));//[]    console.log(arr1);//[1, 2, 3, 4, 5, 6, "a", "b", "c"]

• 替换
  • 原理为在指定位置删除任意数目的项，再添加任意数目的项，二者数目不必相等。
  • 返回值为删除的项组成的数组。

var arr = [1, 2, 3, 4, 5, 6];    var arr1 = [1, 2, 3, 4, 5, 6];    console.log(arr.splice(1, 1, 'a'));//[2]    console.log(arr);//[1, "a", 3, 4, 5, 6]    console.log(arr1.splice(2, 3, 'a', 'b', 'c','d'));//[3,4,5]    console.log(arr1);//[1, 2, "a", "b", "c", "d", 6]

7.indexOf() & lastIndexOf()

两个方法均为按值查找项，如果数组中有指定的值，则返回其索引号；没有则返回-1。前者从数组开头向后查，后者从数组结尾向前查找。

两个方法都接收2个参数，查找的值 和 开始查找的索引号（可选）。

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];    console.log(arr.indexOf(3));//2    console.log(arr.indexOf(7, 4));//6    console.log(arr.indexOf(11));//-1    console.log(arr.indexOf(1));//0    console.log(arr.lastIndexOf(3));//2    console.log(arr.lastIndexOf(7, 5));//-1    console.log(arr.lastIndexOf(11));//-1    console.log(arr.lastIndexOf(1));//0

indexOf()方法可以判断一个字符串中是否含有特定字符串，返回-1则没有，返回0则是以它为开头，返回其他值则是含有但不是开头。可以利用该方法轻易的实现验证（代码略）。

8.push() & pop()

栈方法，前者为在数组的结尾添加一项，接收任意数量的参数，并会逐个添加，返回值为新数组的长度；

后者为删除数组的最后一项，返回值为删除的项。

var arr = [1, 2, 3, 4, 5];    console.log(arr.push('a', 'b', 'c'));//8    console.log(arr);//[1, 2, 3, 4, 5, "a", "b", "c"]    console.log(arr.pop());//c    console.log(arr);//[1, 2, 3, 4, 5, "a", "b"]

9.shift() & unshift()

队列方法，前者为删除数组的第一项元素，返回值为删除项；

后者在数组的最前面添加项，接收任意数量的参数，并会逐个添加到数组的最前面，返回值为新数组的长度。

var arr = [1, 2, 3, 4, 5];    console.log(arr.shift());//1    console.log(arr);//[2, 3, 4, 5]    console.log(arr.unshift('a', 'b', 'c'));//7    console.log(arr);//["a", "b", "c", 2, 3, 4, 5]

10. reverse()

反转数组，返回一个倒序数组，原数组也会改变。

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

11.sort()

排序函数，即使每一项都是数值，该方法也是比较字符串。那么很多情况下无法正常排序，所以要接收一个比较函数作为参数。

比较函数接收两个参数，若想让第一个参数位于第二个参数之前，则返回一个负数；若第二个参数应位于第一个参数之前，则返回一个正数；两个参数相等则返回0。

var arr = [1111, 221, 37, 4, 56, 59];    console.log(arr.sort(compare));//[4, 37, 56, 59, 221, 1111]    function compare(value1, value2) {
           if (value1 > value2) {
               return 1;        } else if (value1 < value2) {
               return -1;        } else {
               return 0;        }    }

这个比较函数适合大多数数据类型。如果想产生降序的效果，只需要修改为

if (value1 > value2) {
               return -1;        } else if (value1 < value2) {
               return 1;        }else {
               return 0;        }

即可。

如果确定数组中的值均为数值时，比较函数可以更简单地写成：

function compare(value1, value2) {
           return value2 - value1;    }

总结

以上就是js中常见的数组方法，有所收获的话就点个赞吧~

转载地址：http://ihozi.baihongyu.com/