小知识，大挑战！本文正在参与“程序员必备小知识”创作活动。
英文原文链接：13 Useful JavaScript Array Tips and Tricks You Should Know
数组是 Javascript 中最常见的概念之一，它为我们提供了许多处理存储在其中的数据的可能性。你开始学习编程的道路上，考虑这个数组在 Javascript 中是一个最基本的主题,在这篇文章中, 我想告诉你一些（你可能不知道, 但却可能在编码中是非常有用的）小窍门，让我们开始吧。
1. 从数组中删除重复项
这是一个很流行的关于 Javascript 数组的面试问题，如何从 Javascript 数组中提取唯一的值。这里有一个快速而简单的解决方案，您可以使用一个new Set() 来达到这个目的。我想向您展示两种可能的方法，一种是使用 .from() 方法，另一种是使用扩展算子 (…) 。
var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];
// 第一种方法
var uniqueFruits = Array.from(new Set(fruits));
console.log(uniqueFruits); // 返回 [“banana”, “apple”, “orange”, “watermelon”, “grape”]
// 第二种方法
var uniqueFruits2 = […new Set(fruits)];
console.log(uniqueFruits2); // 返回 [“banana”, “apple”, “orange”, “watermelon”, “grape”]
2. 替换数组中的特定值
有时在创建代码时需要替换数组中的特定值，有一个很好的简短方法可以做到这一点，但您可能还不知道。为此，我们可以使用 【此处原文有误，我进行了修正】
.splice(start[, deleteCount[, item1[, item2[, ...]]]])
并传递所有三个参数，指定我们想要开始修改的位置、想要修改的值的个数以及（多个）新值。
var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];
fruits.splice(0, 2, “potato”, “tomato”);
console.log(fruits); // 返回 [“potato”, “tomato”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”]
3. 不用 .map() 映射数组
可能每个人都知道数组的 .map() 方法，但是可以使用不同的解决方案来获得类似的效果和非常干净的代码。为此，我们可以使用 .from() 方法。
var friends = [
{ name: ‘John’, age: 22 },
{ name: ‘Peter’, age: 23 },
{ name: ‘Mark’, age: 24 },
{ name: ‘Maria’, age: 22 },
{ name: ‘Monica’, age: 21 },
{ name: ‘Martha’, age: 19 },
]
var friendsNames = Array.from(friends, ({name}) => name);
console.log(friendsNames); // 返回 [“John”, “Peter”, “Mark”, “Maria”, “Monica”, “Martha”]
4. 清空数组
当你有一个满是元素的数组，但你需要为某种目的要清理它，而又不想一个一个地删除项目? 用一行代码就可以做到这一点。要清空数组，您需要将数组的长度设置为 0 ，就这样!
var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];
fruits.length = 0;
console.log(fruits); // returns []
5. 将数组转换为对象
碰巧我们有一个数组，但出于某种目的，我们需要一个带有该数据的对象，而将数组转换为对象的最快方法是使用众所周知的扩展运算符(…)。
var fruits = [“banana”, “apple”, “orange”, “watermelon”];
var fruitsObj = { …fruits };
console.log(fruitsObj); // returns {0: “banana”, 1: “apple”, 2: “orange”, 3: “watermelon”, 4: “apple”, 5: “orange”, 6: “grape”, 7: “apple”}
6. 用数据填充数组
在某些情况下，当我们创建一个数组时，我们想用一些数据填充它，或者我们需要一个具有相同值的数组，在这种情况下，.fill() 方法提供了一个简单而干净的解决方案。
var newArray = new Array(10).fill(“1”);
console.log(newArray); // 返回 [“1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”]
7. 合并数组
你知道如何不使用 .concat() 方法将数组合并成一个数组吗? 有一种简单的方法可以将任意数量的数组合并到一行代码中。您可能已经意识到，在处理数组时，扩展运算符(…)非常有用，在本例中也是如此。
var fruits = [“apple”, “banana”, “orange”];
var meat = [“poultry”, “beef”, “fish”];
var vegetables = [“potato”, “tomato”, “cucumber”];
var food = […fruits, …meat, …vegetables];
console.log(food); // [“apple”, “banana”, “orange”, “poultry”, “beef”, “fish”, “potato”, “tomato”, “cucumber”]
8. 求两个数组的交集
这也是 Javascript 面试中最常见的挑战之一，因为它会告诉你是否可以使用数组方法以及你的逻辑是什么。为了找到两个数组的交集，我们将使用本文前面介绍的方法之一，以确保正在检查的数组中的值不会重复，我们将使用 .filter 方法和 .include 方法。因此，我们将获得两个数组中都存在的值的数组。检查代码:
var numOne = [0, 2, 4, 6, 8, 8];
var numTwo = [1, 2, 3, 4, 5, 6];
var duplicatedValues = […new Set(numOne)].filter(item => numTwo.includes(item));
console.log(duplicatedValues); // returns [2, 4, 6]
9. 从数组中删除假值
首先，让我们定义假值。在 Javascript 中，假值是
false
0
" "
null
NaN
undefined
现在我们看看如何从数组中删除这类值。为此，我们将使用 .filter() 方法。
var mixedArr = [0, “blue”, “”, NaN, 9, true, undefined, “white”, false];
var trueArr = mixedArr.filter(Boolean);
console.log(trueArr); // returns [“blue”, 9, true, “white”]
10. 从数组中获取随机值
有时我们需要从数组中随机选择一个值。为了以一种简单、快速和简短的方式创建它，并保持代码整洁，我们可以根据数组的长度获得一个随机的索引号。让我们看看代码:
var colors = [“blue”, “white”, “green”, “navy”, “pink”, “purple”, “orange”, “yellow”, “black”, “brown”];
var randomColor = colors[(Math.floor(Math.random() * (colors.length)))]
11. 逆序（翻转）一个数组
当需要翻转数组时，不需要通过复杂的循环和函数来创建它，有一个简单的数组方法可以为我们做所有的事情，只需要一行代码，就可以翻转数组。让我们检查一下:
var colors = [“blue”, “white”, “green”, “navy”, “pink”, “purple”, “orange”, “yellow”, “black”, “brown”];
var reversedColors = colors.reverse();
console.log(reversedColors); // returns [“brown”, “black”, “yellow”, “orange”, “purple”, “pink”, “navy”, “green”, “white”, “blue”]
12 . .lastIndexOf() 方法
在 Javascript 中，有一个有趣的方法，它允许查找给定元素的最后一次出现的索引。例如，如果数组有重复的值，我们可以找到它最后一次出现的位置。让我们看看代码示例:
var nums = [1, 5, 2, 6, 3, 5, 2, 3, 6, 5, 2, 7];
var lastIndex = nums.lastIndexOf(5);
console.log(lastIndex); // returns 9
13. 对数组中的所有值求和
另一个在 Javascript 工程师面试中经常发生的挑战。这里没有可怕的东西;它可以在一行代码中使用 .reduce 方法来解决。让我们看看代码:
var nums = [1, 5, 2, 6];
var sum = nums.reduce((x, y) => x + y);
console.log(sum); // returns 14
结论
在本文中，我向您介绍了 13 种技巧，可以帮助您编写代码并保持代码简短和整洁。此外，记住，在 Javascript 中有许多不同的技巧值得探索，不仅是关于数组，还有不同的数据类型。我希望您喜欢本文提供的解决方案，并将使用它们来改进您的开发过程。
