ECMAScript6已經(jīng)支持了class，但之前版本都不支持類，但是可以通過一些方法來模擬類。
js中的類，既是重點(diǎn)，也是難點(diǎn)，很多時(shí)候都感覺模棱兩可。
首先強(qiáng)調(diào)一下js中很重要的3個(gè)知識(shí)點(diǎn)：this、prototype、constructor。
下面我們來總結(jié)一下定義(模擬)類的幾種方法：
1.工廠模式
function createObject(name,age){ var obj = new Object(); obj.name = name; obj.age = age; obj.getName = function(){ return this.name; }; obj.getAge = function(){ return this.age; } return obj;}var obj2 = createObject("王五",19);console.log(obj2.getName());console.log(obj2.getAge());console.log(obj2.constructor);工廠模式的方法創(chuàng)建對(duì)象，工廠模式可以根據(jù)接受的參數(shù)來創(chuàng)建一個(gè)包含必要信息的對(duì)象，可以無限次數(shù)的調(diào)用這個(gè)方法，每次都返回一個(gè)包含2個(gè)屬性2個(gè)方法的對(duì)象。工廠模式解決了創(chuàng)建類似對(duì)象的問題，但沒有解決對(duì)象的識(shí)別問題，即不能確定一個(gè)對(duì)象的類別，統(tǒng)一為Object。
2.構(gòu)造函數(shù)法
function Person(name,age,job){ this.name = name; this.age = age; this.job = job;}Person.prototype = { constructor:Person, getName:function(){ return this.name; }, getAge:function(){ return this.age; }, getJob:function(){ return this.job; }}var p = new Person("二麻子",18,"worker");console.log(p.constructor);console.log(p.getName());console.log(p.getAge());console.log(p.getJob());構(gòu)造函數(shù)的方式雖然確定了對(duì)象的歸屬問題，能夠確定對(duì)象的類型，但構(gòu)造函數(shù)中的方法需要在每個(gè)對(duì)象中都要重新創(chuàng)建一遍，導(dǎo)致一些性能問題。
3.原型模式
function Person(){}Person.prototype = { constructor:Person, name:"張三", age:21, job:"teacher", getName:function(){ return this.name; }, getJob:function(){ return this.job; }}var p = new Person();console.log(p.getName()); //張三console.log(p.getJob()); //teachervar p2 = new Person();p2.name = "李四";console.log(p2.getName()); //李四由實(shí)例代碼我們可以知道，對(duì)象實(shí)例可以訪問原型中的值，但不能重寫原型中的值，如果對(duì)象實(shí)例中定義了和原型重名的屬性，那么該屬性就會(huì)屏蔽原型中的那個(gè)屬性，但并不會(huì)重寫。
4.封裝(暫且這么叫吧)
var Dog = { createDog:function(){ var dog = {}; dog.name = "汪汪"; dog.sayHello = function(){ console.log("Hello World!"); }; return dog; }};var dog = Dog.createDog();dog.sayHello();就是把代碼都封裝起來，將實(shí)例對(duì)象作為一個(gè)整體返回，有點(diǎn)類似于工廠模式。
以上這篇js定義類的幾種方法(推薦)就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持武林網(wǎng)。
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注
