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

Underscore.js 是一個 JavaScript 庫，它提供了許多有用的函數，即使不使用任何內置對象，也能在很大程度上幫助編程，例如映射、過濾器、調用等。

當我們需要提取給定屬性的列表時，使用 _.pluck() 函數。就像我們必須找出所有學生的姓名一樣，那麽我們可以簡單地將 _.pluck() 函數應用於所有學生的詳細信息。它隻會從所有 stuf=dents 的詳細信息中提取名稱並顯示它。由此形成的列表將隻是一個名稱數組。

用法:

_.pluck(list, propertyName)

參數：它需要兩個參數：

List
Property Name:這是我們需要聚合內容的屬性。

返回值：
返回的值是我們需要提取的該屬性詳細信息的數組。該數組將按照與列表中的順序相同的順序包含元素。

Extracting a number property from the _.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>

輸出：

Extracting a string property from the _.pluck() function:
首先，定義數組，其中所有元素都有完整的詳細信息。然後傳遞您需要根據其分離詳細信息的屬性。就像這裏使用‘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>

輸出：

Extracting the ‘name’ property from the _.invoke() function: (most common use)
按照與首先相同的步驟，定義完整的數組，然後傳遞數組名稱及其需要提取的屬性。輸出數組將包含列表中的所有名稱。


<!-- 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>

輸出：

Extracting property when that property repeats:
創建一個包含至少兩個元素具有相同值的屬性的數組。然後，如果我們將數組和該屬性傳遞給 _.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>

jQuery 是一個開源 JavaScript 庫，它簡化了 HTML/CSS 文檔之間的交互，它以其哲學而聞名“少寫，多做”.
你可以按照這個從頭開始學習 jQueryjQuery 教程和jQuery 示例.

相關用法

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