类数组和数组方法

1. 类数组

类数组是像数组一样拥有索引(数组下标)和长度(length)的对象,但未拥有数组方法。

比如,

var ArrLike = {
    0: 'args1',
    1: 'args2',
    length: 2
}

常见的类数组有arguments对象和DOM方法的返回结果。

类数组要使用数组方法,需先转化为数组:

  • Array.from(arguments)
  • Array.prototype.slice.call(arguments)

2. 数组方法

  • push & pop
  • unshift & shift
  • sort & reverse
  • slice & splice
  • concat
  • join
  • indexOf & lastIndexOf
  • forEach
  • map
  • filter
  • every & some

2.1 push & pop

push()方法和pop()方法都是对数组的末尾进行添加和删除元素。

var arr = [1, 3, 7, 8];
			
// push & pop
// push 可以向数组末尾添加一个或多个元素,返回数组长度
console.log(arr.push(9) + '---' + arr);
console.log(arr.push(2, 5) + '---' + arr);
// pop 移除最后一个元素,并返回该元素
console.log(arr.pop() + '---' + arr);

// 输出结果
5---1,3,7,8,9
7---1,3,7,8,9,2,5
5---1,3,7,8,9,2

2.2 unshift & shift

unshift()方法和shift()方法都是对数组的首端进行添加和删除元素。

var arr = [1, 3, 7, 8];
// unshift & shift
// unshift 数组首端添加一个或多个元素,返回数组长度
console.log(arr.unshift(0) + '---' + arr);
console.log(arr.unshift(0, 1) + '---' + arr);
// shift 删除数组第一个元素,并返回该元素
console.log(arr.shift() + '---' + arr);

5---0,1,3,7,8
7---0,1,0,1,3,7,8
0---1,0,1,3,7,8

2.3 sort & reverse

sort()方法和reverse()方法对原数组进行排序和倒序,并不会产生新的数组。

var arr = [1, 7, 3, 8];
// sort & reverse
// sort 按从小到大对数组进行排序
arr.sort();
console.log(arr.toString()); // 1,3,7,8
// reverse 倒序或倒置,并不是按大小排序,
// 而是将数组从左到右的顺序颠倒过来,变成从右到左
var arr2 = [2, 5, 9, 3];
arr2.reverse();
console.log(arr2.toString()); // 3,9,5,2

2.4 slice & splice

slice()方法和splice()方法长得比较接近,就一起拿过来唠唠。

var arr = [1, 7, 3, 8];
// slice & splice
// slice(start,end) 返回数组的一个片段,第一个参数必选
console.log(arr.slice(1)); // [7, 3, 8]
console.log(arr.slice(1, 3)); // [7, 3] 不包含结束位置
// splice(index,howmany,item1,.....,itemX)
// index	必需。整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置。
// howmany	必需。要删除的项目数量。如果设置为 0,则不会删除项目。
// item1, ..., itemX	可选。向数组添加的新项目。
// 该方法会改变原始数组,返回的是含有被删除的元素的数组
var arr2 = [2, 5, 9, 3];
console.log(arr2.splice(1, 2) +'---'+ arr2); // 5,9---2,3
var arr3 = [2, 5, 9, 3];
console.log(arr3.splice(1, 0, 6, 6) +'---'+ arr3); // ---2,6,6,5,9,3

2.5 concat

concat()方法可以用来拼接数组。

var arr = [1, 7, 3, 8];
// concat() 拼接数组,参数可以是单个元素,也可以是数组
console.log(arr.concat(9, [0, 1])); // [1, 7, 3, 8, 9, 0, 1]

2.6 join

join()方法通过传入一个连接符将数组元素连接成一个字符串,默认的连接符是逗号。

var arr = [1, 7, 3, 8];
// join() 通过连接符连接数组元素
console.log(arr.join()); 		// 1,7,3,8
console.log(arr.join('-'));		// 1-7-3-8

2.7 indexOf & lastIndexOf

indexOf()方法和lastIndexOf()方法都是返回某元素在数组中的索引位置,不同的是,如果该元素在数组中出现多次,indexOf()返回的第一次出现的位置,而lastIndexOf()返回的是最后一次出现的位置。

var arr = [1, 7, 5, 7, 3, 8];
// indexOf & lastIndexOf
console.log(arr.indexOf(7));     // 1
console.log(arr.lastIndexOf(7)); // 3

2.8 forEach

三个参数分别为:遍历的数组内容,第对应的数组索引,数组本身。

var arr = [1, 7, 3, 8];
arr.forEach(function(x, index, a){
	console.log(x + '|' + index + '|' + (a === arr));
});
// 1|0|true
// 7|1|true
// 3|2|true
// 8|3|true

2.9 map

var arr = [1, 7, 3, 8];
var arr2 = arr.map(function(item){
	return item*item;
});
console.log(arr2); //[1, 49, 9, 64]

2.10 filter

var arr = [1, 7, 3, 8, 9];
var arr2 = arr.filter(function(x, index) {
	return index % 2 === 0 || x >= 8;
}); 
console.log(arr2);  // [1, 3, 8, 9]

2.11 every & some

  • every() 数组所有元素满足条件返回true
  • some() 只要数组中有一个元素满足条件便返回true
var arr = [1, 7, 3, 8, 9];
var res = arr.every(function(x) {
	return x < 10;
}); 
console.log(res); // true

var res = arr.some(function(x) {
	return x < 3;
}); 
console.log(res); // true

参考链接

posted @ 2021-02-20 12:04  叶遮沉阳  阅读(196)  评论(0编辑  收藏  举报