数组是JavaScript中最流行的数据结构之一,因为它们用于存储数据。 另外,阵列为处理这些数据提供了许多机会。 理解对于那些刚开始学习JavaScript的人来说,数组是最基本的主题之一,在本文中,我想向您介绍一些您可能不知道的有用技巧。 让我们开始吧。
1.如何仅在数组中保留唯一值
对于Java开发人员的职位,这是一个非常受欢迎的问题。 这是解决此问题的快速简便的方法。 首先,您需要获取数组的唯一值,为此,您可以使用
new Set()
(
大约Re .: Set数据结构仅存储唯一值 )。 接下来,您需要将Set数据结构转换为数组。 我想向您介绍两种方法:第一种-使用
from()
方法,第二种-使用spread(
"…"
)运算符。
const fruits = ['banana', 'apple', 'orange', 'watermelon', 'apple', 'orange', 'grape', 'apple'];
容易吧?
2.如何替换数组中的值
在某些情况下,您需要用其他值替换数组中的值。 有一个您可能还不了解的好方法
splice(start, value to remove, values to add)
方法,其中
start
是我们要从中删除数组元素的索引号,要删除的
value to remove
是元素数我们要删除的元素,要
values to add
是我们要在已删除元素的位置插入的元素:
const fruits = ['banana', 'apple', 'orange', 'watermelon', 'apple', 'orange', 'grape', 'apple']; fruits.splice(0, 2, 'potato', 'tomato'); console.log(fruits);
3.如何在不使用map()
方法的情况下转换数组
也许每个人都知道
map()
数组方法,但是还有另一种解决方案可以用来获得相似的效果和简洁的代码。 为此,我们可以使用
from()
方法:
const 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 }, ] const friendsNames = Array.from(friends, ({name}) => name); console.log(friendsNames);
4.如何快速清除阵列
例如,我们有一个包含许多元素的数组。 我们需要清理它(无论出于什么目的),而我们不想一个接一个地删除元素。 使用一行代码非常简单。 要清除数组,我们需要将数组的长度设置为0,就这样!
const fruits = ['banana', 'apple', 'orange', 'watermelon', 'apple', 'orange', 'grape', 'apple']; fruits.length = 0; console.log(fruits);
5.如何将数组转换为对象
发生这种情况:我们有一个数组,但是我们需要一个带有该数据的对象(同样,无论出于何种目的),而将数组转换为对象的最快方法是使用spread(
"..."
)运算符:
const fruits = ['banana', 'apple', 'orange', 'watermelon', 'apple', 'orange', 'grape', 'apple']; const fruitsObj = { ...fruits }; console.log(fruitsObj);
6.如何用相同的值填充数组
当我们要创建一个数组并用一些值填充它,或者我们需要一个具有相同值的数组时,会有不同的情况。 用于此类任务的
fill()
方法是一个很好的解决方案:
const newArray = new Array(10).fill('1'); console.log(newArray);
7.如何合并两个以上的数组
您知道如何不使用
concat()
方法将数组组合为一个吗? 有一种简单的方法可以用一行代码将任意数量的数组组合成一个数组。 您可能已经理解,在处理数组时,spread(
"..."
)运算符是非常有用的工具,在这种情况下:
const fruits = ['apple', 'banana', 'orange']; const meat = ['poultry', 'beef', 'fish']; const vegetables = ['potato', 'tomato', 'cucumber']; const food = [...fruits, ...meat, ...vegetables]; console.log(food);
8.如何找到两个数组的交集
您可以在任何JavaScript采访中都可以完成此任务,因为它的解决方案显示了您对数组方法的知识以及您的想法。 为了找到两个数组的公共值,我们将使用本文前面讨论的方法之一,以确保所检查的数组中的值不重复。 另外,我们将使用
filter()
和
includes()
方法。 结果,我们得到一个数组,其中包含在两个数组中表示的元素:
const numOne = [0, 2, 4, 6, 8, 8]; const numTwo = [1, 2, 3, 4, 5, 6]; const duplicatedValues = [...new Set(numOne)].filter(item => numTwo.includes(item)); console.log(duplicatedValues);
9.如何从数组中删除错误值
首先,让我们定义假值。 在Javascript中,错误值为:
false
,
0 ,
“” ,
null
,
NaN
和
undefined
。 现在我们可以弄清楚如何从数组中删除这些值。 为此,我们需要
filter()
方法:
const mixedArr = [0, 'blue', '', NaN, 9, true, undefined, 'white', false]; const trueArr = mixedArr.filter(Boolean); console.log(trueArr);
10.如何获得随机数组值
有时我们需要选择一个随机数组值。 为了使解决方案简单,简短和快速,我们可以根据数组的长度获得一个随机索引号。 看一下这个例子:
const colors = ['blue', 'white', 'green', 'navy', 'pink', 'purple', 'orange', 'yellow', 'black', 'brown']; const randomColor = colors[(Math.floor(Math.random() * (colors.length)))]; console.log(randomColor);
11.如何沿相反方向扩展数组
当我们需要“翻转”我们的数组时,不需要通过复杂的循环和函数来创建它,因为有一个简单的
reverse()
数组方法可以为我们完成所有这些工作,并且只需一行代码,我们就可以“翻转”我们的数组:
const colors = ['blue', 'white', 'green', 'navy', 'pink', 'purple', 'orange', 'yellow', 'black', 'brown']; const reversedColors = colors.reverse(); console.log(reversedColors);
12. lastIndexOf()
方法
JavaScript有一个有趣的
lastIndexOf(elem)
方法,可让您找到
elem
元素最后一次出现的索引。 例如,如果我们的数组有重复的值,我们可以找到其中最后一次出现的位置。 看下面的代码示例:
const nums = [1, 5, 2, 6, 3, 5, 2, 3, 6, 5, 2, 7]; const lastIndex = nums.lastIndexOf(5); console.log(lastIndex);
13.如何对数组中的所有值求和
采访中另一个关于JavaScript开发人员职位的热门问题。 如果您知道
reduce()
方法,则可以在一行代码中找到所有元素的总和:
const nums = [1, 5, 2, 6]; const sum = nums.reduce((x, y) => x + y); console.log(sum);
结论
在本文中,我向您介绍了13个有用的技巧,以帮助您编写简洁明了的代码。 另外,不要忘记,您可以在Javascript中使用许多不同的技巧,这些技巧不仅值得研究,还可以用于处理数组,还可以用于其他数据结构。 我希望您喜欢本文中介绍的解决方案,并使用它们来改进开发过程。
有一个不错的编写代码!