學習JavaScript時，就一定會涉及到兩個概念–prototype,原型對象。自己在做項目時可能無意中使用到，但是卻沒有真正去了解這個東西，在學會使用的基礎上，進一步去理解它會幫助自己吸收到更多不一樣的知識。
1.Prototype
prototype翻譯過來稱爲"原型"。prototype是每個函數都具有的一個屬性，這個屬性是一個指針，指向這個函數的原型對象，而且每個該對象產生的實例對象(new 操作符創建)都可以共享該對象prototype屬性上的所有屬性和方法。
2.原型對象
那麼指向的原型對象又是怎麼樣的呢？通過創建一個簡單的構造函數，打印該實例對象可以更好的去理解。
function Person() {
}
var p = new Person(); //創建的一個Person類型的實例
console.log(p instanceof Person) //true
console.log(p)
谷歌瀏覽器打印p的結果:
這裏的Person是一個空的構造函數，什麼都沒有。只有一個__proto__屬性，他的類型可以看到是一個Object對象。這個對象我們其實並沒有定義，這個對象就是Person的原型對象。
通過下面的打印進一步驗證:
console.log(p.__proto__ === Person.prototype) //true
這個__proto__是瀏覽器支持的一個屬性，這個屬性這個實例內部的一個指針，指向這個實例的構造函數的原型對象，也就是Person.prototype.原型對象的結構是這樣的
Perosn的原型對象會自動獲得一個constructor屬性,這個屬性包含指向其prototype屬性所在函數的指針，也就是指向Person，通過打印比較可以驗證
console.log(p.__proto__.constructor === Person) //true
同時還從Object那裏繼承過來了一些方法，如常用的hasOwnProperty,toString等。這些原型方法可以直接被實例調用，也可以被重寫。
3.原型對象的拓展
我們可以在原型對象上定義自己的方法和屬性，可以將對象之間都需要用到的一些共用方法和屬性定義在這上面，這樣每個對象的實例不需要自己在函數裏各自又重複寫一遍代碼來實現相同功能的方法。
//頁面
function Page(id, title){
this.id = id;
this.title = title;
this.$div = $("#"+id);
this.init()
}
//顯示
Page.prototype.show = function(){
this.$div.show();
}
//隱藏
Page.prototype.hide = function(){
this.$div.hide();
}
//這裏的prototype上的title並沒有生效。因爲解析器在查詢屬性值過程中先從自身實例坐在函數內部先進行查詢，如果沒有找到的情況下則順着原型鏈一步步查詢下去
Page.prototype.title = "我是標題";
//初始化
Page.prototype.init = function() {
this.$div.find(".title").html(this.title)
}
//獲取內容
Page.prototype.getContent = function() {
var content = this.$div.find(".content").html();
return content;
}
var userPage = new Page("page-user","用戶詳情");
var logPage = new Page("page-log","日誌詳情");
var userContent = userPage.getContent();
var logContent = logPage.getContent();
console.log(userContent) //我是用戶界面
console.log(logContent) //我是日誌界面
上面的構造函數通過傳入不同的id管理對應不同的頁面對象。每個頁面實例之間都可以使用show(),hide()方法，每個實例都各自管理着自己的屬性,這樣每個實例之間的修改不會影響其他實例。
4.總結
直接用一張圖表示
