数组
·
Yin灏
of方法
let array = new Array(3);
console.log(array); // (3) [empty × 3]
let array1 = new Array('3');
console.log(array1); // ["3"]
let array2 = new Array(1, 2, 3);
console.log(array2); // [1, 2, 3]
ES6 为 Array 对象添加了 of 方法,无论多少参数、参数类型是什么,这些参数都将是数组中的元素。
let array = Array.of(3);
console.log(array); // [3]
let array1 = Array.of('3');
console.log(array1); // ["3"]
let array2 = Array.of(1, 2, 3);
console.log(array2); // [1, 2, 3]
from 方法
获取页面中所有的 li 元素
let items = document.querySelectorAll('li');
console.log(Object.prototype.toString.call(items)); // [object NodeList]
console.log((new Object()).toString.call(items)); // [object NodeList]
console.log(({}).toString.call(items));
通过 from 进行转换
let items = Array.from(document.querySelectorAll('li'));
console.log(Object.prototype.toString.call(items)); // [object Array]
// 下面这种方式可用
items[0].style.width = '100px';
items[0].style.height = '100px';
items[0].style.backgroundColor = 'red';
除了类数组对象外,from 还可以对字符串,集合(set)和映射(Map)进行转换。
如果希望在转换的时候处理一下元素,可为 from 添加第二个参数
console.log(
Array.from({ length: 5 }, (v, i) => i) // [0, 1, 2, 3, 4]
);
from 还有第三个参数,该参数的主要作用是为第二个参数指定 this 对象。
find 方法
条件检索,只返回符合条件的第一个元素。
let user = [
{ name: 'tom', age: 20 },
{ name: 'jon', age: 50 },
{ name: 'kitty', age: 24 },
{ name: 'rose', age: 40 }
];
console.log(user.find(item => item.age > 30)); // {name: "jon", age: 50}
findIndex 方法
let user = [
{ name: 'tom', age: 20 },
{ name: 'jon', age: 50 },
{ name: 'kitty', age: 24 },
{ name: 'rose', age: 40 }
];
console.log(user.findIndex(item => item.age > 30)); // 1
fill 方法
let array = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, ];
console.log(array.fill(1, 1, 3)); // [0, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0]
var arr = new Array(7);
arr.fill(8)
console.log(arr); // [8, 8, 8, 8, 8, 8, 8]
var arr = [];
arr.length = 7;
console.log(arr)
copyWithin 方法
copyWithin 与 fill 类似,只不过 copyWithin 使用的数组内部的元素来填充,而不是指定数据。
let array = [0, 1, 2, 3, 4];
console.log(array.copyWithin(4, 1, 3)); // [0, 1, 2, 3, 1]
entries 方法
主要用于将数组转换为迭代器对象
let array = [0, 1, 2, 3];
let iterator = array.entries();
console.log(iterator); // {}
console.log(iterator.next().value); // [0, 0]
console.log(iterator.next().value); // [1, 1]
console.log(iterator.next().value); // [2, 2]
keys 方法
返回数组的索引
let array = [0, 1, 2, 3];
let iterator = array.keys();
console.log(iterator); // {}
console.log(iterator.next().value); // 0
console.log(iterator.next().value); // 1
console.log(iterator.next().value); // 2
values 方法
返回数组的值
let array = [0, 13, 43, 3];
let iterator = array.values();
console.log(iterator); // {}
console.log(iterator.next().value); // 0
console.log(iterator.next().value); // 13
console.log(iterator.next().value); // 43