美文网首页
ES6(十)增强的数组功能1

ES6(十)增强的数组功能1

作者: 蒋小花_4b6c | 来源:发表于2020-06-02 18:09 被阅读0次

1.创建数组

2.新增的方法

3.fill() 方法

4.copyWithin() 方法

创建数组

ES6之前: Array 构造器、数组字面量写法

    Array 构造器:

                let items = new Array(2);

                let items = new Array("2");

                let items = new Array(1, 2);

                let items = new Array(3, "2");

                console.log(items.length);

                console.log(items[0]);

                console.log(items[1]);

ES6:  Array.of()  、Array.from()

    Array.of(),就是单纯的声明数组,获取数组中的值

    Array.from(), 可以将非数组对象转换为真正的数组

Array.of():

        let items = Array.of(1, 2);

        console.log(items.length); // 2

        console.log(items[0]); // 1

        console.log(items[1]); // 2

        let items = Array.of(2);

        console.log(items.length); // 1

        console.log(items[0]); // 2

        let items = Array.of("2");

        console.log(items.length); // 1

        console.log(items[0]); // 2

Array.from()

将非真正的数组arguments转成真正的数组

function doSomething() {

    var args = Array.from(arguments);

    // 使用 args

}

Array.from() 还可以这样做:

function translate() {

    return Array.from(arguments, (value) => value + 1);

}

let numbers = translate(1, 2, 3);

console.log(numbers); // 2 3 4

新增的方法

find() 与 findIndex() 方法是为了 让开发者能够处理包含任意值的数组,

fill() 与 copyWithin() 方法只允许包含数值类型的值。

ES5中, indexOf()、 lastIndexOf() 允许开发者在数组中查找特定值;

find()与 findIndex() 满足条件时返回 true ,在回调函数第一次返回 true 时停止查找。

find() 方法会返回匹配的值,而 findIndex() 方法则会返回匹配位置 的索引。

let numbers = [25, 30, 35, 40, 45];

console.log(numbers.find(n => n > 33));  // 35

console.log(numbers.findIndex(n => n > 33)); // 2

想查找特定值,则使用 indexOf() 与lastIndexOf() 

let numbers = [25, 30, 35, 40, 45, 40, 45];

console.log(numbers.find(n => n > 33));  // 35

console.log(numbers.findIndex(n => n > 33)); // 2

console.log(numbers.indexOf(30)); // 1

console.log(numbers.lastIndexOf(45)); // 6

fill() 方法

一个参数,将数组中的所有元素都填充为 当前参数.

let numbers = [1, 2, 3, 4];

numbers.fill(1);

console.log(numbers.toString()); // 1,1,1,1

多个参数,2/3个参数,可选的起始位置参数与结束位 置参数(不包括结束位置的那个元素)

let numbers = [1, 2, 3, 4];

numbers.fill(1, 2);

console.log(numbers.toString()); // 1,2,1,1  // 第 二个参数表示,将索引值为 [2, length) 的元素填充为1

numbers.fill(0, 1, 3);

console.log(numbers.toString()); // 1,0,0,1  // 第二三个 参数 表示,将索引值为 [1, 3) 的元素填充为 0

copyWithin() 方法

与 fill() 类似,可以一次性修改数组的多个元素

而允许你在数组内部复制自身元素

let numbers = [1, 2, 3, 4];

// 从索引 2 的位置开始粘贴

// 从数组索引 0 的位置开始复制数据

numbers.copyWithin(2, 0);

console.log(numbers.toString()); // 1,2,1,2

let numbers = [1, 2, 3, 4];

// 从索引 2 的位置开始粘贴

// 从数组索引 0 的位置开始复制数据

// 在遇到索引 1 时停止复制

numbers.copyWithin(2, 0, 1);

console.log(numbers.toString()); // 1,2,1,4

相关文章

网友评论

      本文标题:ES6(十)增强的数组功能1

      本文链接:https://www.haomeiwen.com/subject/romszhtx.html