ES6 Array常用扩展的应用实例分析

下面就针对题目提供一份“ES6 Array常用扩展的应用实例分析”的攻略。

ES6 Array常用扩展

1. Array.from()

Array.from() 方法可以将一个类似数组或可迭代对象转换为一个真正的数组。该方法需要一个目标对象作为参数，可以指定一个函数来对原数组的每个元素进行操作，并返回一个新的数组。

let arr = "12345678";
arr = Array.from(arr, (x) => parseInt(x));
console.log(arr); // [ 1, 2, 3, 4, 5, 6, 7, 8 ]

在上面的例子中，我们将字符串 "12345678" 转换为一个数组，并对其进行了遍历转换，最终返回了一个新的数组。

2. Array.of()

Array.of() 方法可以将一组参数转换为一个数组。在使用该方法创建数组时，参数的数量和类型不会对数组的类型造成影响。

let arr1 = Array.of(1, 2, 3, 4, 5);
let arr2 = Array(1, 2, 3, 4, 5);
console.log(arr1); // [ 1, 2, 3, 4, 5 ]
console.log(arr2); // [ 1, 2, 3, 4, 5 ]

在上面的例子中，我们分别用 Array.of() 和 Array() 方法创建了一个包含 5 个元素的数组，结果是一样的。

3. Array.find()

Array.find() 方法返回满足指定条件的第一个数组元素的值。

let arr = [1, 3, 5, 7, 9];
let val = arr.find((value) => value > 5);
console.log(val); // 7

在上面的例子中，我们查找了数组 arr 中符合条件的第一个元素，即大于 5 的元素 7。

4. Array.findIndex()

Array.findIndex() 方法返回满足指定条件的第一个数组元素的下标。

let arr = [1, 3, 5, 7, 9];
let index = arr.findIndex((value) => value > 5);
console.log(index); // 3

在上面的例子中，我们找到数组 arr 中第一个大于 5 的元素的下标，即 3。

5. Array.includes()

Array.includes() 方法用于判断一个数组是否包含某个元素，其返回值为 true 或 false。

let arr = [1, 3, 5, 7, 9];
let res1 = arr.includes(5);
let res2 = arr.includes(6);
console.log(res1); // true
console.log(res2); // false

在上面的例子中，我们分别判断了数组 arr 中是否包含元素 5 和 6，结果是 true 和 false。

应用实例分析

示例1：字符串转数组

示例1中，我们将一个字符串转换成了一个数组，并计算出了数组中所有元素的平均值。

let str = "12345";
let arr = Array.from(str, (x) => parseInt(x));
let sum = arr.reduce((curr, next) => curr + next);
let avg = sum / arr.length;
console.log(avg); // 3

示例2：找到第二个大的数

在示例2中，我们找到一个数组中的第二个大的数。

let arr = [10, 5, 3, 9, 7];
let newArr = Array.from(new Set(arr)).sort((a, b) => a - b);
console.log(newArr[newArr.length - 2]); // 9

在上面的例子中，我们先用 Set() 方法去除了重复的元素，并将其排序得到了一个新的数组，然后取出了该数组中的倒数第二个元素 9，即为所求。

总结

本文介绍了 ES6 中 Array 常用扩展的应用实例，主要包括 Array.from()、Array.of()、Array.find()、Array.findIndex() 和 Array.includes()，同时介绍了两个具体的应用场景，并给出了代码示例。通过学习本文，我们可以更好地理解 ES6 Array 扩展的应用。