天天看點

javascript 函數屬性prototype(轉)

1、prototype 

在JavaScript中并沒有類的概念,但JavaScript中的确可以實作重載,多态,繼承。這些實作其實方法都可以用JavaScript中的引用和變量作用域結合prototype來解釋。

2、簡單的例子 

var Blog = function( name, url ){  

this.name = name;  

this.url = url;  

};  

Blog.prototype.jumpurl = '';  

Blog.prototype.jump = function(){  

window.location = this.jumpurl;  

/* 

*等同于 

Blog.prototype = { 

jumpurl : '', 

jump : function(){ 

window.location = this.jumpurl; 

}; 

*/  

var rainman = new Blog('jb51', 'http://www.jb51.net');  

var test = new Blog('server', 'http://s.jb51.net');   

這是一個非常簡單的例子,但卻可以很好的解釋prototype内在的一些東西,先看下圖的記憶體配置設定: 

javascript 函數屬性prototype(轉)

通過上圖可以看到下面這些内容: 

prototype隻是函數的一個屬性,該屬性的類型是一個對象。 

記憶體配置設定狀況: 

函數Blog擁有一個prototype屬性,而prototype屬性擁有一個變量和一個函數; 

test和rainman兩個變量都分别有name和url兩個變量; 

test和rainman兩個變量都有一個jumpUrl變量和一個jump函數,但是并沒有配置設定記憶體,它們是對Blog.protype中的引用 

3、擴充1: 

Website.prototype = Blog.prototype  

this.url = blogurl;  

var test = new Blog('server', 'http://s.jb51.net');  

var Website = function(){};  

Website.prototype = Blog.prototype;  

var mysite = new Website();   

javascript 函數屬性prototype(轉)

"Website.prototype = Blog.prototype;":Website的prototype并沒有配置設定記憶體,隻是引用了Blog的prototype屬性。

mysite的兩個屬性也沒有配置設定記憶體,也隻是分别引用了Blog.prototype.jumpurl和Blog.prototype.jump 

4、擴充2: 

Website.prototype = new Blog()  

var Blog = function(){};  

Website.prototype = new Blog();  

javascript 函數屬性prototype(轉)

Website的prototype屬性,隻是Blog的一個執行個體( 同rainman=new Blog(); );是以Website的prototype屬性就具有了jumpurl變量和jump方法了。

mysite是Website的一個執行個體,它的jumpurl和jump方法是繼承自Website的prototype,而Web.prototype繼承自Blog.prototype(這裡與其說是繼承,不如說是引用)

整段程式在運作的過程中,記憶體中隻配置設定了一個jumpurl變量和一個jump方法 

5、new運算符 

JavaScript中new運算符。 

JavaScript中new運算符是建立一個新對象。使用方法: 

new constructor[(arguments)] 

其中constructor是必選項。對象的構造函數。如果構造函數沒有參數,則可以省略圓括号。 

arguments是可選項。任意傳遞給新對象構造函數的參數。 

JavaScript中new運算符說明 

new 運算符執行下面的任務: 

建立一個沒有成員的對象。 

為那個對象調用構造函數,傳遞一個指針給新建立的對象作為 this 指針。 

然後構造函數根據傳遞給它的參數初始化該對象。 

示例 

下面這些是有效的 new 運算符的用法例子。 

my_object = new Object; 

my_array = new Array(); 

my_date = new Date("Jan 5 1996");

6、其它 

繼續閱讀