Saturday, December 28, 2024
Google search engine
HomeLanguagesJavascriptBackbone.js pop Collection

Backbone.js pop Collection

In this article, we will discuss pop collection The Backbone.js pop collection is used to remove a model or an array of models from the given collection. It is similar to the remove method.

Syntax:

collection.pop(models,options)

Parameters: It will take two parameters.

  • models: this is the first parameter that is used to specify the names of the instances, 
  • options: this parameter takes the model type which will be removed from the given collection.

Example 1: In this example, we will create a model Food and remove food1 using pop.

HTML




<!DOCTYPE html>
<html>
 
<head>
            type="text/javascript"></script>
    <script src=
            type="text/javascript"></script>
    <script src=
        type="text/javascript"></script>
    <script type="text/javascript"
         //'Food' is a model and that contains the
         //default value for the  model 
         var Food = Backbone.Model.extend({ 
            defaults: { 
               food_name: "Butter", 
               food_region:"Hyderabad" 
            
         }); 
   
         // 'FoodCollection' is a collection instance and
         // 'Food' is specified by overriding the 'model' property 
         var FoodCollection = Backbone.Collection.extend({ 
            model: Food 
         }); 
   
         // "food1" and "food2" are created for the model "Food" 
         var food1 = new Food({name: "Icecream",  country:"Hyderabad"}); 
         var food2 = new Food({name: "cake/chocos",  country:"Guntur"}); 
   
         // add() method adds the models 'food1' and 'food2'
         // to the collection instance 'final' 
         var final = new FoodCollection(); 
         final.add([food1,food2]); 
   
         // get the count of total food using length 
         document.write('Actual Food Count : ' + final.length); 
         document.write("<br>"); 
   
         // remove food1 model using pop 
         final.pop([food1]); 
         document.write('Popped Food Count : ' + final.length); 
      </script
</head>
 
<body></body>
 
</html>


Output:

Actual Food Count : 2
Popped Food Count : 1

Example 2: In this example, we will create a model Food and remove food1 and food3 using pop.

HTML




<!DOCTYPE html>
<html>
 
<head>
            type="text/javascript"></script>
    <script src=
        type="text/javascript"></script>
    <script src=
        type="text/javascript"></script>
    <script type="text/javascript"
         //'Food' is a model and that contains the  default value for the  model 
         var Food = Backbone.Model.extend({ 
            defaults: { 
               food_name: "Butter", 
               food_region:"Hyderabad" 
            
         }); 
   
         // 'FoodCollection' is a collection instance and
         // 'Food' is specified by overriding the 'model' property 
         var FoodCollection = Backbone.Collection.extend({ 
            model: Food 
         }); 
   
         // "food1","food2" and "food3" are created for the model "Food" 
         var food1 = new Food({name: "Icecream",  country:"Hyderabad"}); 
         var food2 = new Food({name: "cake/chocos",  country:"Guntur"}); 
         var food3 = new Food({name: "drinks",  country:"Guntur"});
   
         // add() method adds the models 'food1' and 'food2'
         // to the collection instance 'final' 
         var final = new FoodCollection(); 
         final.add([food1,food2,food3]); 
   
          // get the count of total food using length 
         document.write('Actual Food Count : ' + final.length); 
         document.write("<br>"); 
   
         // remove food1 and food3 model using pop 
         final.pop([food1,[food3]]); 
         document.write('Removed Food Count : ' + final.length); 
      </script
</head>
 
<body></body>
 
</html>


Output:

Actual Food Count : 3
Removed Food Count : 2

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