Sunday, November 17, 2024
Google search engine
HomeLanguagesJavascriptBackbone.js pluck Collection

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>
        type="text/javascript"></script>
    <script src=
        type="text/javascript"></script>
    <script src=
        type="text/javascript"></script>
</head>
  
<body>
    <h1 style="color: green;">
        neveropen
    </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:

Backbone.js pluck Collection

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>
        type="text/javascript"></script>
    <script src=
        type="text/javascript"></script>
    <script src=
        type="text/javascript"></script>
</head>
  
<body>
    <h1 style="color: green;">
        neveropen
    </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:

Backbone.js pluck Collection

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

Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, neveropen Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we’ve already empowered, and we’re here to do the same for you. Don’t miss out – check it out now!

RELATED ARTICLES

Most Popular

Recent Comments