这些数组的方法，你都了解嘛

开门见山

我竟然被数组“偷袭”了一手！

事情是这样的，有个朋友和我说他想做个表单，想实现基本的增删改查，该怎么做。

我心想，这不很简单吗？不就是用数组的方法嘛？

于是我就跟他说：“去看数组，数组会给你答案。”

但是他却说：“不，我懒得去看，你给我介绍介绍吧。”

竟然“偷袭”我，要我给他介绍。说实话，我还真说不出来。因此我灰溜溜地跑去重新复习一遍数组知识去了。

数组的特点

既然是重新复习数组知识，那么就从基本的数组概念开始介绍吧。何为数组？数组是按照一定顺序排列的一组值，每个值都拥有自己的编号，从0开始。如果数组对应的索引中没有存储数据，默认存储的就是 undefined，并且当数组的存储空间不够时数组会自动扩容。其中我们熟知的队列就可以数组来表示。

数组的方法

我在数组的方法下都举例说明了一遍，并附上在后台打印的结果，建议可以边看边敲，有时候自己打印一遍效果会更好，这样效果能达到最佳。对于数组的方法，我个人将它分总结 排序翻转分割、增删方法、遍历方法 三个模块。

排序翻转分割

首先来介绍下面一些关于排序翻转已以及分割数组的常见方法，我在项目中经常使用到它们，从而总结出来的。

sort()

这是一个排序方法，该方法可以对数组进行排序，排序分为降序和升序，由它里面的参数决定。使用方法是 arr.sort()。

举例如下：

arr.sort(function(a,b){
	return a-b;//从小到大排序
	return b-a;//从大到小排序
}) 

isArray()

它可以判断变量是否是数组，如果是返回 true，否则返回 false。使用方法是 Array.isArray()。

举例如下：

var arr = ['a', 'b', 'c'];
console.log(Array.isArray(arr)); // true
var obj = {};
console.log(Array.isArray(obj)); // false
var name = undefined;
console.log(Array.isArray(name)); // false 

arr 是数组，obj 是对象，name 是 undefined。因此打印结果如下：

toString()

它能够将数组转换成字符串，默认是以逗号隔开。这个方法很常用，在日常开发中是很常见的方法，因为经常会在开发中遇到将数组转换成字符串。 使用方法是 arr.toString()。

举例如下：

var arr = ['a', 'b', 'c'];
var str = arr.toString();
console.log(str); //a,b,c 

join()

join 方法能够以我们自定义的参数做分隔符，将数组元素组成一个字符串，以字符串的形式连接起来。使用方法是 arr.join()。

举例如下：

let arr = [1,2,3,4,5];
let str = arr.join('-');
console.log(str); // 1-2-3-4-5 

分隔符是 -，给数组加入分隔符后如下所示：

split()

从中文意思上来看，它有着分割的意思。从某种意义上讲，它和 join 差不多，该方法也是有我们自定义的分隔符，但是它是将字符串分割成数组。使用方法是arr.split()。

举例如下：

let str = 'w-x'；
let arr = str.split('-');
console.log(arr);// ['w','x']; 

字符串是 w-x，需要分割的是 -，因此最终打印结果如下：

reverse()

它有翻转数组的作用。使用方法是 arr.reserse()。

增删方法

现在开始讲讲这些让我“翻车”的增删的数组方法吧。

push()

该方法可用于在数组的末尾添加一个或多个元素，并返回添加后的数组的长度。使用方法是 arr.push()。

举例如下：

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

pop()

该方法可以在数组的最后面删除一个元素，使用方法是 arr.pop()。

举例如下：

var arr = ['a', 'b', 'c'];
var deletea = arr.pop();
console.log(arr); //['a', 'b']
console.log(deletea); // c 

将数组 arr 最后一个元素 c 删除，打印结果如下：

unshift()

该方法可以在数组的最前面，添加一个或者几个元素。使用方法是 arr.unshift()。

举例如下：

var tmp = ['a','b']; 
var arr = tmp.unshift('c');
console.log(arr); 

shift()

该方法可以在数组的最前面删除一个元素。使用方法是 arr.shift()。

举例如下：

var arr = ['a', 'b', 'c'];
arr.shift();
console.log(arr); //["b", "c"] 

将数组 arr 第一个元素 a 删除，打印结果如下：

遍历方法

数组的遍历一定要多看！非常重要！以下是一些出现频率较高的遍历方法。

forEach()

该方法其实很简单，就相当于 for 循环，只不过没有返回值。使用方法如下：

arr.forEach(function(item,index,arr){
//item: 数组中的每一项;
//index:item 对应的下标索引值
//arr: 就是调用该方法的数组本身
}) 

以上的注释有助于理解下面的代码，基本都是同一个意思。

map()

使起来和 forEach 大致相同，只是它有返回值，可以返回一个新数组。使用方法如下：

let arr = [1,3,2,5,4,6];
let res = arr.map(function(item,index,arr){
	return item*2;
})
console.log(res); 

filter()

顾名思义，filter 就是过滤的意思。该方法可以过滤出符合条件的元素。使用方法如下：

let arr = [1, 3, 7, 2, 4, 8];
let res = arr.filter(function(item, index) {return item % 2 === 0;
});
console.log(res); 

过滤出那些不是2的倍数的数字，返回是2的倍数的数字。

every()

判断数组中 所有的项 是否满足要求，如果全都满足，返回 true，否则返回 false。使用方法如下：

let arr = [1, 3, 7, 2, 4, 8];
let res = arr.every(function(item) {return item.do;
});
console.log(res); 

总结

以上就是我复习数组知识以及结合日常开发总结出来的一些常见数组原生方法。从本质上来讲，数组是对象类型的一种特殊表现形式。

数组知识属于 JS 范畴，JS 又属于重中之重。很多公司要求掌握 JS 基础，因为做一个项目 JS 能力非常重要，而检验 JS 能力最基本的问题就数组相关知识。因此，熟练掌握好数组的方法有利于打好 JS 的基础。

像这些数组的方法、增删改查、遍历都很重要，一定要多看多练。

最后

最近找到一个VUE的文档，它将VUE的各个知识点进行了总结，整理成了《Vue 开发必须知道的36个技巧》。内容比较详实，对各个知识点的讲解也十分到位。

有需要的小伙伴，可以点击下方卡片领取，无偿分享