当前位置: 首页>>代码示例 >>用法及示例精选 >>正文

underscore.js _.where()用法及代码示例


Underscore.js _.where()函数用于查找所有符合搜索条件的元素。假设要查找类的所有学生详细信息，然后将 _.where() 函数应用于所有部分的列表，并将条件作为部分名称传递。因此，将显示该特定部分中所有学生的姓名。

用法: 

_.where( list, [predicate], [context] );

参数：

  • 列表：该参数用于保存数据列表。
  • 谓词：该参数用于保存测试条件。
  • 语境：需要显示的文字。

返回值：

此函数返回一个数组，其中包含与给定条件匹配的所有元素及其完整详细信息。

_.findWhere() 和 _.where() 函数的区别：这两个函数都采用数组名称和要匹配的属性，但 _.where() 函数显示所有匹配项，而 _.findWhere) 函数仅匹配第一个匹配项。

将数组传递给 _.where() 函数：

._where() 函数从列表中一一获取元素，并匹配元素详细信息上的指定条件。它将检查“hasLong”属性中包含‘true’的元素。遍历并检查完所有元素后，_.where()函数结束。将显示具有此属性的所有元素的数组。

例子：在此示例中，我们将一个数组传递给 _.where() 函数。

HTML


<html>
<head>
    <title>_.where() function</title>
    <script type="text/javascript" src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
    </script>
    <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 people = [
            { "name": "sakshi", "hasLong": "false" },
            { "name": "aishwarya", "hasLong": "true" },
            { "name": "akansha", "hasLong": "true" },
            { "name": "preeti", "hasLong": "true" }
        ]
        console.log(_.where(people, { hasLong: "true" }));
    </script>
</body>
</html>

输出：

将具有多个属性的元素列表传递给 _.where() 函数：

首先，声明包含每个元素的所有属性的整个列表，然后将数组名称与属性一起传递，在此基础上需要将元素匹配到 _.where() 函数。它将遍历整个列表并显示符合给定条件的所有元素的详细信息。

例子：在此示例中，我们将具有多个属性的元素列表传递给 _.where() 函数。

HTML


<html>
<head>
    <title>_.where() function</title>
    <script type="text/javascript" src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
    </script>
    <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 goal = [
            {
                "category": "education",
                "title": "harry University",
                "value": 50000,
                "id": "1"
            },
            {
                "category": "travelling",
                "title": "tommy University",
                "value": 50000,
                "id": "2"
            },
            {
                "category": "education",
                "title": "jerry University",
                "value": 50000,
                "id": "3"
            },
            {
                "category": "business",
                "title": "Charlie University",
                "value": 50000,
                "id": "4"
            }
        ]
        console.log(_.where(goal, { category: "education" }));
    </script>
</body>
</html>

输出：

将一个以数字作为其属性之一的数组传递给 _.where() 函数：

声明数组(这里数组是‘users’)，然后选择一个需要检查的条件，例如‘id’，其详细信息中有数字，最后console.log最终答案。最终输出将包含所有匹配的元素。

例子：在此示例中，我们将一个以数字作为其属性之一的数组传递给 _.where() 函数。

HTML


<html>
<head>
    <title>_.where() function</title>
    <script type="text/javascript" src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
    </script>
    <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 users = [{ id: 1, name: "harry" },
        { id: 2, name: "jerry" },
        { id: 2, name: "jack" }];
        console.log(_.where(users, { id: 2 }));
    </script>
</body>
</html>

输出：

_.where() 函数与 _.findWhere() 函数相同：

在某些条件下，_.where() 函数也可以用作 _.findWhere() 函数。就像数组中只有一个这样的元素与给定条件匹配一样。此处的输出将是一个仅包含一个元素的数组。

例子：在此示例中，我们将 _.where() 函数实现为 _.findWhere() 函数。

HTML


<html>
<head>
    <title>_.where() function</title>
    <script type="text/javascript" src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
    </script>
    <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 studentArray = [
            { name: "Sam", score: 34 },
            { name: "Johny", score: 31 },
            { name: "Smithy", score: 23 },
            { name: "Rahul", score: 39 },
        ];
        console.log("student with score 23: ", 
        _.where(studentArray, { 'score': 23 }));
    </script>
</body>
</html>

输出：



相关用法


注：本文由纯净天空筛选整理自Sakshi98大神的英文原创作品 Underscore.js _.where() Function。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。