JavaScript普通函數有原型嗎

JavaScript普通函數有原型。在JavaScript中，任何一個函數都有一個prototype（原型）屬性，這個屬性指向函數的原型物件。原型的作用其實就是為類別(函數)提供了一個“公共區域”，在這個公共區域中聲明的屬性和方法能夠被所有透過這個類別所創建的物件所訪問到，可減少記憶體消耗。

本教學操作環境：windows7系統、javascript1.8.5版、Dell G3電腦。

函數的prototype屬性（原型）

一、 只要我們建立一個函數，函數就會自動獲得一個prototype屬性，這個屬性指向函數的原型物件。

建立fn函數自動取得prototype屬性，該屬性是物件就是該函數的原型對象，我們可以看到原型物件預設會有一個constructor屬性，該屬性是指向函數自身即fn。

原型的作用其實就是為類別(函數)提供了一個【公共區域】，在這個公共區域中宣告的屬性和方法能夠被所有透過這個類別所建立的物件所存取。減少記憶體消耗。

二、函數的prototype屬性是一個對象

typeof fn.prototype  //"object"

prototype屬性是一個對象，那麼我們除了以普通對象的形式訪問對應的屬性和方法以外，還可以用什麼方式訪問呢？答案就是當函數作為'建構函數'，我們是用'new關鍵字建立實例'來存取prototype屬性中對應的屬性和方法

function Fn(){
    this.name = "CJF"}
Fn.prototype.name="CJF1";
Fn.prototype.getName = function(){
    return this.name;
}var f = new Fn();
f.name;//输出 'CJF'f.getName(); //输出 'CJF'Fn.prototype.getName();//输出 'CJF1'

可以看到當函數作為建構函式建立實例的時候，該實例就可以呼叫原型物件上的方法，此時的this是指向f ；實例f存取name屬性，因為其自身有name屬性，可以存取到，所以輸出'CJF'，本身沒有name屬性，那麼腳本引擎就會去查詢用於創建當前物件的建構子的原型（相當於我們存取f.constructor.prototype），找到建構子原型物件有name屬性就會回傳'CJF1'。 （f和其原型物件都有name屬性,物件本身屬性的優先權高於原型物件）

function Fn(){}
Fn.prototype.name="CJF1";
Fn.prototype.getName = function(){
    return this.name;
}var f = new Fn();
f.name;//输出 'CJF1'f.getName(); //输出 'CJF1'Fn.prototype.getName();//输出 'CJF1'

三、prototype原型物件的「即時性」

由於javascript中，所有物件都是透過傳引用的方式來傳遞，我們每次新創建函數實例中都沒有一份屬於自己的原型副本，也就是說原型對像是所有實例共享的，我們修改函數的原型對象，那麼有該函數創建的所有實例對象的prototype都會跟著變化。

function Fn(){}
Fn.prototype.name="CJF1";
Fn.prototype.getName = function(){
    return this.name;
}var f = new Fn();
f.name;//输出 'CJF1'f.getName(); //输出 'CJF1'f.getAge();//此时没有实例f并没有getAge方法  浏览器会报错 Uncaught TypeError: f.getAge is not a function//加上后面的就可以正常访问了Fn.prototype.getAge = function(){
    return 20;
}
f.getAge();//20

四、原型鏈
剛才我們有了解到，當物件自身屬性和原型屬性相同時，自身屬性優先權高於原型屬性，但是當物件本身沒有我們要存取的屬性或者方法時，就會沿著建立目前物件的建構函式的原型（原型鏈）查找要存取的屬性，一旦查找到就回傳對應屬性，沒查找到對應屬性回傳undefined，但沒找到要存取的方法會報錯（因為沒有該方法卻還要執行該方法所以報錯）。

function Fn(){}
Fn.prototype.name="CJF1";
Fn.prototype.getName = function(){
    return this.name;
}var f = new Fn();
f.constructor.prototype == Fn.prototype //true

由上圖我們可以看到實例f.#_proto_(前後各兩個底線)指向的是一個對象，而這個對象就是Fn.prototype,當我們訪問實例f沒有的屬性或方法是，就會沿著這個秘密鏈接（_proto_）找我們要存取的,一直找到Object.prototype,一旦查找到就回傳對應屬性，沒查找到對應屬性回傳undefined，但是沒查找到要存取的方法會報錯。這個秘密連結只用於學習和調試，在實際開發別用（建議使用Object.getPrototypeOf方法）。

如果我們呼叫f.toString(),因為實例f沒有toString方法，所以它就會沿著秘密連結尋找Object.prototype,因為Object 是最頂層父類，其他的物件都是直接或間接繼承自他，秘密連結找到它之後，有結果就返回，沒有就返回undefined或報錯。所以出現Object.prototype._proto_# = null。

【相關推薦：javascript影片教學、程式設計影片】

以上是JavaScript普通函數有原型嗎的詳細內容。更多資訊請關注PHP中文網其他相關文章！