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

Underscore.js是一个JavaScript库，提供了许多有用的函数，即使在不使用任何内置对象的情况下，也可以极大地帮助您进行编程，例如映射，过滤，调用等。

当我们需要提取给定属性的列表时，使用_.pluck()函数。就像我们必须找出所有学生的姓名一样，我们可以简单地将_.pluck()函数应用于所有学生的详细信息。它将仅从所有stuf = dents的细节中提取名称并显示它。这样形成的列表将仅是名称数组。

用法:

_.pluck(list, propertyName)

参数：它有两个参数：

List
Property Name:这是我们需要聚合内容的属性。

返回值：
返回的值是我们需要提取的该属性详细信息的数组。该数组将包含元素，其顺序与列表中的顺序相同。

从_.pluck function()中提取数字属性：

<html> 
   
<head> 
    <script src =  
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js" > 
    </script> 
</head> 
   
<body> 
    <script type="text/javascript"> 
          var list = [{name:'jack', age:14}, {name:'jill', age:15}, 
                             {name:'humpty', age:16}]; 
          console.log(_.pluck(list, 'age')); 
    </script> 
</body> 
   
</html>

输出：

从_.invoke()函数中提取字符串属性：
首先，定义所有元素都具有完整细节的数组。然后根据需要分隔详细信息的基础传递属性。像这里一样，使用“ category”属性。因此，列表中的所有类别的类别将显示为新数组。

<!-- Write HTML code here -->
<html> 
   
<head> 
    <script src =  
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js" > 
    </script> 
</head> 
   
<body> 
    <script type="text/javascript"> 
         var goal  = [ 
        { 
            "category":"other", 
            "title":"harry University", 
            "value":50000, 
            "id":"1" 
        }, 
        { 
            "category":"traveling", 
            "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(_.pluck(goal, 'category')); 
    </script> 
</body> 
   
</html>

输出：

从_.invoke()函数中提取“名称”属性：(最常用)
遵循相同的步骤，首先定义完整的数组，然后将数组名称及其属性传递给需要提取的属性。输出数组将包含列表中的所有名称。

<!-- Write HTML code here -->
<html> 
   
<head> 
    <script src =  
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js" > 
    </script> 
</head> 
   
<body> 
    <script type="text/javascript"> 
         var people = [ 
        {"name":"sakshi", "hasLong":"false"}, 
        {"name":"aishwarya", "hasLong":"true"}, 
        {"name":"akansha", "hasLong":"true"}, 
        {"name":"preeti", "hasLong":"true"} 
    ] 
     console.log(_.pluck(people, 'name');); 
    </script> 
</body> 
   
</html>

输出：

当属性重复时提取属性：
创建一个包含属性的数组，该属性对于至少两个元素具有相同的值。然后，如果我们将数组和该属性传递给_.pluck()函数，则该属性将显示所有可能的属性详细信息，即使它是否正在重新捕获也是如此。

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

输出：

注意：这些命令在Google控制台或firefox中将无法使用，因为这些命令需要添加未添加的其他文件。
因此，将以下链接添加到您的HTML文件，然后运行它们。

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

一个例子如下所示：

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

相关用法

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