成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

JS每日一題:設(shè)計(jì)模式-如何理解工廠模式?

kevin / 2159人閱讀

摘要：期設(shè)計(jì)模式如何理解工廠模式定義創(chuàng)建對(duì)象的接口，讓子類決定實(shí)例化哪個(gè)類。適用場景需要根據(jù)不同參數(shù)產(chǎn)生不同實(shí)例，這些實(shí)例都有相同的行為這時(shí)候我們可以使用工廠模式，簡化實(shí)現(xiàn)的過程，同時(shí)也可以減少每種對(duì)象所需的代碼量。

20190408期

設(shè)計(jì)模式-如何理解工廠模式?

定義: 創(chuàng)建對(duì)象的接口，讓子類決定實(shí)例化哪個(gè)類。工廠方法將類的實(shí)例化延遲到子類,而子類可以重寫接口方法以便創(chuàng)建的時(shí)候指定自己的對(duì)象類型。
適用場景

需要根據(jù)不同參數(shù)產(chǎn)生不同實(shí)例，這些實(shí)例都有相同的行為,這時(shí)候我們可以使用工廠模式，簡化實(shí)現(xiàn)的過程，同時(shí)也可以減少每種對(duì)象所需的代碼量。工廠模式有利于消除對(duì)象間的耦合，提供更大的靈活性

代碼理解:

// 下方就是一個(gè)典型的工廠模式
// 首先創(chuàng)建對(duì)象的接口
const productManager = {};

productManager.createProductA = function () {
    console.log("ProductA");
}

productManager.createProductB = function () {
    console.log("ProductB");
}
        
productManager.factory = function (type) {
    // 工廠方法將類的實(shí)例化延遲到子類
    return new productManager[type];
}

// 讓子類決定實(shí)例化哪個(gè)類
productManager.factory("createProductA");

如果還不理解的話，那我們就再詳細(xì)一點(diǎn)咯，假如我們想在網(wǎng)頁面里插入一些元素，而這些元素類型不固定，可能是圖片，也有可能是連接，甚至可能是文本，根據(jù)工廠模式的定義，我們需要定義工廠類和相應(yīng)的子類，我們先來定義子類的具體實(shí)現(xiàn)（也就是子函數(shù)）

var page = page || {};
page.dom = page.dom || {};
//子函數(shù)1：處理文本
page.dom.Text = function () {
    this.insert = function (where) {
        var txt = document.createTextNode(this.url);
        where.appendChild(txt);
    };
};

//子函數(shù)2：處理鏈接
page.dom.Link = function () {
    this.insert = function (where) {
        var link = document.createElement("a");
        link.href = this.url;
        link.appendChild(document.createTextNode(this.url));
        where.appendChild(link);
    };
};

//子函數(shù)3：處理圖片
page.dom.Image = function () {
    this.insert = function (where) {
        var im = document.createElement("img");
        im.src = this.url;
        where.appendChild(im);
    };
};

那么我們?nèi)绾味x工廠處理函數(shù)呢？其實(shí)很簡單：

page.dom.factory = function (type) {
    return new page.dom[type];
}

使用方式如下：

var o = page.dom.factory("Link");
o.url = "http://www.cnblogs.com";
o.insert(document.body);
熟悉的jquery

jQuery中的$()其實(shí)就是一個(gè)工廠函數(shù)，它根據(jù)傳入?yún)?shù)的不同創(chuàng)建元素或者去尋找上下文中的元素，創(chuàng)建成相應(yīng)的jQuery對(duì)象

// https://github.com/jquery/jquery/blob/master/src/core/init.js

init = jQuery.fn.init = function( selector, context, root ) {
    var match, elem;

    // HANDLE: $(""), $(null), $(undefined), $(false)
    if ( !selector ) {
        return this;
    }

    // Method init() accepts an alternate rootjQuery
    // so migrate can support jQuery.sub (gh-2101)
    root = root || rootjQuery;

    // Handle HTML strings
    if ( typeof selector === "string" ) {
            
        //...

    // HANDLE: $(DOMElement)
    } else if ( selector.nodeType ) {
        
        //....

    // HANDLE: $(function)
    // Shortcut for document ready
    } else if ( jQuery.isFunction( selector ) ) {
        //....
    }

    return jQuery.makeArray( selector, this );
};
總結(jié)

優(yōu)點(diǎn)

工廠類含有必要的判斷邏輯, 實(shí)現(xiàn)了對(duì)責(zé)任的分割，它提供了專門的工廠類用于創(chuàng)建對(duì)象

用戶只需要關(guān)心所需產(chǎn)品對(duì)應(yīng)的工廠，無須關(guān)心創(chuàng)建細(xì)節(jié)

在系統(tǒng)中加入新產(chǎn)品時(shí)，無須修改抽象工廠和抽象產(chǎn)品提供的接口,符合“開閉原則”

缺點(diǎn)

添加新產(chǎn)品時(shí)，需要編寫新的具體產(chǎn)品類,一定程度上增加了系統(tǒng)的復(fù)雜度

考慮到系統(tǒng)的可擴(kuò)展性，需要引入抽象層，在客戶端代碼中均使用抽象層進(jìn)行定義，增加了系統(tǒng)的抽象性和理解難度

關(guān)于JS每日一題

JS每日一題可以看成是一個(gè)語音答題社區(qū)
每天利用碎片時(shí)間采用60秒內(nèi)的語音形式來完成當(dāng)天的考題
群主在次日0點(diǎn)推送當(dāng)天的參考答案

注 絕不僅限于完成當(dāng)天任務(wù)，更多是查漏補(bǔ)缺，學(xué)習(xí)群內(nèi)其它同學(xué)優(yōu)秀的答題思路

點(diǎn)擊加入答題

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

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/103385.html

相關(guān)文章

  • JS每日一題:設(shè)計(jì)模式-如何理解觀察者(發(fā)布訂閱)模式?

    摘要：期設(shè)計(jì)模式如何理解觀察者發(fā)布訂閱模式定義觀察者模式又叫發(fā)布訂閱模式，它定義了一種一對(duì)多的關(guān)系，讓多個(gè)觀察者對(duì)象同時(shí)監(jiān)聽某一個(gè)主題對(duì)象，這個(gè)主題對(duì)象的狀態(tài)發(fā)生變化時(shí)就會(huì)通知所有的觀察者對(duì)象，使得它們能夠自動(dòng)更新自己生活實(shí)例理解你今天去看一個(gè) 20190411期 設(shè)計(jì)模式-如何理解觀察者(發(fā)布訂閱)模式? 定義: 觀察者模式又叫發(fā)布訂閱模式（Publish/Subscribe），它定義了一...

    baishancloud 評(píng)論0 收藏0

  • JS每日一題：函數(shù)式編程中代碼組合(compose)如何理解?

    摘要：期函數(shù)式編程中代碼組合如何理解定義顧名思義，在函數(shù)式編程中，就是將幾個(gè)有特點(diǎn)的函數(shù)拼湊在一起，讓它們結(jié)合，產(chǎn)生一個(gè)嶄新的函數(shù)代碼理解一個(gè)將小寫轉(zhuǎn)大寫的函數(shù)一個(gè)在字符后加的函數(shù)將兩個(gè)函數(shù)組合起來這里假設(shè)我們實(shí)現(xiàn)了每日一題每日一題顯示結(jié)果里上面 20190315期 函數(shù)式編程中代碼組合(compose)如何理解? 定義: 顧名思義，在函數(shù)式編程中，Compose就是將幾個(gè)有特點(diǎn)的函數(shù)拼湊在...

    Kaede 評(píng)論0 收藏0

  • JS每日一題:設(shè)計(jì)模式-如何理解職責(zé)鏈模式?

    摘要：提交請(qǐng)求的對(duì)象并不明確知道哪一個(gè)對(duì)象將會(huì)處理它也就是該請(qǐng)求有一個(gè)隱式的接受者。 20190412期 設(shè)計(jì)模式-如何理解職責(zé)鏈模式? 定義: 使多個(gè)對(duì)象都有機(jī)會(huì)處理請(qǐng)求，從而避免請(qǐng)求的發(fā)送者和接收者之間的耦合關(guān)系，將這些對(duì)象連成一條鏈，并沿著這條鏈傳遞該請(qǐng)求，直到有一個(gè)對(duì)象處理它為止 也就是說，請(qǐng)求以后，從第一個(gè)對(duì)象開始，鏈中收到請(qǐng)求的對(duì)象要么親自處理它，要么轉(zhuǎn)發(fā)給鏈中的下一個(gè)候選者。提...

    lifesimple 評(píng)論0 收藏0

  • JS每日一題：如何理解es6中的Proxy？

    20190124問: 如何理解es6中的Proxy？ 試題解析:對(duì)proxy的理解，可能會(huì)延伸到vue的雙向綁定 Proxy（代理） 定義 可以理解為為目標(biāo)對(duì)象架設(shè)一層攔截，外界對(duì)該對(duì)象的訪問，都必須通過這層攔截 簡單示例: const obj = new Proxy({}, { get: (target, key, receiver) => { return JS ...

    tinysun1234 評(píng)論0 收藏0

  • JS每日一題：如何理解es6中的Proxy？

    20190124問: 如何理解es6中的Proxy？ 試題解析:對(duì)proxy的理解，可能會(huì)延伸到vue的雙向綁定 Proxy（代理） 定義 可以理解為為目標(biāo)對(duì)象架設(shè)一層攔截，外界對(duì)該對(duì)象的訪問，都必須通過這層攔截 簡單示例: const obj = new Proxy({}, { get: (target, key, receiver) => { return JS ...

    PumpkinDylan 評(píng)論0 收藏0

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

0條評(píng)論

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