如何使用prototype.js創建一個類

Question

任何人都可以使用prototype.js創建一個類，以及它是如何工作的。任何人都可以爲prototype.js以外的其他官方站點提供很好的示例和教程嗎？

Answer 1

創建PrototypeJS類與在正常的OOP語言中創建類非常相似。現在的方法來填充它，如果你把一個方法initialize PrototypeJS就會觸發作爲構造

var myClass = Class.create(
{ 
    initialize : function() 
    { 
     this.options = 0; 
    } 
}); 

-

首先通過命名類

var myClass = Class.create({ }); 

這將創建一個空的類開始

你可以在默認值initialize()方法中設置任何你想要的或者只是初始化類的屬性。讓我們加入其他一些方法，並展示如何實例化類。

var myClass = Class.create(
{ 
    initialize : function() 
    { 
     this.options = 0; 
    }, 

    testme : function() 
    { 
     this.options++; 
    }, 

    showme : function() 
    { 
     alert(this.options); 
     return this.options; 
    } 
}); 

var theClass = new myClass(); 

讓我們再來一步，調用方法中的其他方法，並將選項傳遞給構造函數。

var myClass = Class.create(
{ 
    initialize : function(option) 
    { 
     this.options = (option ? option : 0); 

     this.testme(); 
    }, 

    testme : function() 
    { 
     this.options++; 
    }, 

    showme : function() 
    { 
     alert(this.options); 
     return this.options; 
    } 
}); 

var theClass = new myClass(200); 
theClass.showme(); 

//will alert 201 and return 201 

這很酷，所有 - 但類繼承呢？這是OOP中的一件大事 - 可以說我們有一個單獨的類，它是一個myClass的子類。對於要在子類中重寫任何方法，你可以通過的第一變量$super，這將指向同一個名字的父母的方法 - 類似於範圍分辨率

var myChildClass = Class.create(myClass, 
{ 
    initialize : function($super,option) 
    { 
     $super(option); 

     // the child class needs option's default value at 150 or whatever is 
     // passed so run the parent initialize first and then redefine the 
     // option property 
     this.option = (option ? option : 150); 

     // you can still run methods in the parent that are not overridden in 
     // the child 
     this.testme(); 
    } 
}); 

var child = new myChildClass(); 
child.showme(); 

//will alert() 151 and return 151 

我希望這是有幫助您。

這裏是從我的github一些更復雜的現實世界的例子

https://github.com/jwestbrook/Prototype.Growler

https://github.com/jwestbrook/Prototype.Watermark

https://github.com/jwestbrook/bootstrap-prototype