快捷導(dǎo)航

javascript如何實(shí)現(xiàn)create方法

更新時(shí)間：2019年11月04日 16:54:52 作者：wjefi

這篇文章主要介紹了javascript如何實(shí)現(xiàn)create方法,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下

1. 背景

項(xiàng)目使用 easyui + jquery作為前端框架，之前基本上是些后端代碼設(shè)計(jì)，前端涉略僅限于應(yīng)用。

項(xiàng)目js是之前部門領(lǐng)導(dǎo)寫的一個(gè)框架，使用面向過(guò)程方法進(jìn)行編碼，前端代碼耦合較深，修改起來(lái)捉襟見肘。

希望以統(tǒng)一方式對(duì)jquery代碼進(jìn)行設(shè)計(jì)管理，有必要對(duì)jquery源碼有一定程度了解。

理解代碼最好的方式，本人感覺(jué)應(yīng)該是造簡(jiǎn)化版輪子。大致理解原型鏈之后，本文參考引用博文時(shí)限一個(gè)create函數(shù)。

2. 實(shí)現(xiàn)

構(gòu)造函數(shù)的constructor屬性在聲明以后自動(dòng)賦值為自身，同時(shí)People的__proto__屬性賦值為Function.prototype。

使用new方式和Function.call方式創(chuàng)建的對(duì)象在原型上存在區(qū)分。

new方式對(duì)象__proto__屬性指向其構(gòu)造函數(shù)prototype對(duì)象，F(xiàn)unction.call方式對(duì)象__proto__屬性指向Object的prototype對(duì)象。

因此Function.call()方式創(chuàng)建對(duì)象只要修改__proto__屬性指向，私認(rèn)為等價(jià)于new方式創(chuàng)建對(duì)象，代碼如下。

function create(){
  // 1. 創(chuàng)建一個(gè)空對(duì)象
  let obj = {};
  
  // 2. 獲取構(gòu)造函數(shù)
  let constructor = [].shift.call(arguments);

  // 3. 鏈接到原型
  obj.__proto__ = constructor.prototype;

  // 4. 綁定this值
  let result = constructor.apply(obj, arguments);

  // 5. 返回新對(duì)象
  return typeof result==='object' ? result : obj;
}

調(diào)用方式為

var people = create(People,'Bob',22);

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

JS實(shí)現(xiàn)簡(jiǎn)單留言板功能
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)簡(jiǎn)單留言板功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-08-08
小程序?qū)崿F(xiàn)留言板
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)留言板，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2018-11-11
實(shí)例分析js和C#中使用正則表達(dá)式匹配a標(biāo)簽
本文通過(guò)2個(gè)實(shí)例，對(duì)比分析了在js和c#中使用正則表達(dá)式匹配a標(biāo)簽的異同，小伙伴們自己參考下吧，有利于深刻理解正則表達(dá)式的使用。
2014-11-11
JavaScript中判斷數(shù)據(jù)類型的方法總結(jié)
這篇文章主要為大家詳細(xì)介紹了一些JavaScript中判斷數(shù)據(jù)類型的方法，文中的示例代碼講解詳細(xì)，具有一定的學(xué)習(xí)價(jià)值，需要的小伙伴可以了解一下
2023-07-07
將html頁(yè)面保存成圖片,圖片寫入pdf的實(shí)現(xiàn)方法(推薦)
下面小編就為大家?guī)?lái)一篇將html頁(yè)面保存成圖片,圖片寫入pdf的實(shí)現(xiàn)方法(推薦)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-09-09
JavaScript中定時(shí)器setTimeout()和setInterval()的用法
本文詳細(xì)講解了JavaScript中定時(shí)器setTimeout()和setInterval()的用法，文中通過(guò)示例代碼介紹的非常詳細(xì)。對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2022-06-06
簡(jiǎn)單談?wù)刟xios中的get,post方法
下面小編就為大家?guī)?lái)一篇簡(jiǎn)單談?wù)刟xios中的get,post方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-06-06
js運(yùn)動(dòng)動(dòng)畫的八個(gè)知識(shí)點(diǎn)
本文給大家分享的是個(gè)人在學(xué)習(xí)js運(yùn)動(dòng)動(dòng)畫的過(guò)程中總結(jié)的我們需要注意的8個(gè)知識(shí)點(diǎn)，分別是速度動(dòng)畫、透明度漸變、緩沖運(yùn)動(dòng)、多物體運(yùn)動(dòng)、獲取樣式、任意屬性值、鏈?zhǔn)竭\(yùn)動(dòng)和同時(shí)運(yùn)動(dòng)，非常的詳細(xì)，推薦給小伙伴們。
2015-03-03
js或者jquery判斷圖片是否加載完成實(shí)現(xiàn)代碼
需要獲得圖片的寬度和高度，有些js或者jquery代碼在還沒(méi)有加載完圖片時(shí)就執(zhí)行了，這個(gè)問(wèn)題該怎么解決呢？接下來(lái)分別介紹下js與jquery提供的方法
2013-03-03
JavaScript?算法實(shí)現(xiàn)復(fù)寫0雙指針解法
這篇文章主要為大家介紹了JavaScript?算法?復(fù)寫0雙指針解法，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2022-11-11