本文實例講述了JS常見創(chuàng)建類的方法。分享給大家供大家參考，具體如下：

Javascript是一種基于對象的語言，你遇到的所有東西幾乎都是對象。但是，它又不是一種真正的面向?qū)ο缶幊蹋∣OP）語言，因為它的語法中沒有Class。（不過，ES6引入了Class這個概念，作為對象的模板。通過class關(guān)鍵字，可以定義類。ES6入門：http://es6.ruanyifeng.com/）。

但是在項目開發(fā)中，經(jīng)常用到JS面向?qū)ο箝_發(fā)，這就需要我們?nèi)ビ肑S創(chuàng)建類，從而去實例化一些對象。接下來我們介紹一下在JS中創(chuàng)建類的幾種方式：

1.工廠方式：

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

這種方式的問題是每一次通過工廠方法去創(chuàng)建一個對象，這個對象的屬性name和方法say都必須重新創(chuàng)建一次，浪費內(nèi)存。

2.構(gòu)造器方式：

//創(chuàng)建一個構(gòu)造器，構(gòu)造函數(shù)首字母大寫
function Obj(){
  this.name="xxx";
  this.say=function(){
    alert("我是xxx");
  };
}
//利用構(gòu)造器，通過new關(guān)鍵字生成對象
var obj1=new Obj();

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

3.原型方式：

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

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

4.原型/構(gòu)造聯(lián)合方式

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

這種是目前用的最多的創(chuàng)建類和對象的方式，將方法和屬性用不同的方式封裝。

5.動態(tài)原型方式

//動態(tài)原型方式和原型/構(gòu)造混合方式的原理相似，唯一的區(qū)別就是賦予對象方法的位置
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();//凱撒

動態(tài)原型模式是將所有的信息都封裝到構(gòu)造函數(shù)中，構(gòu)造函數(shù)中，只用say不存在的情況下，才會將它添加到原型中。這段代碼只有在初次調(diào)用時才會執(zhí)行。

實例化obj對象有三步：

1. 創(chuàng)建obj對象：

obj=new Object();

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

3. 將obj作為this去調(diào)用構(gòu)造函數(shù)Obj，從而設(shè)置成員（即對象屬性和對象方法）并初始化。

當這3步完成，這個obj對象就與構(gòu)造函數(shù)Obj再無聯(lián)系，這個時候即使構(gòu)造函數(shù)Obj再加任何成員，都不再影響已經(jīng)實例化的obj對象了。

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《javascript面向?qū)ο笕腴T教程》、《JavaScript錯誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運算用法總結(jié)》

希望本文所述對大家JavaScript程序設(shè)計有所幫助。

最新評論