关于数组的一些使用技巧

在 JavaScript 编程中，数组是常见的存储数据的方式，对于数组的使用有多种方式。本文将向大家展示一些可能需要用到，但却不知道的数组处理技巧。持续地学习和使用这些技巧，提升我们的编程实力。

1、求数组中所有值之和

将数组中的所有值相加，可以通过 array.reduce() 在一行代码中实现；

let nums = [1,3,4,5];
let sums = nums.reduce((x,y)=> x+y); // return 13

2、array.lastIndexOf() 方法

在 JavaScript 中查找给定元素最后一次出现在数组中的位置(索引)，例如在一个有重复值的数组中，可以通过 array.lastIndexOf(item), 找到它最后一次出现的位置。

let nums =[1,2,3,3,4,5,5,6,7,8,9,8]
let lastIndex = nums.lastIndexOf(8); // return 11

3、从数组中获取随机值

当我们需要从数组中随机选择一个值时，可以通过一种简单、快速的方式创建，思路是根据数组长度获取一个随机索引号。

let color = ['blue','white','green','red','grey','yellow'];
let randomColor = color[Math.floor(Math.random()*(color.length))];
console.log(randomColor); 

4、从数组中取出假值

在 JavaScript 中假值一共有6个，分别是 false , “” , 0 , NaN , null , undefined。如果要从数组中去掉此类的价值，需要用到 array.filter() 方法。

let mixArr = ["red",0,"",true,"green",NaN,undefined,false];
let trueArr = mixArr.filter(Boolean); // ["red","green",true]

5、求两个数组的交集

JavaScript 的面试题中会经常考试这个题目，为了找到两个数组的交集，首先需要确保其中一个数组中的值不能有重复，然后使用 filter() 函数和 include() 函数，最后得到两个数组的交集。

let one = [0,2,4,6,8,6];
let two = [1,2,3,5,6,5];
let sameValue = [... new Set(one)].filter(item=>two.includes(item));
console.log(sameValue); // [2,4]

6、 合并数组

这里推荐一种不使用 concat() 函数，高效实现数组合并的技巧，那便是使用 spread 操作符（…） 的方式, 能够使用一行代码，合并多个数组。

let fruits = ["pear","banana"];
let meat = ["beef","fish"];
let vegetables = ["potato","tomato"];
let food = [... fruits,... meat,... vegetables];
console.log(food); // ["pear", "banana","beef", "fish", "potato", "tomato"]

7、用数据填充数组

通过 new Array(length).fill(item), 可以填充一个长度为 length ， 元素为 item 的数组。通常适用于需要用一些数据来填充一个空数组时的场景。

let newArray = new Array(5).fill('2');
console.log(newArray); // ["2","2","2","2","2"]

8、将数组转换为对象

当我们需要将一个数组快速的转化为一个对象，从而方便数据的处理时，最快的方法莫过于适用 spread 操作符（…） 的方式。

let fruits = ["apple","pear","banana"];
let fruitsObj = {... fruits};
console.log(fruitsObj); // {0: "apple", 1: "pear", 2: "banana"}

9、清空数组

对于已经存在若干元素的数组，如果需要出于某种目的将数组清空，最好且最快的办法就是将数组的长度设置为0，即可完成清空数组。

let fruits = ["apple","pear","banana"];
fruits.length = 0;
console.log(fruits);// []

10、不通过map() 映射数组

可以通过 Array.from(array,function) 实现类似 array.map() 的干净代码效果。

let friends = [
    { name: 'aaa', age: 10 },
    { name: 'bbb', age: 20 },
    { name: 'ccc', age: 30 },
    { name: 'ddd', age: 40 },
    { name: 'eee', age: 50 },
];
let friendsName = Array.from(friends, ({ name }) => name);
console.log(friendsName); // ["aaa", "bbb", "ccc", "ddd", "eee"]

11、替换数组中的特定值

如果需要替换数组中的特定值，可以使用 array.splice(start,valueToRemove,valueToAdd),并将所有三个参数传递给它，start 表示从哪里开始修改、valueToRemove 表示修改几个值、valueToAdd 表示新值。

let arrTitle = ["aaa", "bbb", "ccc", "ddd", "eee"];
arrTitle.splice(0,2,"fff","ggg");
console.log(arrTitle); //  ["fff", "ggg", "ccc", "ddd", "eee"]

12、数组去重

数组去重是面试中非常流行的 JavaScript 考题，其中快速简单的方法推荐以下两种。第一种是，通过 Array.from(new Set(array)) 方法；第二种是通过 spread 扩展操作符 (…)。

let arrTitle=["aa","bb","cc","dd","ee","bb","cc","ff"];
// 第一种方法
let uniqueTitle1 = Array.from(new Set(arrTitle));
console.log(uniqueTitle1); // ["aa", "bb", "cc", "dd", "ee", "ff"]
// 第二种方法
let uniqueTitle2 = [... new Set(arrTitle)];
console.log(uniqueTitle2); // ["aa", "bb", "cc", "dd", "ee", "ff"]