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


