Backbone.js pluck Collection

The Backbone.js pluck Collection is used to Pluck an attribute from each model in the collection. This method is equivalent to the map function and returns a single attribute value from each model. This method takes the attribute name as a parameter that has to get from the model.

Syntax:

collection.pluck( attr );

Parameter:

attr: It is the attribute name of the model which has to retrieve from the model.

Example 1: In this example, we will illustrate the Backbone.js pluck Collection. Here we will pluck the title attribute of each Model.

HTML

<!DOCTYPE html>
<html>

<head>
    <title>BackboneJS pluck collection</title>
    <script src="https://code.jquery.com/jquery-2.1.3.min.js"
        type="text/javascript"></script>
    <script src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js"
        type="text/javascript"></script>
    <script src=
"https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.2.2/backbone-min.js"
        type="text/javascript"></script>
</head>

<body>
    <h1 style="color: green;">
        GeeksforGeeks
    </h1>

    <h3>BackboneJS pluck collection</h3>
    
    <script type="text/javascript">
        var Book = Backbone.Model.extend();

        var books = Backbone.Collection.extend({
            model: Book,
        });

        var Library = new books();

        var b1 = new Book({ 
            title: "Ram", 
            Author: "Amish Tripathi", 
            vol: 1 
        });
        
        var b2 = new Book({ 
            title: "Lolita", 
            Author: "Vladimir Nabokov", 
            vow: 2 
        });
        
        Library.add(b1);
        Library.add(b2);

        var temp = Library.pluck("title");

        document.write("Title of Books are : <br> ");
        for (let x of temp) document.write(`${x}, <br>`);
    </script>
</body>

</html>

Output:

Example 2: In this example, we will pluck all the attributes of the Model and see the value of the attributes.

HTML

<!DOCTYPE html>
<html>

<head>
    <title>BackboneJS pluck collection</title>
    <script src="https://code.jquery.com/jquery-2.1.3.min.js"
        type="text/javascript"></script>
    <script src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js"
        type="text/javascript"></script>
    <script src=
"https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.2.2/backbone-min.js"
        type="text/javascript"></script>
</head>

<body>
    <h1 style="color: green;">
        GeeksforGeeks
    </h1>

    <h3>BackboneJS pluck collection</h3>
    
    <script type="text/javascript">
        var Book = Backbone.Model.extend();

        var books = Backbone.Collection.extend({
            model: Book,
        });

        var Library = new books();

        var b1 = new Book({ 
            title: "Ram", 
            Author: "Amish Tripathi", 
            vol: 1 
        });
        
        var b2 = new Book({ 
            title: "Lolita", 
            Author: "Vladimir Nabokov", 
            vol: 2 
        });
        
        var b3 = new Book({ 
            title: "The Palace of Illusion", 
            Author: "Chitra Banerjee", 
            vol: 1 
        });
        
        var b4 = new Book({ 
            title: "Wings of Fire", 
            Author: "A. P. J. Abdul kalam", 
            vol: 1 
        });

        Library.add(b1);
        Library.add(b2);
        Library.add(b3);
        Library.add(b4);

        var temp = Library.pluck("title");
        var temp1 = Library.pluck("Author");
        var temp2 = Library.pluck("vol");

        document.write("Details of Books are : <br> ");
        for (let x = 0; x < temp.length; x++) 
            document.write(`${temp[x]} volume ${temp2[x]} 
                is write by ${temp1[x]},<br>`);
    </script>
</body>

</html>

Output:

Reference: https://backbonejs.org/#Collection-pluck

Backbone.js pluck Collection

Explore