详解JavaScript es6的新增数组方法

下面就来详细讲解JavaScript ES6新增的数组方法。

简介

ES6为数组添加了很多有用而方便的方法，这些方法可以让开发者的工作更加高效。下面就来简单介绍一下ES6新增的数组方法。

新增方法

Array.from()

Array.from()方法用于将类数组对象或可迭代对象转换为数组。此方法的第一个参数是要转换的对象，第二个可选参数是一个映射函数，用于映射转换后的数组元素。

示例1: 将字符串转换成数组：

let str = 'hello world';
let arr = Array.from(str);
console.log(arr);
//输出：  ["h", "e", "l", "l", "o", " ", "w", "o", "r", "l", "d"]

示例2: 将可迭代对象转换成数组：

let set = new Set([1, 2, 3]);
let arr = Array.from(set);
console.log(arr);
//输出： [1, 2, 3]

Array.of()

Array.of()方法用于创建一个具有可变数量的参数的新数组实例。

示例：

let arr = Array.of(1, 2, 3);
console.log(arr);
//输出： [1, 2, 3]

Array.prototype.copyWithin()

Array.prototype.copyWithin()方法用于在数组内部将一个元素序列复制到另一个位置。这个方法会返回修改后的数组，并且不会改变数组的长度。

示例：

let arr = [1,2,3,4,5];
arr.copyWithin(3, 0, 2);
console.log(arr);
//输出： [1, 2, 3, 1, 2]

Array.prototype.find()和Array.prototype.findIndex()

Array.prototype.find()和Array.prototype.findIndex()方法用于查找数组中符合条件的元素并返回它的值和索引，如果没有找到返回undefined和-1。

示例1: 查找第一个大于3的元素

let arr = [1, 2, 3, 4, 5];
let res = arr.find((item)=>{
   return item > 3; 
});
console.log(res);
//输出: 4

示例2: 查找第一个大于3的元素的索引

let arr = [1, 2, 3, 4, 5];
let idx = arr.findIndex((item)=>{
   return item > 3; 
});
console.log(idx);
//输出: 3

Array.prototype.fill()

Array.prototype.fill()方法用于将一个数组中的元素都替换成指定的值。

示例：

let arr = [1, 2, 3, 4, 5];
arr.fill(0);
console.log(arr);
//输出： [0, 0, 0, 0, 0]

结语

本文简单介绍了ES6新增的几个数组方法，包括Array.from(), Array.of(), Array.prototype.copyWithin(), Array.prototype.find()和Array.prototype.findIndex(), Array.prototype.fill()。它们的使用可以极大地提高开发效率。