如何在 JavaScript 中統計陣列中重複名稱出現的次數?
JavaScript 中的陣列是一組儲存在相鄰記憶體位置的相同型別元素,並且可以使用索引到特殊識別符號的索引分別引用每個元素。
讓我們考慮一個包含重複名稱出現的陣列。陣列如下所示:
var details = [
{
studentName: "John",
studentAge: 23
},
{
studentName: "David",
studentAge: 24
},
{
studentName: "David",
studentAge: 20
}
]
現在我們將計算陣列中重複名稱出現的次數。我們為此使用reduce()概念。結果如下:
John: 1 David: 2
讓我們深入瞭解本文,以瞭解更多關於如何在陣列中統計重複名稱出現次數的資訊。
使用 reduce()
reduce()方法傳入先前元素計算的返回值,並依次對陣列的每個元素執行使用者提供的“reducer”回撥函式。在整個陣列上執行 reducer 會產生一個單一的值作為最終結果。
語法
以下是reduce()的語法:
array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
為了更好地理解如何在陣列中統計重複名稱出現的次數,讓我們看看以下示例。
示例
在下面的示例中,我們正在執行一個指令碼以及一個reduce()來列印重複名稱出現的次數。
<!DOCTYPE html>
<html>
<body>
<script>
var array = [10, 22, 10, 25, 10, 67, 10, 68];
var search = 10;
var count = array.reduce(function(n, val) {
return n + (val === search);
}, 0);
document.write(count);
</script>
</body>
</html>
當指令碼執行時,它將在網頁上生成一個包含數字“4”的輸出,這是指令碼中用於計數的值出現的次數。
示例
執行以下操作以檢視如何在獲取重複名稱出現次數的計數中使用reduce()。
<!DOCTYPE html>
<html>
<body>
<script>
var details = [{
studentName: "John",
studentAge: 23
}, {
studentName: "David",
studentAge: 24
}, {
studentName: "John",
studentAge: 21
}, {
studentName: "John",
studentAge: 25
}, {
studentName: "Bob",
studentAge: 22
}, {
studentName: "David",
studentAge: 20
}]
var output = Object.values(details.reduce((obj, {
studentName
}) => {
if (obj[studentName] === undefined) obj[studentName] = {
studentName: studentName,
occurrences: 1
};
else obj[studentName].occurrences++;
return obj;
}, {}));
document.write(JSON.stringify(output));
</script>
</body>
</html>
執行上述指令碼後,輸出視窗將彈出,顯示由執行指令碼觸發的事件導致的名稱出現次數的計數。
讓我們再看幾個例子。
示例
考慮以下示例,這裡我們宣告一個儲存空物件的變數,並啟動一個迴圈來迭代陣列並列印輸出。
<!DOCTYPE html>
<html>
<body>
<script>
const array = ['ab', 'bc', 'ab', 'bc', 'cb'];
const count = {};
for (const element of array) {
if (count[element]) {
count[element] += 1;
} else {
count[element] = 1;
}
}
document.write(JSON.stringify(count));
</script>
</body>
</html>
當指令碼執行時,事件被觸發並提供重複元素出現的次數以及網頁上的陣列。
示例
讓我們看看下面的例子,這裡我們使用 foreach 迭代陣列並將出現次數儲存在另一個變數中。
<!DOCTYPE html>
<html>
<body>
<script>
var array = [{
"car": "rx100",
"color": "black"
}, {
"car": "bmw",
"color": "grey"
}, {
"car": "rx100",
"color": "black"
}, ];
let b = {};
array.forEach(element => {
b[element.car] = (b[element.car] || 0) + 1;
})
document.write(JSON.stringify(b));
</script>
</body>
</html>
執行上述指令碼後,事件被觸發並在網頁上顯示陣列及其出現次數。
廣告
資料結構
網路
關係資料庫管理系統
作業系統
Java
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP