灏天阁

数组

· 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

- Book Lists -