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

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


Underscore.js _.first()函数用于返回数组的第一个元素，即第零个索引处的数字。它通过在数组中传递变量 n 来返回 m 大小 (n < m) 的数组中的前 n 个元素。它是underscore.js 库的easy-to-use 函数，在处理数组元素时广泛使用。

用法:

_.first(array, [n]);

参数：

  • array:该参数用于保存元素数组。
  • variable:它告诉我们想要的元素数量。

返回值：

该函数返回元素数组。

将数组传递给 _.first function()：

._first() 函数将返回第一个元素及其传递的数组的所有属性。像这里一样，元素有 2 个属性：名称和年龄，因此最终结果将包含第一个元素的这两个属性，因为此处未传递变量 n。

例子：此示例显示将数组传递给 _.first() 函数。

html


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content=
"width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script type="text/javascript" src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore.js">
    </script>
    <script type="text/javascript">
        console.log(_.first([{ name: 'jack', age: 14 },
        { name: 'jill', age: 15 },
        { name: 'humpty', age: 16 }])); 
    </script>
</body>
</html>

输出：

将结构传递给 _.first() 函数：

._first() 函数将返回第一个元素及其传递的数组的所有属性，因为此处未传递变量 n。就像这里一样，每个元素都有四个属性：类别、标题、值和 id。因此，最终结果将包含第一个元素的所有这些属性。

例子：此示例显示将结构传递给 _.first() 函数。

html


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content=
"width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script type="text/javascript" src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
    </script>
    <script type="text/javascript">
        let goal = [
            {
                "category": "other",
                "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(_.first(goal)); 
    </script>
</body>
</html>

输出：

将一个具有 true/false 属性的数组传递给 _.first() 函数：

这将与上面两个示例完全相同。 false/true 属性只会显示在第一个元素中。这里，这个属性在逻辑上不会被使用。

例子：此示例显示将一个具有 true/false 属性的数组传递给 _.first() 函数。

html


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content=
"width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script type="text/javascript" src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
    </script>
    <script type="text/javascript">
        let people = [
            { "name": "sakshi", "hasLong": "false" },
            { "name": "aishwarya", "hasLong": "true" },
            { "name": "akansha", "hasLong": "true" },
            { "name": "preeti", "hasLong": "true" }
        ]
        console.log(_.first(people)); 
    </script>
</body>
</html>

输出： 将带有变量 n 的数组传递给 _.first() 函数：

如果有多个元素(第一个元素)，只需传递数字并得到结果。请记住，元素始终来自数组的开头。

例子：此示例显示将带有变量 n 的数组传递给 _.first() 函数。

html


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content=
"width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script type="text/javascript" src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js">
    </script>
    <script type="text/javascript">
        let users = [{ "num": "1" }, { "num": "2" },
        { "num": "3" }, { "num": "4" }, { "num": "5" }];
        console.log(_.first(users, 2)); 
    </script>
</body>
</html>

输出：



相关用法


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