成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專(zhuān)欄INFORMATION COLUMN

原生js的對(duì)象創(chuàng)建模式以及優(yōu)缺點(diǎn)

浠ラ箍 / 2364人閱讀

摘要:簡(jiǎn)單工廠模式特點(diǎn)通過(guò)來(lái)創(chuàng)建一個(gè)對(duì)象實(shí)例,并為其添加屬性和方法并返回優(yōu)點(diǎn)工廠類(lèi)集中了所有對(duì)象的創(chuàng)建,便于對(duì)象創(chuàng)建的統(tǒng)一管理且可以大量創(chuàng)建缺點(diǎn)工廠模式卻無(wú)從識(shí)別對(duì)象的類(lèi)型,因?yàn)樗鼈冎苯佑蓸?gòu)造函數(shù)創(chuàng)建,原型鏈上只有對(duì)象,不像等每創(chuàng)建一個(gè)對(duì)象實(shí)例

1.簡(jiǎn)單工廠模式
// 
function createPerson(name, age, job ) {
    var o = new Object();
    o.name = name;
    o.age = age;
    o.job = job;
    o.sayName = function() {
        alert(this.name);
    }
    return o;
}
var person1 = createPerson("spademan", 26, "front-end");
var person2 = createPerson("ivan", 27, "seller");
person1.sayName(); //"spademan"
person2.sayName(); //"ivan"

特點(diǎn): 通過(guò) new Object() 來(lái)創(chuàng)建一個(gè)對(duì)象實(shí)例,并為其添加屬性和方法并返回

優(yōu)點(diǎn): 工廠類(lèi)集中了所有對(duì)象的創(chuàng)建,便于對(duì)象創(chuàng)建的統(tǒng)一管理,且可以大量創(chuàng)建

缺點(diǎn):(1).工廠模式卻無(wú)從識(shí)別對(duì)象的類(lèi)型,因?yàn)樗鼈冎苯佑?Object() 構(gòu)造函數(shù)創(chuàng)建,原型鏈上只有 Object.prototype 對(duì)象,不像Date、Array等 .
(2).每創(chuàng)建一個(gè)對(duì)象實(shí)例,就會(huì)為每個(gè)對(duì)象實(shí)例創(chuàng)建一遍相同功能但是是不同函數(shù)實(shí)例的方法,它們并不相等。這顯然是不可取的
另外在相應(yīng)的業(yè)務(wù)方面,除非是適用場(chǎng)景,否則不可濫用工廠模式,會(huì)造成代碼的復(fù)雜度(參考)

注意:除了簡(jiǎn)單工廠模式之外還有抽象工廠模式

2.構(gòu)造函數(shù)模式
function GitHub(name, url) {
    this.name = name;
    this.url = url;
    this.alertUrl = function() {
        alert(this.url);
    }
}
var git = new GitHub("spademan", "https://github.com/spademan");
console.log(git instanceof GitHub);    // true, 判斷git是否是GitHub的實(shí)例,即解決了工廠模式中不能識(shí)別對(duì)象的類(lèi)型的問(wèn)題

特點(diǎn): 需要使用new,并且沒(méi)有return關(guān)鍵字

優(yōu)點(diǎn): 可以識(shí)別對(duì)象的類(lèi)型

缺點(diǎn):使用構(gòu)造函數(shù)的最大的問(wèn)題在于每次創(chuàng)建實(shí)例的時(shí)候都要重新創(chuàng)建一次方法(理論上每次創(chuàng)建對(duì)象的時(shí)候?qū)ο蟮膶傩跃煌鴮?duì)象的方法是相同的),然而創(chuàng)建兩次完全相同的方法是沒(méi)有必要的,因此,我們可以將函數(shù)移到對(duì)象外面(這一點(diǎn)和工廠模式相同)

3.原型模式
function Person() {}
Person.prototype.name = "spademan"
Person.prototype.age = 23
Person.prototype.getName = function () {
    return this.name
}
Person.prototype.setName = function () {
    this.name = name
}
var spademan_1 = new Person()
var spademan_2 = new Person()
console.log(spademan_1.getName === spademan_2.getName)    // => true

特點(diǎn): 構(gòu)造函數(shù)內(nèi)不定義屬性和方法,把屬性和方法都定義在構(gòu)造函數(shù)的原型上。這樣所有的對(duì)象實(shí)例都共享對(duì)象原型上的屬相和方法

優(yōu)點(diǎn): 多個(gè)實(shí)例可以共享原型上的屬性和方法

缺點(diǎn): 修改原型上的一些引用屬性,所有實(shí)例對(duì)應(yīng)的屬性也將被改變,這樣可能帶來(lái)一些問(wèn)題

4.構(gòu)造函數(shù)模式 + 原型模式(也叫混合模式)
// 寫(xiě)法1
function Person(name, age) {
    this.name = name
    this.age = age
    this.getAge = function () {
        return this.age
    }
}
Person.prototype.country = "China"
Person.prototype.getName = function () {
    return this.name
}
Person.prototype.setName = function (name) {
    this.name = name
}
var spademan = new Person("spademan", 26)
var spademan_2 = new Person("spdeman_2", 27)
//寫(xiě)法2
function Person(name, age) {
    this.name = name
    this.age = age
    this.getAge = function () {
        return this.age
    }
}
Person.prototype.country = "China"
Person.prototype.getName = function () {
    return this.name
}
Person.prototype.setName = function (name) {
    this.name = name
}
var spademan = new Person("spademan", 26)
var spademan_2 = new Person("spdeman_2", 27)

優(yōu)點(diǎn): 構(gòu)造函數(shù)內(nèi)定義私有的屬性和方法,構(gòu)造函數(shù)的原型上定義共有的屬性和方法。是目前最常用的方式之一

5.模塊模式(參考)
// 寫(xiě)法1
var MODULE = (function () {
    var my = {},
        privateVariable = 1;
    
    function privateMethod() {
        // ...
    }
    
    my.moduleProperty = 1;
    my.moduleMethod = function () {
        // ...
    };
    
    return my;
}());
// 寫(xiě)法2
var MODULE = (function (my) {
    var privateVariable = 1;
    function privateMethod() {
        // ...
    }
    my.moduleProperty = 1;
    my.moduleMethod = function () {
        // ...
    };
    
    return my;
}(MODULE|| {}));

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://m.hztianpu.com/yun/86781.html

相關(guān)文章

  • 高級(jí)前端面試題大匯總(只有試題,沒(méi)有答案)

    摘要:面試題來(lái)源于網(wǎng)絡(luò),看一下高級(jí)前端的面試題,可以知道自己和高級(jí)前端的差距。 面試題來(lái)源于網(wǎng)絡(luò),看一下高級(jí)前端的面試題,可以知道自己和高級(jí)前端的差距。有些面試題會(huì)重復(fù)。 使用過(guò)的koa2中間件 koa-body原理 介紹自己寫(xiě)過(guò)的中間件 有沒(méi)有涉及到Cluster 介紹pm2 master掛了的話pm2怎么處理 如何和MySQL進(jìn)行通信 React聲明周期及自己的理解 如何...

    kviccn 評(píng)論0 收藏0
  • 2018大廠高級(jí)前端面試題匯總

    摘要:面試的公司分別是阿里網(wǎng)易滴滴今日頭條有贊挖財(cái)滬江餓了么攜程喜馬拉雅兌吧微醫(yī)寺庫(kù)寶寶樹(shù)海康威視蘑菇街酷家樂(lè)百分點(diǎn)和海風(fēng)教育。 (關(guān)注福利,關(guān)注本公眾號(hào)回復(fù)[資料]領(lǐng)取優(yōu)質(zhì)前端視頻,包括Vue、React、Node源碼和實(shí)戰(zhàn)、面試指導(dǎo)) 本人于7-8月開(kāi)始準(zhǔn)備面試,過(guò)五關(guān)斬六將,最終抱得網(wǎng)易歸,深深感受到高級(jí)前端面試的套路。以下是自己整理的面試題匯總,不敢藏私,統(tǒng)統(tǒng)貢獻(xiàn)出來(lái)。 面試的公司分...

    zzir 評(píng)論0 收藏0
  • 跨平臺(tái)技術(shù)演進(jìn)

    摘要:接下來(lái),我將從原理優(yōu)缺點(diǎn)等方面為大家分享跨平臺(tái)技術(shù)演進(jìn)。小程序年是微信小程序飛速發(fā)展的一年,年,各大廠商快速跟進(jìn),已經(jīng)有了很大的影響力。下面,我們以微信小程序?yàn)槔?,分析小程序的技術(shù)架構(gòu)。 前言 大家好,我是simbawu ,@BooheeFE Team Leader,關(guān)于這篇文章,有問(wèn)題歡迎來(lái)這里討論。 隨著移動(dòng)互聯(lián)網(wǎng)的普及和快速發(fā)展,手機(jī)成了互聯(lián)網(wǎng)行業(yè)最大的流量分發(fā)入口。以及隨著5G...

    魏憲會(huì) 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

浠ラ箍

|高級(jí)講師

TA的文章

閱讀更多
最新活動(dòng)
閱讀需要支付1元查看
<