建站
咨詢
售后
建站咨詢
新聞中心
1提升對(duì)象創(chuàng)建效率：原型模式的智慧
原型模式（Prototype Pattern）是一種創(chuàng)造型設(shè)計(jì)模式，其核心思想在于通過(guò)復(fù)制“原型”來(lái)創(chuàng)建對(duì)象，而非直接實(shí)例化。在原型模式中，我們首先創(chuàng)造一個(gè)原型對(duì)象，接著通過(guò)對(duì)其進(jìn)行復(fù)制，獲得新的實(shí)例。這些原型對(duì)象儲(chǔ)存在一個(gè)共享的“原型管理器”中，當(dāng)需要新的對(duì)象時(shí)，只需從管理器獲取原型的復(fù)制。
成都創(chuàng)新互聯(lián)公司專注于惠城企業(yè)網(wǎng)站建設(shè),成都響應(yīng)式網(wǎng)站建設(shè),電子商務(wù)商城網(wǎng)站建設(shè)?；莩蔷W(wǎng)站建設(shè)公司,為惠城等地區(qū)提供建站服務(wù)。全流程定制制作，專業(yè)設(shè)計(jì)，全程項(xiàng)目跟蹤，成都創(chuàng)新互聯(lián)公司專業(yè)和態(tài)度為您提供的服務(wù)
2原型模式的實(shí)現(xiàn)
讓我們以一個(gè)具體場(chǎng)景為例，考慮開發(fā)一個(gè)鴨子養(yǎng)殖游戲。游戲中需要生成兩種鴨子：北京鴨和綠頭鴨。這兩種鴨子共享一些屬性和方法，如叫聲、游泳和渲染模型，但叫聲和渲染模型是不同的。
如果每次都從頭創(chuàng)建鴨子對(duì)象，將會(huì)產(chǎn)生大量冗余代碼，如下所示：
const duck1 = {
name: '鴨子1',
quack() {},
swim() {},
render() {}
};
const duck2 = {
name: '鴨子2',
quack() {},
swim() {},
render() {}
};這種方式重復(fù)定義相同的 quack 和 swim 方法，效率低下。如果使用簡(jiǎn)單工廠模式，代碼如下：
function createDuck(type) {
let duck;
if (type === 'beijing') {
duck = new BeijingDuck();
} else if (type === 'greenheaded') {
duck = new GreenHeadedDuck();
}
duck.swim = function() {
console.log('swimming...');
}
duck.render = function() {
console.log('render duck model...')
}
return duck;
}
const beijingDuck = createDuck('beijing');
const greenDuck = createDuck('greenheaded');但是，這樣每次創(chuàng)建鴨子對(duì)象都需要重新定義 swim 和 render 方法，不夠高效。
更優(yōu)雅的方式是將共有部分提取為一個(gè)原型：
// 鴨子原型
const DuckPrototype = {
swim() {},
render() {}
};
// 創(chuàng)建具體鴨子時(shí)復(fù)制原型
function createBeijingDuck() {
const duck = Object.create(DuckPrototype);
duck.quack = function() {}
return duck;
}
function createGreenDuck() {
const duck = Object.create(DuckPrototype);
duck.quack = function() {}
return duck;
}以上代碼展示了如何在鴨子游戲中應(yīng)用原型模式。通過(guò)原型模式，我們只需定義一次共有屬性和方法，然后通過(guò)復(fù)制原型來(lái)實(shí)例化新對(duì)象。這避免了重復(fù)代碼，提高了對(duì)象創(chuàng)建效率，并建立了對(duì)象之間的關(guān)系，方便基于原型進(jìn)行擴(kuò)展。
原型模式與相關(guān)模式的區(qū)別：
- 在工廠方法模式中，對(duì)象創(chuàng)建邏輯在工廠內(nèi)部，而原型模式通過(guò)復(fù)制原型來(lái)創(chuàng)建對(duì)象。
- 單例模式生成唯一實(shí)例，而原型模式可以生成多個(gè)相似實(shí)例。
- 建造者模式適用于創(chuàng)建過(guò)程復(fù)雜的對(duì)象，而原型模式適用于對(duì)象實(shí)例化復(fù)雜的情況。
那么，如何使用 TypeScript 實(shí)現(xiàn)更優(yōu)雅的原型模式呢？
// 原型接口
interface Prototype {
clone(): Prototype;
}
// 原型管理器類
class PrototypeManager {
private prototypes: {[key: string]: Prototype} = {};
// 省略方法定義
}
// 具體原型類
class ConcretePrototype implements Prototype {
clone() {
return Object.create(this);
}
}
// 使用
// 初始化原型管理器
const manager = new PrototypeManager();
// 設(shè)置原型對(duì)象
manager.set('proto', new ConcretePrototype());
// 請(qǐng)求原型復(fù)制實(shí)例化
const prototypeInstance = manager.get('proto').clone();以上代碼定義了原型接口、原型管理器類和具體原型類，還提供了簡(jiǎn)單的使用示例。從示例中可以看出，原型模式的關(guān)鍵是通過(guò)原型管理器來(lái)復(fù)制原型對(duì)象從而創(chuàng)建實(shí)例。
3原型模式的優(yōu)缺點(diǎn)
原型模式的主要優(yōu)點(diǎn)包括：
- 提高實(shí)例化對(duì)象的效率：通過(guò)復(fù)制原型對(duì)象，避免了重復(fù)的初始化操作。
- 隱藏實(shí)例化的復(fù)雜度：客戶端不需要了解具體的對(duì)象創(chuàng)建過(guò)程，只需請(qǐng)求原型的復(fù)制即可。
- 避免構(gòu)造函數(shù)污染：由于實(shí)例化是通過(guò)復(fù)制原型對(duì)象實(shí)現(xiàn)的，無(wú)需向構(gòu)造函數(shù)中添加不必要的代碼。
- 動(dòng)態(tài)添加和刪除原型：可以在運(yùn)行時(shí)擴(kuò)展或減少原型對(duì)象，客戶端可以直接使用新增的原型來(lái)實(shí)例化對(duì)象。
原型模式的缺點(diǎn)包括：
- 需要定義接口并確保每個(gè)具體原型類都實(shí)現(xiàn)了該接口，增加了一定的開發(fā)成本。
- 需要注意原型實(shí)例和原型之間的關(guān)系，例如修改原型會(huì)影響到其他實(shí)例。
4應(yīng)用場(chǎng)景
原型模式在以下場(chǎng)景中常見應(yīng)用：
- 對(duì)象創(chuàng)建成本較高：通過(guò)復(fù)制原型來(lái)提高效率，例如在游戲中創(chuàng)建怪物對(duì)象。
- 系統(tǒng)需要產(chǎn)生預(yù)定義原型的實(shí)例：例如用于測(cè)試的假日期對(duì)象或假支付賬單對(duì)象。
- 類的初始化需要參數(shù)：通過(guò)原型模式避免構(gòu)造函數(shù)過(guò)于復(fù)雜。
- 需要?jiǎng)討B(tài)地創(chuàng)建復(fù)雜對(duì)象：客戶端只需要關(guān)注如何獲取對(duì)象，無(wú)需了解具體創(chuàng)建過(guò)程。
以下是一些建議，在前端開發(fā)中更適合使用原型模式的情況：
1）創(chuàng)建組件類的原型：通過(guò)創(chuàng)建組件類的原型對(duì)象，使用 Object.create() 方法基于該原型快速創(chuàng)建組件實(shí)例，從而避免重復(fù)編寫組件邏輯。
// 原型類
const ComponentPrototype = {
// 組件邏輯
render() {
// ...
}
};
// 基于原型創(chuàng)建實(shí)例
const ComponentInstance = Object.create(ComponentPrototype);2）復(fù)用和配置原型對(duì)象：設(shè)計(jì)一些可配置的原型對(duì)象，如 API 配置對(duì)象，然后復(fù)制和配置這些原型來(lái)生成不同的實(shí)例，避免重復(fù)創(chuàng)建。
// 可配置的原型
const APIConfigPrototype = {
baseURL: 'https://cdxwcx.com',
timeout: 1000,
};
// 復(fù)制原型并配置生成實(shí)例
const config = Object.assign({}, APIConfigPrototype, {
timeout: 3000
});3）代理原型對(duì)象：通過(guò)原型對(duì)象實(shí)現(xiàn)代理，避免每次訪問(wèn)都重新創(chuàng)建目標(biāo)對(duì)象。
// 原型作為代理對(duì)象
const proxyPrototype = {
target: null,
get(key) {
// 懶加載
if (!this.target) {
this.target = createTargetObject();
}
return this.target[key];
}
}
// 使用代理原型
const proxy = Object.create(proxyPrototype);
proxy.foo // 觸發(fā)代理邏輯5原型模式與 JavaScript 中的 Prototype
原型模式和 JavaScript 中的原型繼承（prototype）存在以下主要區(qū)別：
- 原型模式是一種設(shè)計(jì)模式，是抽象的概念，而 JavaScript 中的 prototype 是一種具體的繼承實(shí)現(xiàn)機(jī)制。
- 原型模式的核心在于原型管理器，用于存儲(chǔ)和管理不同的原型對(duì)象。而 JavaScript 中的 prototype 屬性是函數(shù)的一個(gè)屬性，指向包含由該函數(shù)創(chuàng)建的對(duì)象共享的屬性和方法的對(duì)象。
- 原型模式通過(guò)復(fù)制原型對(duì)象來(lái)創(chuàng)建新的實(shí)例，原型與實(shí)例之間沒(méi)有必然的關(guān)系。而 JavaScript 中的原型繼承是建立原型和實(shí)例之間的關(guān)系，實(shí)例通過(guò) proto 屬性關(guān)聯(lián)到原型，可以直接訪問(wèn)原型的屬性和方法。
- 原型模式可以創(chuàng)建多個(gè)相似的對(duì)象實(shí)例，是一種對(duì)象復(fù)用的方式。而 JavaScript 中的原型繼承是實(shí)現(xiàn)類繼承的方式，通過(guò) prototype 屬性建立原型鏈，主要用于實(shí)現(xiàn)對(duì)象的繼承和復(fù)用。
- 原型模式中，原型對(duì)象和實(shí)例對(duì)象通常相互隔離，修改實(shí)例不會(huì)影響到原型。而在 JavaScript 原型繼承中，修改原型會(huì)影響到所有實(shí)例，因?yàn)閷?shí)例引用了原型。
- 原型模式可以動(dòng)態(tài)注冊(cè)和刪除原型，而 JavaScript 中的原型關(guān)系是在首次實(shí)例化時(shí)建立的，之后不可更改。
綜上所述，原型模式是一種更抽象和全面的對(duì)象復(fù)用方式，而 JavaScript 中的原型繼承只是一種具體的繼承實(shí)現(xiàn)方式，它們?cè)诤诵乃枷肷嫌兴煌Ｈ欢?，它們?cè)谔岣邔?shí)例化效率方面具有一定的相似性。
6總結(jié)
原型模式是一種創(chuàng)造型設(shè)計(jì)模式，通過(guò)復(fù)制現(xiàn)有對(duì)象的原型來(lái)創(chuàng)建新對(duì)象，提高對(duì)象創(chuàng)建效率和復(fù)用性。核心思想是在一個(gè)原型對(duì)象的基礎(chǔ)上，通過(guò)復(fù)制來(lái)生成新實(shí)例，避免重復(fù)初始化。
在實(shí)際開發(fā)中，原型模式優(yōu)化對(duì)象創(chuàng)建，通過(guò)共享原型對(duì)象避免重復(fù)定義屬性和方法，提高代碼效率。例如，前端可用于創(chuàng)建組件實(shí)例，避免重復(fù)編寫組件邏輯。
實(shí)現(xiàn)原型模式包括創(chuàng)建原型對(duì)象，然后通過(guò)復(fù)制原型創(chuàng)建新實(shí)例。原型對(duì)象通常存儲(chǔ)于原型管理器中，供需要?jiǎng)?chuàng)建對(duì)象時(shí)復(fù)制使用。
與JavaScript的原型繼承不同，原型模式更抽象靈活。它動(dòng)態(tài)添加刪除原型，避免構(gòu)造函數(shù)污染，隱藏實(shí)例化復(fù)雜性。注意每具體原型需實(shí)現(xiàn)接口，增加開發(fā)成本。
總之，原型模式通過(guò)復(fù)制對(duì)象的原型創(chuàng)建新對(duì)象，提高對(duì)象創(chuàng)建效率和復(fù)用性。頻繁創(chuàng)建相似對(duì)象場(chǎng)景下，原型模式是有用設(shè)計(jì)模式。
標(biāo)題名稱：三言兩語(yǔ)說(shuō)透設(shè)計(jì)模式的藝術(shù)-原型模式
網(wǎng)站URL：http://m.5511xx.com/article/cdpspgp.html
