您好,登錄后才能下訂單哦!
這篇“JavaScript數(shù)組操作技巧有哪些”文章的知識(shí)點(diǎn)大部分人都不太理解,所以小編給大家總結(jié)了以下內(nèi)容,內(nèi)容詳細(xì),步驟清晰,具有一定的借鑒價(jià)值,希望大家閱讀完這篇文章能有所收獲,下面我們一起來看看這篇“JavaScript數(shù)組操作技巧有哪些”文章吧。
這里只展示兩種可行的方法, 一種是實(shí)用.from()
方法, 第二種是實(shí)用擴(kuò)展運(yùn)算符...
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)
,并在其中傳遞三個(gè)參數(shù),這些參數(shù)指定了要在哪里開始修改,要更改多少個(gè)值以及新增加的值。
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"]
也許每個(gè)人都知道數(shù)組的.map()
方法,但是可以使用另一種方案來獲得相似的效果,并且代碼非常簡(jiǎn)潔。這里我們可用.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"]
您是否有一個(gè)包含所有元素的數(shù)組,但出于任何目的都需要對(duì)其進(jìn)行清理,并且不想一個(gè)一個(gè)地刪除元素?只需一行代碼即可完成。要清空數(shù)組,您需要將數(shù)組的長(zhǎng)度設(shè)置為0,僅此而已!
let fruits = ["banana", "apple", "orange", "watermelon", "apple", "orange", "grape", "apple"]; fruits.length = 0; console.log(fruits); // returns []
碰巧我們有一個(gè)數(shù)組,但是出于某種目的,我們需要一個(gè)具有此數(shù)據(jù)的對(duì)象,而將數(shù)組轉(zhuǎn)換為對(duì)象的最快方法是使用眾所周知的擴(kuò)展運(yùn)算符...
。
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”}
在某些情況下,當(dāng)我們創(chuàng)建一個(gè)數(shù)組時(shí),我們想用一些數(shù)據(jù)填充它,或者我們需要一個(gè)具有相同值的數(shù)組,在這種情況下,.fill()
方法提供了一種簡(jiǎn)單而干凈的解決方案。
let newArray = new Array(10).fill('1') console.log(newArray) // returns [“1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”]
除了使用.concat()
方法,我們也可以使用擴(kuò)展運(yùn)算符...
。
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 面試中面臨的最普遍的挑戰(zhàn)之一,因?yàn)樗故玖四闶欠窨梢允褂脭?shù)組方法以及你的邏輯是什么。
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
。現(xiàn)在,我們可以找到如何從數(shù)組中刪除此類值。為此,我們將使用.filter()方法。
var mixedArr = [0, “blue”, “”, NaN, 9, true, undefined, “white”, false]; var trueArr = mixedArr.filter(Boolean); console.log(trueArr); // returns [“blue”, 9, true, “white”]
有時(shí)我們需要從數(shù)組中隨機(jī)選擇一個(gè)值。為了以簡(jiǎn)單,快速和簡(jiǎn)短的方式創(chuàng)建它并保持我們的代碼整潔,我們可以根據(jù)數(shù)組長(zhǎng)度獲取隨機(jī)索引號(hào)。讓我們看一下代碼:
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 中,有一個(gè)有趣的方法,它允許查找給定元素的最后一次出現(xiàn)的索引。例如,如果我們的數(shù)組有重復(fù)的值,我們可以找到它最后一次出現(xiàn)的位置。讓我們看一下代碼示例:
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
以上就是關(guān)于“JavaScript數(shù)組操作技巧有哪些”這篇文章的內(nèi)容,相信大家都有了一定的了解,希望小編分享的內(nèi)容對(duì)大家有幫助,若想了解更多相關(guān)的知識(shí)內(nèi)容,請(qǐng)關(guān)注億速云行業(yè)資訊頻道。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。