-
创建数组 Array.from() ; Array.of()
Array.from({ length: 10 }, (item, index) => index); //[0, 1, 2, 3, 4, 5, 6, 7, 8, 9] 用于将类数组结构转换为数组实例 第一个参数是一个类数组对象,即任何可迭代的结构或者有一个length属性和可索引元素的结构。 第二个可选的映射函数参数,这个函数可以直接增强新数组的值 第三个可选参数用于指定映射函数中 this 的值 (箭头函数无法使用) Array.of((1,2,3,4,5)); //[1, 2, 3, 4, 5] 可以把一组参数转换为数组,用于代替在ES6之前使用的 Array.prototype.slice.call(arguments),
2.检测数组方法 instanceof Array.isArray()
value instanceof Array()
instanceof 是Array的运算符,检查value是否为数组,如果是返回true,否返回false
Array.isArray(value)
Array.isArray()是一个方法,用于检查接收的参数是否为数组,如果是的话返回true,否返回false
3.迭代器方法:ES6在Array原型上暴露了keys()、value()、entries();三个方法;因为这些方法都是返回迭代器,所以可以将他们的内容用 Array.from() 转换为数组实例
const lazy = ['one', 'two', 'three', 'four'];
Array.from(lazy.keys()) // [0, 1, 2, 3] keys()方法返回数组索引
Array.from(lazy.values()) // ["one", "two", "three", "four"] values()返回数组元素
Array.from(lazy.entries()) // [[0, "one"][1, "two"][2, "three"][3, "four"]] // 返回二维数组元素
4.复制和填充方法 Array.fill() Array.copyWithin()
Array.fill() 向一个已有的数组中插入全部或部分相同的值 第一个参数是需要填充的值 第二个参数是开始索引,可选,不选的话从0开始 第三个参数是结束索引,可选,不选的话到末尾结束 索引为负的话从数组末尾开始计算索引,也可以将负索引想象成数组长度加上它得到的一个正索引
const zeroes = [0, 0, 0, 0, 0];
// 用5填充整个数组
zeroes.fill(5); //[5, 5, 5, 5, 5]
// 用6填充索引大于等于3的元素
zeroes.fill(6, 3); //[0, 0, 0, 6, 6]
// 用7填充大于等于1且小于3的元素
zeroes.fill(7, 1, 3); //[0, 7, 7, 0, 0]
// 用8填充索引大于等于1且小于4的元素
// (-4 + zeroes.length = 1)
// (-1 + zeroes.length = 1)
zeroes.fill(8, -4, -1); //[0, 8, 8, 8, 0]
// fill() 静默忽略超出数组边界、零长度及方向相反的索引范围
// 索引过低,忽略
zeroes.fill(1, -10, -6); //[0, 0, 0, 0, 0]
// 索引过高忽略
zeroes.fill(1, 10, 15); //[0, 0, 0, 0, 0]
// 索引反向,忽略
zeroes.fill(2, 4, 2); //[0, 0, 0, 0, 0]
// 索引部分可用,填充可用部分
zeroes.fill(4, 3, 10); //[0, 0, 0, 4, 4]
5.转化方法
let colors = ['red', 'blue', 'yellow'];
Array.valueOf() 返回的还是数组本身
colors.valueOf() // ["red", "blue", "yellow"]
Array.toString() 返回由每个值的等效字符串拼接而成的一个逗号分隔的字符串
colors.toString() // 'red,blue.yellow'
Array.toLocaleString() 得到一个逗号分隔的数组值的字符串,为了得到最终的字符串,会调用每个值的 toLocaleString() 方法,而不是 toString() 方法
colors.toLocaleString() // 'red,blue,yellow'
Array.join() 该方法只接收一个参数separator:即分隔符;将数组的元素组起一个字符串,以 separator 为分隔符,省略的话则用默认用逗号为分隔符
colors.join() // 输出 'red,blue,yellow'
colors.join('-') // 输出 'res-blue-yellow'
6.栈方法 push() pop() push():接收任意数量的参数,并把他们放到数组后面,并返回数组长度 pop() // 移除数组最后一项,并返回呢个元素
const arr = ['red', 'blue', 'yellow'];
arr.push('grren','pink') // 此时,arr为 ['red', 'blue', 'yellow','grren','pink'] , 这个方法返回arr长度 5
const item = arr.pop(); // 输出 yellow
arr 变为 ['red', 'blue'] , length = 2
7.队列方法 shift() 和 unshift() shift() 删除数组的第一个元素,并返回删除的呢个元素,如果数组为空的话,则返回undefined unshift() 在数组头添加一个元素,并返回数组长度
const arr = ['red', 'blue', 'yellow'];
const item = arr.shift() // item 为 'red'
arr 为 ['blue', 'yellow']
const item = arr.unshift('pink') // item = 4
arr // ['pink', 'red', 'blue', 'yellow']
8.排序方法 reverse() // 反向,反转数组,并改变原数组 sort() 按升序排列数组项——即最小的值位于最前面,最大的值排在最后面。sort貌似不太好用
let arr = [13, 24, 51, 3];
console.log(arr.reverse()); //[3, 51, 24, 13]
console.log(arr); //[3, 51, 24, 13](原数组改变)
let arr1 = ["a", "d", "c", "b"];
console.log(arr1.sort()); // ["a", "b", "c", "d"]
let arr2 = [13, 24, 51, 3];
console.log(arr2.sort()); // [13, 24, 3, 51] 两位数字先比较第一位再比较第二位
console.log(arr2); // [13, 24, 3, 51](原数组被改变)
9.操作方法 Array.concat() // 将concat中的参数放到array中,并返回一个新的,不操作原数组
const arr = [1,3,5,7];
const arrCopy = arr.concat(9,[11,13]); // 此时arrcopy为 [1, 3, 5, 7, 9, 11, 13] ,原数组为[1,3,5,7];
Array.slice() // 返回原数组中指定位置的新数组
const arr = [1,3,5,7,9,11];
const arrCopy = arr.slice(1);
const arrCopy2 = arr.slice(1,4);
const arrCopy3 = arr.slice(1,-2);
const arrCopy4 = arr.slice(-4,-1);
console.log(arr); //[1, 3, 5, 7, 9, 11](原数组没变)
console.log(arrCopy); //[3, 5, 7, 9, 11]
console.log(arrCopy2); //[3, 5, 7]
console.log(arrCopy3); //[3, 5, 7]
console.log(arrCopy4); //[5, 7, 9]
// arrCopy只设置了一个参数,也就是起始下标为1,所以返回的数组为下标1(包括下标1)开始到数组最后。
// arrCopy2设置了两个参数,返回起始下标(包括1)开始到终止下标(不包括4)的子数组。
// arrCopy3设置了两个参数,终止下标为负数,当出现负数时,将负数加上数组长度的值(6)来替换该位置的数,因此就是从1开始到4(不包括)的子数组。
// arrCopy4中两个参数都是负数,所以都加上数组长度6转换成正数,因此相当于slice(2,5)。
Array.splice() 很强大的数组方法,它有很多种用法,可以实现删除、插入和替换
let arr = [1,3,5,7,9,11];
let arrRemoved = arr.splice(0,2);
console.log(arr); //[5, 7, 9, 11]
console.log(arrRemoved); //[1, 3]
let arrRemoved2 = arr.splice(2,0,4,6);
console.log(arr); // [5, 7, 4, 6, 9, 11]
console.log(arrRemoved2); // []
let arrRemoved3 = arr.splice(1,1,2,4);
console.log(arr); // [5, 2, 4, 4, 6, 9, 11]
console.log(arrRemoved3); //[7]
10.搜索和位置方法 严格相等 Array.indexOf() 接收两个参数:要查找的项和(可选的)表示查找起点位置的索引。其中, 从数组的开头(位置 0)开始向后查找。 Array.lastIndexOf() 接收两个参数:要查找的项和(可选的)表示查找起点位置的索引。其中, 从数组的末尾开始向前查找。
const arr = [1,3,5,7,7,5,3,1];
console.log(arr.indexOf(5)); //2
console.log(arr.lastIndexOf(5)); //5
console.log(arr.indexOf(5,2)); //2
console.log(arr.lastIndexOf(5,4)); //2
console.log(arr.indexOf("5")); //-1
Array.includes() ES7
const arr = [1,3,5,7,7,5,3,1];
arr.includes(3); // true
arr.includes(4); // false
10.断言函数:返回值决定了想要的索引的元素是否被认为匹配;Array.find() Array.findIndex()找到匹配项后,这两个方法都不再继续搜索 Array.find() 返回第一个匹配的元素 Array.findIndex() 返回第一个匹配元素的索引 11.迭代方法
Array.forEach()
Array.map() 指“映射”,对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组。
const arr = [1, 2, 3, 4, 5];
const arr2 = arr.map(function(item){
return item*item;
});
console.log(arr2); //[1, 4, 9, 16, 25]
Array.filter() “过滤”功能,数组中的每一项运行给定函数,返回满足过滤条件组成的数组。
const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const arr2 = arr.filter(function(x, index) {
return index % 3 === 0 || x >= 8;
});
console.log(arr2); //[1, 4, 7, 8, 9, 10]
Array.every() 判断数组中每一项都是否满足条件,只有所有项都满足条件,才会返回true。
const arr = [1, 2, 3, 4, 5];
const arr2 = arr.every(function(x) {
return x < 10;
});
console.log(arr2); //true
const arr3 = arr.every(function(x) {
return x < 3;
});
console.log(arr3); // false
Array.some() 判断数组中是否存在满足条件的项,只要有一项满足条件,就会返回true。
const arr = [1, 2, 3, 4, 5];
const arr2 = arr.some(function(x) {
return x < 3;
});
console.log(arr2); //true
const arr3 = arr.some(function(x) {
return x < 1;
});
console.log(arr3); // false
12.归并方法 Array.reduce()和 Array.reduceRight()