这篇“JavaScript数组操作技巧有哪些”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“JavaScript数组操作技巧有哪些”文章吧。
这里只展示两种可行的方法, 一种是实用.from()
方法, 第二种是实用扩展运算符...
let fruits = ["banana", "apple", "orange", "watermelon", "apple", "orange", "grape", "apple"] // 第一种方法 let uniqueFruits = Array.from(new Set(fruits)) //第二种方法 let uniqueFruits2 = [...new Set(fruits)]
我们可用使用.splice(start, value to remove, valueToAdd)
,并在其中传递三个参数,这些参数指定了要在哪里开始修改,要更改多少个值以及新增加的值。
let fruits = ["banana", "apple", "orange", "watermelon", "apple", "orange", "grape", "apple"] fruits.splice(0, 2, "potato", "tomato") console.log(fruits) // returns ["potato", "tomato", "orange", "watermelon", "apple", "orange", "grape", "apple"]
也许每个人都知道数组的.map()
方法,但是可以使用另一种方案来获得相似的效果,并且代码非常简洁。这里我们可用.from()
方法。
let 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 }, ] let friendsNames = Array.from(friends, ({name}) => name) console.log(friendsNames) //returns ["John", "Peter", "Mark", "Maria", "Monica", "Martha"]
您是否有一个包含所有元素的数组,但出于任何目的都需要对其进行清理,并且不想一个一个地删除元素?只需一行代码即可完成。要清空数组,您需要将数组的长度设置为0,仅此而已!
let fruits = ["banana", "apple", "orange", "watermelon", "apple", "orange", "grape", "apple"]; fruits.length = 0; console.log(fruits); // returns []
碰巧我们有一个数组,但是出于某种目的,我们需要一个具有此数据的对象,而将数组转换为对象的最快方法是使用众所周知的扩展运算符...
。
let fruits = ["banana", "apple", "orange", "watermelon"]; let fruitsObj = {...fruits}; console.log(fruitsObj) // returns {0: “banana”, 1: “apple”, 2: “orange”, 3: “watermelon”, 4: “apple”, 5: “orange”, 6: “grape”, 7: “apple”}
在某些情况下,当我们创建一个数组时,我们想用一些数据填充它,或者我们需要一个具有相同值的数组,在这种情况下,.fill()
方法提供了一种简单而干净的解决方案。
let newArray = new Array(10).fill('1') console.log(newArray) // returns [“1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”]
除了使用.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”]
这也是您在任何 JavaScript 面试中面临的最普遍的挑战之一,因为它展示了你是否可以使用数组方法以及你的逻辑是什么。
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]
首先,让我们定义虚值。在 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”]
有时我们需要从数组中随机选择一个值。为了以简单,快速和简短的方式创建它并保持我们的代码整洁,我们可以根据数组长度获取随机索引号。让我们看一下代码:
var colors = [“blue”, “white”, “green”, “navy”, “pink”, “purple”, “orange”, “yellow”, “black”, “brown”]; var randomColor = colors[(Math.floor(Math.random() * (color.length)))]
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”]
在 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
var nums = [1, 5, 2, 6]; var sum = nums.reduce((x, y) => x + y); console.log(sum); // returns 14
以上就是关于“JavaScript数组操作技巧有哪些”这篇文章的内容,相信大家都有了一定的了解,希望小编分享的内容对大家有帮助,若想了解更多相关的知识内容,请关注亿速云行业资讯频道。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。