js數(shù)組常用方法

js數(shù)組常用方法有哪些呢？不知道的小伙伴來看看小編今天的分享吧!

數(shù)組是一種特殊的變量，它能夠一次存放一個以上的值。JS里的"數(shù)組"不是數(shù)組，而是對象。js里的數(shù)組和其他語言中的數(shù)組是不同的，實際它并不是數(shù)組，而是一種array-like 特性的對象。它只是把索引轉(zhuǎn)化成字符串，用作其屬性(鍵)。

1、filter（）

舉例：

我們想要得到這個列表中年齡小于或等于24歲的所有學(xué)生。我們需要使用filter方法來過濾掉所有大于 24 歲的學(xué)生。

輸出：
const students = [
 {name: "sam", age: 26, score: 80},
 {name: "john", age: 25, score: 86},
 {name: "dean", age: 20, score: 78},
 {name: "timothy", age: 18, score: 95},
 {name: "frank", age: 21, score: 67}
]
const filteredStudents = students.filter((students) => {
//this filter method just takes a single function, which is going to have one parameter of   student   which is every student/item in the array
// we'd need to return a true or false statement on whether or not we want to include them in the   new array
return students.age <= 24
//This line basically stashes all of the students whose ages are less than a 24 in the new   filteredStudents array
})
console.log(filteredStudents)
//
所做的就是為每個項目返回 true 或 false。如果為真，則將其添加到新數(shù)組中，如果為假，則不添加。它們實際上不會更改你正在過濾的底層對象，因此可以記錄學(xué)生數(shù)組，并且它仍然包含所有項目。在使用這些新數(shù)組方法創(chuàng)建新數(shù)組時，不必擔心更改舊數(shù)組。

2、map（）
舉例：

map（）允許你獲取一個數(shù)組并將其轉(zhuǎn)換為一個新數(shù)組。在這個中，新數(shù)組中的所有項目看起來都略有不同。如果我們想得到每個學(xué)生的名字。我們可以通過使用 map() 獲取名稱數(shù)組。

輸出：

const students = [
 {name: "sam", age: 26, score: 80},
 {name: "john", age: 25, score: 86},
 {name: "dean", age: 20, score: 78},
 {name: "timothy", age: 18, score: 95},
 {name: "frank", age: 21, score: 67}
]
const studentNames = students.map((students) => {
//the method takes a single function, with the students/items as a parameter
// here we just return what we want in the new array
return students.name
})
console.log(studentNames)
/*If we print out these student names,
console.log(studentNames)
we get a new array that is just full of all the different names of the students.*/
/******************/
這可以通過數(shù)組中的任何內(nèi)容來完成。例如，當你想要獲取一個對象，并且只獲取名稱或單個鍵，或者獲取一個數(shù)組并將其轉(zhuǎn)換為另一個數(shù)組時，該方法非常有用。此方法是 JavaScript 數(shù)組中最流行的方法之一。

3、find（）
此方法允許你在數(shù)組中查找單個對象。這是直截了當?shù)姆椒ā?/p>

假設(shè)我們想找到一個名叫 john 的學(xué)生。
const students = [
 {name: "sam", age: 26, score: 80},
 {name: "john", age: 25, score: 86},
 {name: "dean", age: 20, score: 78},
 {name: "timothy", age: 18, score: 95},
 {name: "frank", age: 21, score: 67}
]
const singleStudent = students.find((students) => {
return students.name === 'john'
})
console.log(singleStudent)
/*
 console.log(singleStudent) will give the everything associated with john in this example, I.e
  Object {
   age: 25,
   name: "john",
   score: 86
 }
*/
在這個方法中，邏輯是有一個 true 或 false 語句，它將返回第一個計算結(jié)果為 true 的數(shù)組項。
4、forEach（）
與其他方法不同， forEach() 實際上不返回任何內(nèi)容，因此不需要 return 語句。假設(shè)我們需要打印出 student 數(shù)組中所有學(xué)生的名字，可以這樣做：
const students = [
 {name: "sam", age: 26, score: 80},
 {name: "john", age: 25, score: 86},
 {name: "dean", age: 20, score: 78},
 {name: "timothy", age: 18, score: 95},
 {name: "frank", age: 21, score: 67}
]
students.forEach((students) => {
console.log(students.name)
})
/*
 the result is the name property printed out on the console line after line like so
 "sam"
 "john"
 "dean"
 "timothy"
 "frank"
*/
這將與 for 循環(huán)非常相似，但它將采用一個函數(shù)。因此，對于每個數(shù)組項，它將執(zhí)行函數(shù)內(nèi)的代碼塊。
這種方法只是使處理需要循環(huán)項目的數(shù)組變得更加容易，因為你不必像通常那樣寫出笨重而長的for循環(huán)語句。

5、some（）
這個方法與我們的大多數(shù)其他函數(shù)有點不同，它不是返回一個全新的數(shù)組，而是返回 true 或 false。所以我們可以檢查這個數(shù)組中是否有一些學(xué)生是未成年人。
const students = [
 {name: "sam", age: 26, score: 80},
 {name: "john", age: 25, score: 86},
 {name: "dean", age: 20, score: 78},
 {name: "timothy", age: 18, score: 95},
 {name: "frank", age: 21, score: 67}
]
const hasUnderageStudents = students.some((students) => {
return students.age < 18
})
console.log(hasUnderageStudents)
/*
 this will return false because there is no underage student in the array.
*/
因此，如果任何學(xué)生項目的年齡值低于 18，該函數(shù)將返回 true。該方法只是檢查數(shù)組中是否有任何內(nèi)容返回 true，如果是，則整個內(nèi)容返回 true。
6、every（）
此方法與 some() 非常相似，除了檢查至少一項以評估為真或假之外，它會檢查以確保每一項都符合給定的條件。
如果我使用 some() 代碼示例中使用的相同代碼。
const students = [
 {name: "sam", age: 26, score: 80},
 {name: "john", age: 25, score: 86},
 {name: "dean", age: 20, score: 78},
 {name: "timothy", age: 18, score: 95},
 {name: "frank", age: 21, score: 67}
]
const hasUnderageStudents = students.every((students) => {
return students.age < 18
})
console.log(hasUnderageStudents)
// this returns false because there are no ages below 18
如果我要將條件更改為每個項目評估為真的條件，則整個事情都會返回真。
const students = [
 {name: "sam", age: 26, score: 80},
 {name: "john", age: 25, score: 86},
 {name: "dean", age: 20, score: 78},
 {name: "timothy", age: 18, score: 95},
 {name: "frank", age: 21, score: 67}
]
const hasUnderageStudents = students.every((students) => {
return students.age < 40
})
console.log(hasUnderageStudents)
// this will return true because every single age property is below 40

7、reduce（）
此方法與所有其他方法完全不同，因為它實際上是對數(shù)組進行一些操作并返回所有這些不同操作的組合。
假設(shè)我想要學(xué)生數(shù)組中所有項目的總分，通常會進行 for 循環(huán)并每次都將分數(shù)相加，在循環(huán)結(jié)束時，將打印出總分。為了避免冗長的過程，你可以使用 reduce() 方法來執(zhí)行此操作。
簡化方法的語法與其他方法不同。它不是采用數(shù)組本身，而是采用一個數(shù)組和一個屬性，用于我們想要將所有內(nèi)容減少到和在我們的示例中的分數(shù)。除了函數(shù)之外，它還需要第二個參數(shù)，這將是你的起點，在我們的例子中，我們希望從零開始我們的總數(shù)。
const students = [
 {name: "sam", age: 26, score: 80},
 {name: "john", age: 25, score: 86},
 {name: "dean", age: 20, score: 78},
 {name: "timothy", age: 18, score: 95},
 {name: "frank", age: 21, score: 67}
]
const totalScore = students.reduce((currentTotal, students) => {
return students.score + currentTotal
}, 0)
console.log(totalScore)
在代碼讀取時，我們有 reduce() 方法，該方法對數(shù)組中的每一項運行一個函數(shù)。
該函數(shù)的第一個參數(shù)將是該數(shù)組的前一次迭代返回的任何內(nèi)容，第二個參數(shù)是數(shù)組中的實際項目。
currentTotal 將在第一次迭代時開始，使用我們作為 reduce() 方法的第二個參數(shù)傳入的任何內(nèi)容，在我們的例子中為零。
這個 reduce() 方法第一次運行，所以我們得到零和“sam”項。所以它只是做了80 加零并返回那個值，也就是 80。
該方法第二次運行時，返回值 80 成為當前總數(shù)，我們的下一項是 'john'，所以它計算了 86 加上我們當前的總數(shù) 80，即 166，并將其放回當前總數(shù)。它一直這樣做，直到我們到達數(shù)組中的最后一個項目，該項目將作為 totalScore 變量中的總數(shù)輸出。
這種方法有點混亂，但是，當你需要對數(shù)組中的所有項目進行某種累積操作時，它非常有用，例如，獲取所有項目的總價，每日股票價格等。

8、includes（）
此方法不接受函數(shù)作為參數(shù)。它需要一個參數(shù)。它通常用于不需要大量繁重操作的簡單數(shù)組中。假設(shè)你有一堆水果，
const Fruits = [ 'mango', 'apple', 'orange', 'pineapple', 'lemon']
contains() 方法實現(xiàn)的是一種簡單方法，是檢查某個水果是否在數(shù)組中。
const fruits = [ 'mango', 'apple', 'orange', 'pineapple', 'lemon']
const includesApple = fruits.includes('apple')
console.log(includesApple) // this will return true because 'apple' is one of the items inside the array.

以上就是小編今天的分享了，希望可以幫助到大家。

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:0731-84117792 E-MAIL:11247931@qq.com