在 JavaScript 中計算陣列元素的出現次數
- 在 JavaScript 中計算陣列元素出現次數的基於物件的方法
-
在 JavaScript 中使用
array.prototype.reduce計算陣列元素的出現次數 - 使用自定義函式計算 JavaScript 中陣列元素的出現次數
- 在 JavaScript 中使用 Lodash 計算陣列元素的出現次數
本教程將教你如何計算陣列中元素的出現次數。我們將向你展示如何使用 Objects、Array.prototype.reduce、自定義函式和 Lodash 來實現。
在 JavaScript 中計算陣列元素出現次數的基於物件的方法
你可以通過建立物件來計算元素陣列的出現次數。之後，使用 for...of 迴圈將陣列元素新增到物件中。
在 for...of 迴圈中，你檢查元素是否已經在物件中；如果是這樣，則將其值加一。否則，它是你新增到物件的新元素。
迴圈重複，直到將陣列的所有元素及其頻率新增到物件。這意味著物件中的屬性是陣列中的一個元素，它的值是它出現的次數。
因此，你可以使用 object[property] 檢查元素是否出現，其中 property 是新增到 object 的陣列元素。
結果將是它在陣列中的出現。
const myArray = [3, 2, 3, 3, 5, 6, 5, 5, 8, 4, 4, 7, 7, 7];
const counts = {};
for (const num of myArray) {
counts[num] = counts[num] ? counts[num] + 1 : 1;
}
console.log(
counts[2], counts[3], counts[4], counts[5], counts[6], counts[7],
counts[8]);
輸出：
1 3 2 3 1 3 1
在 JavaScript 中使用 array.prototype.reduce 計算陣列元素的出現次數
Array.prototype.reduce 有兩個引數：一個回撥函式和一個初始值。將初始值設定為 Object 時，可以將該物件的屬性設定為陣列元素。
所以屬性值將是元素的出現次數。為此，回撥函式的第一次迭代將陣列元素新增為物件的屬性。
同時，它將它們的值設定為 1。
因此，後續迭代將檢查屬性值是否存在。如果為真，它將加一。
否則，它是一個新元素，將其值設定為 1。最後，該物件將包含元素陣列及其值作為鍵值對。
let myArray =
[2, 2, 3, 5, 6, 2, 1, 1, 1, 4, 5,
6].reduce(function(accumulator, currentValue) {
return accumulator[currentValue] ? ++accumulator[currentValue] :
accumulator[currentValue] = 1,
accumulator
}, {});
console.log(myArray);
輸出：
Object { 1: 3, 2: 3, 3: 1, 4: 1, 5: 2, 6: 2 }
使用自定義函式計算 JavaScript 中陣列元素的出現次數
你可以實現一個自定義函式，該函式將一個陣列作為引數並返回兩個陣列。第一個將包含你作為引數傳遞給函式的陣列的唯一元素。
而第二個將包含元素的出現次數。
這是計算陣列元素出現次數的函式演算法。
- 初始化兩個名為
A和B的空陣列。 - 設定一個變數以在遍歷陣列時跟蹤前一個元素。
- 克隆函式作為引數接收的陣列。
- 對克隆的陣列進行排序。
- 使用
for...of迴圈遍歷克隆的陣列。
5.1 如果陣列元素不等於前一個元素。
5.1.1 將元素推入陣列A。
5.1.2 將初始值 1 壓入陣列B。
5.2 其他
5.2.1 增加陣列B中的值。
5.2.2 將前一個元素設定為當前元素。 - 返回陣列
A和陣列B。
下面的程式碼是這個演算法的實現。
let mArray = [2, 3, 4, 1, 2, 2, 5, 3, 7, 8, 1, 1, 6];
function countOccurrences(array) {
let arrayElements = [], occurrences = [], cloneOriginalArray = [...array],
previousElement;
// Sort the cloned array
cloneOriginalArray.sort();
for (let element of cloneOriginalArray) {
if (element !== previousElement) { // That means it's a new element
arrayElements.push(element); // push it into the array
occurrences.push(1); // push its occurence in the occurrence array
} else
++occurrences[occurrences.length - 1]; // Not a new element, so increment
// its occurrence
previousElement = element;
}
return [arrayElements, occurrences];
}
const arrayAndItsOccurrences = countOccurrences(mArray);
console.log(
'[' + arrayAndItsOccurrences[0] + ']',
'[' + arrayAndItsOccurrences[1] + ']');
輸出：
[1,2,3,4,5,6,7,8] [3,3,2,1,1,1,1,1]
在 JavaScript 中使用 Lodash 計算陣列元素的出現次數
Lodash 有一個 .countBy 方法，它接受一個陣列並返回一個物件。此物件包含陣列中的元素及其作為鍵值對的值。
<body>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js"
integrity="sha512-WFN04846sdKMIP5LKNphMaWzU7YpMyCU245etK3g/2ARYbPK9Ub18eG+ljU96qKRCWh+quCY7yefSmlkQw1ANQ==" crossorigin="anonymous"
referrerpolicy="no-referrer"
>
</script>
<script>
let loArray = [2,2,3,3,1,1,5,3,4,4,8,3,2,9];
let lodash = _;
let occurrences = _.countBy(loArray);
console.log(occurrences)
</script>
</body>
輸出：
Object { 1: 2, 2: 3, 3: 4, 4: 2, 5: 1, 8: 1, 9: 1 }
Habdul Hazeez is a technical writer with amazing research skills. He can connect the dots, and make sense of data that are scattered across different media.
LinkedIn