如何學(xué)好JavaScript(八) —— 用JSON做原型
來(lái)源:易賢網(wǎng) 閱讀:852 次 日期:2015-04-22 11:32:20
溫馨提示:易賢網(wǎng)小編為您整理了“如何學(xué)好JavaScript(八) —— 用JSON做原型”,方便廣大網(wǎng)友查閱!

在Javascript學(xué)習(xí)筆記5——類(lèi)和對(duì)象中,我簡(jiǎn)單地提到了利用JSON去構(gòu)造一個(gè)對(duì)象。代碼如下:

<script type="text/javascript"> var People = { name: "kym", age: 21, SayHello: function () { alert("Hello,My name is " + this.name + ".I am " + this.age); } } alert(People.name); People.SayHello(); script>

但是我們是不能重用這個(gè)對(duì)象的,我們?nèi)绾伟堰@個(gè)對(duì)象作為原型的呢?

首先,在一個(gè)JSON對(duì)象有一個(gè)構(gòu)造方法是不可能的了,那么我們就做一個(gè)簡(jiǎn)單的“工廠”吧,寫(xiě)一個(gè)方法來(lái)專(zhuān)門(mén)負(fù)責(zé)創(chuàng)建。

<script type="text/javascript"> var People = { Create: function (name, age) { this.name = name; this.age = age; }, SayHello: function () { alert("Hello,My name is " + this.name + ".I am " + this.age); } } People.Create("kym", 21); People.SayHello(); script>

但是通過(guò)這個(gè)方法我們卻發(fā)現(xiàn),我們沒(méi)有辦法用People作為原型,讓我們回顧一下:Javascript學(xué)習(xí)筆記7——原型鏈的原理 這篇文章,我們想一下這個(gè)過(guò)程:

var p=new People();==>p.__proto__=People.prototype。于是當(dāng)我們p.SayHello()的時(shí)候就會(huì)去People.prototype中去找,結(jié)果什么都找不到。

如果可以People.prototype.SayHello=function(){}就可以解決這個(gè)問(wèn)題。但是我們知道,只有function才可以有prototype。

那么我們想想之前的推導(dǎo)公式,怎么樣能讓p.SayHello()呢?如果可以p.__proto__=People就好了。那么我們想個(gè)辦法:

既然在new的時(shí)候,某個(gè)對(duì)象的__proto__只能等于某個(gè)函數(shù)的prototype,我們?cè)O(shè)置一個(gè)函數(shù)X,令p.__proto__=X.prototype,我們?cè)倭頧.prototype=People。這樣的關(guān)系是這樣:

<script type="text/javascript"> var People = { Create: function (name, age) { this.name = name; this.age = age; }, SayHello: function () { alert("Hello,My name is " + this.name + ".I am " + this.age); } }; var X = function () { }; X.prototype = People; var p = new X(); p.Create("kym", 21); p.SayHello(); script>

這樣就相當(dāng)于用X做了一個(gè)中間變量,使得我們可以訪問(wèn)JSON對(duì)象的內(nèi)部屬性。但是這樣是不是不太優(yōu)雅呢?我們每次創(chuàng)建一個(gè)對(duì)象時(shí),都需要來(lái)寫(xiě)這樣一個(gè)輔助的函數(shù)。那好,我們就把這個(gè)過(guò)程封裝起來(lái):

var Factory = { CreatePeople : function (className,name,age) { var temp = function () { className.Create(name, age); }; temp.prototype = className; var result = new temp(); return result; }};var people = Factory.CreatePeople(People,"kym",21);people.SayHello();

但是這樣也有一個(gè)缺點(diǎn),就是每次我增加一個(gè)類(lèi),就需要向Factory里注冊(cè)一個(gè)新方法,這樣是很麻煩的,我在很久以前的 玩轉(zhuǎn)方法:call和apply 中說(shuō)過(guò)關(guān)于call和apply的區(qū)別,因?yàn)檫@里的參數(shù)不固定,我們不可能一一列舉,因此我們?cè)谶@里可以用apply來(lái)改善這個(gè)方法:

<script type="text/javascript"> var People = { Create: function (name, age) { this.name = name; this.age = age; }, SayHello: function () { alert("Hello,My name is " + this.name + ".I am " + this.age); } }; var Factory = { Create: function (className, params) { var temp = function () { className.Create.apply(this, params); }; temp.prototype = className; var result = new temp(); return result; } }; var people = Factory.Create(People,["kym",21]); people.SayHello(); script>

這樣,一個(gè)完整的創(chuàng)建類(lèi)就誕生了!那么我們每次創(chuàng)建“類(lèi)”時(shí)就都可以用JSON來(lái)做了,然后用戶每次都統(tǒng)一來(lái)調(diào)用Factory.Create()就可以了!

更多信息請(qǐng)查看IT技術(shù)專(zhuān)欄

更多信息請(qǐng)查看腳本欄目
易賢網(wǎng)手機(jī)網(wǎng)站地址:如何學(xué)好JavaScript(八) —— 用JSON做原型
由于各方面情況的不斷調(diào)整與變化,易賢網(wǎng)提供的所有考試信息和咨詢回復(fù)僅供參考,敬請(qǐng)考生以權(quán)威部門(mén)公布的正式信息和咨詢?yōu)闇?zhǔn)!

2025國(guó)考·省考課程試聽(tīng)報(bào)名

  • 報(bào)班類(lèi)型
  • 姓名
  • 手機(jī)號(hào)
  • 驗(yàn)證碼
關(guān)于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡(jiǎn)要咨詢 | 簡(jiǎn)要咨詢須知 | 加入群交流 | 手機(jī)站點(diǎn) | 投訴建議
工業(yè)和信息化部備案號(hào):滇ICP備2023014141號(hào)-1 云南省教育廳備案號(hào):云教ICP備0901021 滇公網(wǎng)安備53010202001879號(hào) 人力資源服務(wù)許可證:(云)人服證字(2023)第0102001523號(hào)
云南網(wǎng)警備案專(zhuān)用圖標(biāo)
聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關(guān)注公眾號(hào):hfpxwx
咨詢QQ:526150442(9:00—18:00)版權(quán)所有:易賢網(wǎng)
云南網(wǎng)警報(bào)警專(zhuān)用圖標(biāo)