JS創建類的方法--簡單易懂有實例


版權聲明:本文為博主原創文章,轉載請注明出處

 

  Javascript是一種基於對象的語言,你遇到的所有東西幾乎都是對象。但是,它又不是一種真正的面向對象編程(OOP)語言,因為它的語法中沒有Class。(不過,ES6引入了Class這個概念,作為對象的模板。通過class關鍵字,可以定義類。ES6入門:http://es6.ruanyifeng.com/)。

  但是在項目開發中,經常用到JS面向對象開發,這就需要我們去用JS創建類,從而去實例化一些對象。接下來我們介紹一下在JS中創建類的幾種方式:

 

  1.工廠方式:

//通過工廠方式創建對象,先定義一個工廠方法
function createObj(){ var obj  =  new Object(); obj.name="xxx"; obj.say=function(){ alert("我是xxx"); } return obj; } //調用工廠方法創建對象:
var obj1  = createObj(); //也可以用這種形式
function createObj(){ var obj  =  {};  //這樣生成對象
    obj.name="xxx"; obj.say=function(){ alert("我是xxx"); } return obj; } var obj1  =  createObj();

  這種方式的問題是每一次通過工廠方法去創建一個對象,這個對象的屬性name和方法say都必須重新創建一次,浪費內存。

 

  2.構造器方式:

//創建一個構造器,構造函數首字母大寫
function Obj(){ this.name="xxx"; this.say=function(){ alert("我是xxx"); }; } //利用構造器,通過new關鍵字生成對象
var obj1=new Obj();

  這是最基本的方式,但是也存在和工廠方式一樣的毛病。

 

  3.原型方式:

//用空函數創建一個類
function Obj(){ } //在類的原型鏈上添加屬性和方法
Obj.prototype.name="xxx"; Obj.prototype.say=function(){ alert("我是xxx"); } //生成對象
var obj1=new Obj();

  這個方式的缺點是,當有引用屬性時,改變一個對象的這個屬性也會改變其他對象的這個屬性。因為一個引用屬性,都是指向的同一個地方。

 

  4.原型/構造聯合方式

//用構造函數定義對象的非函數屬性
function Obj(name){ this.name=name; this.arr=new Array('a','b'); } //用原型方式定義對象的方法
Obj.prototype.say=function(){ alert("我是xxx"); } //生成對象
var obj1 = new Obj('xxx');

  這種是目前用的最多的創建類和對象的方式,將方法和屬性用不同的方式封裝。

 

  5.動態原型方式

//動態原型方式和原型/構造混合方式的原理相似,唯一的區別就是賦予對象方法的位置
function Person(name, sex) { this.name = name; this.sex = sex; if (typeof this.say != "function") { Person.prototype.say = function () { alert(this.name); } } } var man =new Person ("凱撒", "男"); man.say();//凱撒

  動態原型模式是將所有的信息都封裝到構造函數中,構造函數中,只用say不存在的情況下,才會將它添加到原型中。這段代碼只有在初次調用時才會執行。

 

  實例化obj對象有三步:

  1. 創建obj對象:obj=new Object();

  2. 將obj的內部__proto__指向構造他的函數Obj的prototype,同時,obj.constructor===Obj.prototype.constructor,從而使得obj.constructor.prototype指向Obj.prototype(obj.constructor.prototype===A.prototype)。obj.constructor.prototype與的內部_proto_是兩碼事,實例化對象時用的是_proto_,obj是沒有prototype屬性的,但是有內部的__proto__,通過__proto__來取得原型鏈上的原型屬性和原型方法。

  3. 將obj作為this去調用構造函數Obj,從而設置成員(即對象屬性和對象方法)並初始化。

  當這3步完成,這個obj對象就與構造函數Obj再無聯系,這個時候即使構造函數Obj再加任何成員,都不再影響已經實例化的obj對象了。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM