underscore.js _.countBy用法及代碼示例

Underscore.js _.countBy()函數用於將列表排序為組並返回每組中對象數量的計數。它的工作原理是將每個元素的值與另一個元素進行匹配。如果它們匹配，則一個集合的計數增加 1，否則具有該值的另一個集合/組的計數增加 1。它還可以傳遞一個基於誰將收集元素的函數並增加每個組的計數。它既可以根據數字進行匹配，也可以根據字符串進行匹配。

用法:

_.countBy(list, iterate, [context]);

參數：

列表：該參數用於保存項目列表。
迭代：該參數用於保存測試條件。
語境：需要顯示的文字內容。

返回值：

它將集合作為不同的數組返回。

通過Math.ceil()函數到 _.countBy() 函數：

_.countBy() 函數從列表中逐一獲取元素並將其傳遞給此處提到的另一個函數。這裏，該函數獲取每個數字的 ceil 並返回其值。所以，數組的所有值在取完ceil之後就被一一計數，然後根據是否相同或不同來計數。

例子：此示例顯示通過傳遞 Math.ceil() 函數來使用 _.countBy() 函數。

html


<html>
<head>
    <script type="text/javascript" src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore.js">
    </script>
</head>
<body>
    <script type="text/javascript">
        console.log(_.countBy([2.7, 3.4, 6.6, 1.2, 2.0, 2.4],
            function (num) { return Math.ceil(num); }));
    </script>
</body>
</html>

輸出：

在 _.countBy() 函數中使用 length()：

將數組元素傳遞給 countBy() 函數。然後，找出每個元素的長度並收集長度相同的元素。最後，在左側顯示每個集合的數量及其各自的長度。

例子：此示例顯示通過傳遞 length() 函數來使用 _.countBy() 函數。

html


<html>
<head>
    <script type="text/javascript" src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore.js">
    </script>
</head>
<body>
    <script type="text/javascript">
        console.log(_.countBy(['HTML', 'CSS3', 'JS', 'PHP'], 'length'));
    </script>
</body>
</html>

輸出：

使用 _.countBy() 函數中傳遞的數組的一個屬性：

首先，聲明數組(這裏數組是‘arr’)。選擇一個需要計數的條件，如‘prop3’。那麽‘prop3’中具有相同值的元素將被分組到1個集合中。最終結果將包含左側的 prop3 以及右側的計數。就像這裏的 prop3 一樣，“Geeks” 出現了兩次，所以它的計數將為 2。Console.log 最終答案。

例子：此示例顯示 _.countBy() 函數的使用。

html


<html>
<head>
    <script type="text/javascript" src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore.js">
    </script>
</head>
<body>
    <script type="text/javascript">
        let arr = [
            { prop1: "10", prop2: "07", prop3: "Geeks" },
            { prop1: "12", prop2: "86", prop3: "for" },
            { prop1: "11", prop2: "58", prop3: "Geeks" }
        ];
        console.log(_.countBy(arr, 'prop3'));
    </script>
</body>
</html>

輸出：

將 ‘date’ 作為數組的屬性一起傳遞給 _.countBy() 函數：

首先定義一個具有一個屬性的數組為‘date’，格式為“dd-mm-yy”。然後將數組和 ‘date’ 屬性傳遞給 _.countBy() 函數。具有相同日期的元素將被分組為一個集合，然後每組的計數將顯示在結果中。

例子：此示例顯示通過將 “date” 作為數組的屬性傳遞來使用 _.countBy() 函數。

html


<html>
<head>
    <script type="text/javascript" src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore.js">
    </script>
</head>
<body>
    <script type="text/javascript">
        let orders = [
            { date: "30-60-90 Day", Name: "Kim", amount: 415 },
            { date: "30-60-90 Day", Name: "Kelly", amount: 175 },
            { date: "30 Day", Name: "Shelly", amount: 400 },
            { date: "30 Day", Name: "Sarvesh", amount: 180 }
        ];
        console.log(_.countBy(orders, "date"));
    </script>
</body>
</html>

輸出：

注意：這些命令在 Google Console 或 Firefox 中不起作用，因為需要添加這些他們沒有添加的附加文件。因此，將給定的鏈接添加到您的 HTML 文件中，然後運行它們。

<script type="text/javascript" src =
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
</script>

相關用法

注：本文由純淨天空篩選整理自Sakshi98大神的英文原創作品 Underscore.js _.countBy Function。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。