Backbone 是一個前端 JS 程式碼 MVC 框架，被著名的 37signals 用來構建他們的移動客戶端。它不可取代 Jquery，不可取代現有的 template 庫。而是和這些結合起來構建複雜的 web 前端互動應用。

如果專案涉及大量的 javascript 程式碼，實現很多複雜的前端互動功能，首先你會想到把資料和展示分離。使用 Jquery 的 selector 和 callback 可以輕鬆做到這點。但是對於富客戶端的WEB應用大量程式碼的結構化組織非常必要。

Backbone 就提供了 javascript 程式碼的組織的功能。Backbone 主要包括 models, collections, views 和 events, controller 。

Model（模型）

最簡單的定義如下：

1. var Game = Backbone.Model.extend({});  

稍微發雜一點

1. var Game = Backbone.Model.extend({  
2.         initialize: function(){  
3.             alert("Oh hey! ");  
4.         },  
5.           defaults: {  
6.             name: 'Default title',  
7.             releaseDate: 2011,  
8.         }  
9.     });  

initialize 相當於構造方法，初始化時呼叫

簡單實用：

1. // Create a new game
2. var portal = new Game({ name: "Portal 2", releaseDate: 2011});  
3. // release will hold the releaseDate value -- 2011 here
4. var release = portal.get('releaseDate');  
5. // Changes the name attribute
6. portal.set({ name: "Portal 2 by Valve"});  

此時資料還都在記憶體中，需要執行save方法才會提交到伺服器。（還未理解）

1. portal.save();  

Collection（集合）

1. var GamesCollection = Backbone.Collection.extend({  
2.   model : Game,  
3.   }  
4. });  

1. var GamesCollection = Backbone.Collection.extend({  
2.   model : Game,  
3.   old : function() {  
4.     returnthis.filter(function(game) {  
5.       return game.get('releaseDate') < 2009;  
6.     });  
7.   }  
8.   }  
9. });  

1. var games = new GamesCollection  
2. games.get(0);  

1. var GamesCollection = Backbone.Collection.extend({  
2.   model : Game,  
3.   url: '/games'
4.   }  
5. });  
6. var games = new GamesCollection  
7. games.fetch();