一、数组遍历
1.1 for循环
常规的数组循环方法,用法如下:
var a = [1, 2, 3, 4];
var length = a.length;
for(var i = 0; i < length; i++){
console.log(a[i]);
}
1.2 forEach循环
var a = [1, 2, 3, 4];
a.forEach((v, k) => {
console.log("v: " + v + " k: " + k);
});
1.3 for of遍历
var a = [1, 2, 3, 4];
for(var v of a){
console.log(v);
}
1.4 for in
var a = [1, 2, 3, 4];
for(var k in a){
console.log(a[k]);
}
二、数组删除元素
js中使用splice(index, length, [target])
方法实现对数组元素的删除,修改,添加,其中index为数组元素的下标,length为长度,target为要替换的元素。
2.1 删除元素
var a = [1, 2, 3, 4];
a.splice(1, 2);
console.log(a);//(2) [1, 4]
2.2 替换元素
var a = [1, 2, 3, 4];
a.splice(1, 1, "test");
console.log(a);// (4) [1, "test", 3, 4]
a.splice(2, 2, "test2");
console.log(a);//(3) [1, "test", "test2"]
2.3 添加元素
var a = [1, 2, 3, 4];
a.splice(1, 0, "test");
console.log(a);//(5) [1, "test", 2, 3, 4]
三、数组过滤
js中常见的数组过滤的方法有map()
, find()
, filter()
, some()
, every()
3.1 map()
map()并不会改变原数组,它将return的值构造成一个新的数组
返回。
var a= [1, 2, 3, 4];
var b = a.map((v, k) => {
console.log("v: " + v + " k:" + k);
return v + 1;
});
console.log(a);//(4) [1, 2, 3, 4]
console.log(b);//(4) [2, 3, 4, 5]
3.2 find()
find()方法返回数组中符合测试函数条件的第一个元素。否则返回undefined
var a = [1, 2, 3, 4];
var b = a.find((v, k) => {
console.log("v: " + v + " k:" + k);
return v > 2;
});
console.log(a);//(4) [1, 2, 3, 4]
console.log(b);//3
3.3 filter()
filter()与find()不同的是filter将所有
符合条件的元素构成一个新的数组
。
var a = [1, 2, 3, 4];
var b = a.filter((v, k) => {
console.log("v: " + v + " k:" + k);
return v > 2;
});
console.log(a);//(4) [1, 2, 3, 4]
console.log(b);//(2) [3, 4]
3.4 some()
some()是对数组中每一项运行指定函数,如果该函数对任一项
返回true,则返回true
。
var a = [1, 2, 3, 4];
var b = a.some((v, k) => {
console.log("v: " + v + " k:" + k);
return v > 2;
});
console.log(a);//(4) [1, 2, 3, 4]
console.log(b);//true
3.5 every()
与some()不同,every()是对数组中每一项
运行指定函数,如果该函数对所有
项都返回true,则返回true
,有任意一项返回false,则为false
var a = [1, 2, 3, 4];
var b = a.every((v, k) => {
console.log("v: " + v + " k:" + k);
return v > 2;
});
console.log(a);//(4) [1, 2, 3, 4]
console.log(b);//false
四、数组反转
用reverse()方法实现对数组的反转,返回反转后的数组,并且原数组
也发生改变
var a = [1, 2, 3, 4];
var b = a.reverse();
console.log(a);//(4) [4, 3, 2, 1]
console.log(b);//(4) [4, 3, 2, 1]
五、数组拼接
常用的数组拼接的方法有两种,一种是使用concat()
方法,一种是使用es6中点语法
扩展运算符
5.1 concat()
concat()方法并不会对原来的数组造成改变
,会将拼接后的数组返回
var a = [1, 2];
var b = [3, 4];
var c = a.concat(b);
console.log(a);//(2) [1, 2]
console.log(b);//(2) [3, 4]
console.log(c);//(4) [1, 2, 3, 4]
5.2 es6点语法
var a = [1, 2];
var b = [3, 4];
a.push(...b);
console.log(a);//(4) [1, 2, 3, 4]
console.log(b);//(2) [3, 4]
六、数组提取
利用slice(start, end)
可以实现对数组的截取,返回start开始
,end结束(不包含end)
的数组元素作为一个新的数组,并不会改变原来的数组
。
- start: 从该索引处开始提取原数组中的元素,如果该参数为负数,则表示从原数组中的倒数第几个元素开始提取, slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素(包含最后一个元素)。如果省略 start,则 slice 从索引 0 开始。
- end:在该索引处结束提取原数组元素(从0开始)。 slice 会提取原数组中索引从 start 到 end 的所有元素(包含start,但不包含end)。
slice(1,4) 提取原数组中的第二个元素开始直到第四个元素的所有元素 (索引为 1, 2, 3的元素)。
如果该参数为负数, 则它表示在原数组中的倒数第几个元素结束抽取。 slice(-2,-1) 表示抽取了原数组中的倒数第二个元素到最后一个元素(不包含最后一个元素,也就是只有倒数第二个元素)。
如果 end 被省略,则 slice 会一直提取到原数组末尾。如果 end 大于数组长度, slice 也会一直提取到原数组末尾。
用法如下:
var a = [1, 2, 3, 5];
var b = a.slice(1, 2);
var c = a.slice(); // 不传参数
var d = a.slice(-2, -1);
console.log(a);//(4) [1, 2, 3, 5]
console.log(b);//[2]
console.log(c);//(4) [1, 2, 3, 5]
console.log(d); // [3]
七、数组转为字符串
JSON.stringify()
方法可以将数组转化为一个字符串(不仅仅是组数,其它对象也可以被转化为json字符串):
var a = [1, 2, 3, 4];
console.log(JSON.stringify(a));//[1,2,3,4]
console.log(a.join(",")); //1,2,3,4
八、字符串转为数组
JSON.parse()
方法将字符串数组转化为数组对象:
var a = "[1,2,3,4]";
console.log(JSON.parse(a));//(4) [1, 2, 3, 4]
九、判断数组是否包含某个元素
9.1 for,every,some,find
可以利用for,every,some,find来判断数组中是否包含某个元素,这里不再细说。
9.2 indexOf
indexOf(item, start)
,用来判断数组中是否包含item元素,从start位置开始查询(0<= start <= length-1),如果有就返回item元素第一次出现的位置
,若果没有就返回-1
:
var a = [1, 2, 3, 4, 3];
console.log(a.indexOf(3));//2
console.log(a.indexOf(3, 2));//2
console.log(a.indexOf(3, 3));//3
9.3 includes
indcludes
是es6的方法,判断数组是否包含某个元素
var a = [1, 2, 3, 4, 3];
console.log(a.includes(3)); // true
console.log(a.includes(5)); // false
十、利用数组模仿栈
利用push()
,向数组的尾部添加一个元素,利用pop()
,删除数组的最后一个元素:
var a = [1, 2, 3, 4];
a.push(5);
console.log(a);//(5) [1, 2, 3, 4, 5]
a.pop();
console.log(a);//(4) [1, 2, 3, 4]
十一、利用数组模仿队列
利用push()
,向数组的尾部添加一个元素,利用shift()
,删除数组的第一个元素:
var a = [1, 2, 3, 4];
a.push(5);
console.log(a);//(5) [1, 2, 3, 4, 5]
a.shift();
console.log(a);//(4) [2, 3, 4, 5]
unshift()
方法可以在数组头部添加一个元素:
var a = [1, 2, 3, 4];
a.unshift(5);
console.log(a);//(5) [1, 2, 3, 4, 5]
十二、Array对象
12.1 Array.from
from() 方法用于通过拥有 length 属性
的对象
或可迭代
的对象
来返回一个数组;如果对象是数组返回 true,否则返回 false。
Array.from(object, mapFunction, thisValue)
参数 | 描述 |
object | 必需,要转换为数组的对象。 |
mapFunction | 可选,数组中每个元素要调用的函数。 |
thisValue | 可选,映射函数(mapFunction)中的 this 对象。 |
12.2 fill
fill() 方法用于将一个固定值替换数组的元素。
array.fill(value, start, end)
参数 | 描述 |
value | 必需。填充的值。 |
start | 可选。开始填充位置。 |
end | 可选。停止填充位置 (默认为 array.length) |
12.3 初始化一个二维数组
let sLen = 5;
let arr = Array.from(new Array(sLen),() => new Array(sLen).fill(false));
12.4 sort
sort() 方法以字母顺序
对数组进行排序
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort(); // [ "Apple", "Banana", "Mango", "Orange" ]
数字排序
默认地,sort() 函数按照字符串顺序
对值进行排序。
该函数很适合字符串(“Apple” 会排在 “Banana” 之前)。
不过,如果数字按照字符串来排序,则 “25” 大于 “100”,因为 “2” 大于 “1”。
正因如此,sort() 方法在对数值排序时会产生不正确的结果。
我们通过一个比值函数
来修正此问题:
var points = [40, 100, 1, 5, 25, 10];
points.sort((a, b) => a - b); // [ 1, 5, 10, 25, 40, 100 ]
points.sort((a, b) => b - a); // [ 100, 40, 25, 10, 5, 1 ]