Backbone.js shift Collection
In this article, we will discuss Backbone.js shift collection. The Backbone.js pop collection is used to remove and return the first model from the given collection.
Syntax:
collection.pop(models, options)
Parameters: It will take one parameter.
- 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 apply shift().
HTML
<!DOCTYPE html> < html > < head > < 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.1.2/backbone-min.js" 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" } }); // Here the 'FoodCollection' is a collection instance and // model 'Food' is specified by overriding the 'model' property var FoodCollection = Backbone.Collection.extend({ model: Food }); // The instances "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"}); // The 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 Values:", JSON.stringify(final.toJSON())); document.write("< br >"); document.write("< br >"); // Apply shift() method final.shift(); document.write('Values after Shift : ' + JSON.stringify(final.toJSON())); </ script > </ head > < body ></ body > </ html > |
Output:
Actual Values:[{ "name":"Icecream", "country":"Hyderabad", "food_name":"Butter", "food_region":"Hyderabad" }, { "name":"cake/chocos", "country":"Guntur", "food_name":"Butter", "food_region":"Hyderabad" }] Values after Shift : [{ "name":"cake/chocos", "country":"Guntur", "food_name":"Butter", "food_region":"Hyderabad" }]
Example 2: In this example, we will create a model Food and apply shift().
HTML
<!DOCTYPE html> < html > < head > < 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.1.2/backbone-min.js" 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_region:"india" } }); // Here the 'FoodCollection' is a collection instance and // model 'Food' is specified by overriding the 'model' property var FoodCollection = Backbone.Collection.extend({ model: Food }); var food1 = new Food({name: "Icecream", country:"Hyderabad"}); var food2 = new Food({name: "cake/chocos", country:"Guntur"}); var food3 = new Food({name: "eggs", country:"delhi"}); var food4 = new Food({name: "chicken", country:"patna"}); // The add() method adds the models 'food1' and 'food2' // to the collection instance 'final' var final = new FoodCollection(); final.add([food1,food2,food3,food4]); // Get the count of total food using length document.write("Actual Values:", JSON.stringify(final.toJSON())); document.write("< br >"); document.write("< br >"); // Apply shift() method final.shift(); document.write('Values after Shift : ' + JSON.stringify(final.toJSON())); </ script > </ head > < body ></ body > </ html > |
Output:
Actual Values:[{ "name":"Icecream", "country":"Hyderabad", "food_region":"india" }, { "name":"cake/chocos", "country":"Guntur", "food_region":"india" }, { "name":"eggs", "country":"delhi", "food_region":"india" }, { "name":"chicken", "country":"patna", "food_region":"india" }] Values after Shift : [{ "name":"cake/chocos", "country":"Guntur", "food_region":"india" }, { "name":"eggs", "country":"delhi", "food_region":"india" }, { "name":"chicken", "country":"patna", "food_region":"india" }]
Contact Us