資訊專欄INFORMATION COLUMN
摘要：寫在前面一些關(guān)于自己在代碼設(shè)計(jì)思維方面的學(xué)習(xí)記錄面向?qū)ο蟮囊恍├斫鈱?shí)例代碼就不上了就寫一些總結(jié)封裝提供屬性和方法的權(quán)限管理只對(duì)外暴露接口具體的功能在內(nèi)部實(shí)現(xiàn)繼承子類繼承父類的方法和屬性可以抽離公共代碼減少代碼冗余多態(tài)同一個(gè)接口在子類中的不同
寫在前面:
一些關(guān)于自己在代碼設(shè)計(jì)思維方面的學(xué)習(xí)記錄
實(shí)例代碼就不上了, 就寫一些總結(jié)
封裝: 提供屬性和方法的權(quán)限管理, 只對(duì)外暴露接口, 具體的功能在內(nèi)部實(shí)現(xiàn)
繼承: 子類繼承父類的方法和屬性, 可以抽離公共代碼,減少代碼冗余
多態(tài): 同一個(gè)接口在子類中的不同的實(shí)現(xiàn), 可以對(duì)父類中方法進(jìn)行擴(kuò)展
鍛煉自己的抽象設(shè)計(jì)能力, 通過(guò)UML類圖來(lái)展示類之間的關(guān)系
一般步驟
梳理各給類之間的關(guān)聯(lián)關(guān)系:
抽離父類, 抽象子類, 分析關(guān)聯(lián)類(相互引用的關(guān)系)
要理解以下幾點(diǎn):
// 每個(gè)獨(dú)立的對(duì)象都可以抽象為一個(gè)類
// 每個(gè)類都 要干自己該干的事(方法), 都有自己的特性(屬性)
// 關(guān)聯(lián)類: 一個(gè)類 需要用到 另一個(gè)類中的東西; 或者說(shuō)一個(gè)類 它可以作為另一個(gè)類的屬性來(lái)用
我們不需要關(guān)心業(yè)務(wù)的具體實(shí)現(xiàn)過(guò)程, 最后只需要給你一個(gè)模型,你輸入?yún)?shù)就可以套用了;下面都是結(jié)合實(shí)例來(lái)展示我的理解
// 舉個(gè)栗子
// 食品實(shí)例生成的詳細(xì)過(guò)程
class Food {
constructor(name, type) {
this.name = name // 食品
this.type = type // 食品類型
}
desc() {
console.log(`我是${this.name},屬于${this.type}類型`);
}
}
class FoodFactory {
// ES6中靜態(tài)方法不會(huì)被實(shí)例調(diào)用,可以被類調(diào)用
static create(name, type) {
// 創(chuàng)建一種食品實(shí)例
return new Food(name, type)
}
}
// 工廠開(kāi)始生產(chǎn)食品實(shí)例了
FoodFactory.create("核桃", "堅(jiān)果").desc() // 我是核桃, 屬于堅(jiān)果類型
FoodFactory.create("旺仔", "飲品").desc() // 我是旺仔, 屬于飲品類型
// 這樣我們就可以 生成出我們想要的食品, 只要你給我們 一個(gè)名稱和類型
單例模式
就是保證全局只有一個(gè)對(duì)象可以訪問(wèn); 像全局緩存、全局狀態(tài)管理時(shí),都可以使用, 實(shí)現(xiàn)數(shù)據(jù)共享
我們要確保一個(gè)類 只能初始化 一個(gè)實(shí)例, 有就直接返回, 沒(méi)有就初始化
如購(gòu)物車, 登錄框只有一個(gè), jQuery的 $, vuex的store都是單例模式的思想
class Singleton {
// js模擬
constructor() {}
login() {
console.log("login...");
}
}
// 給類掛載一個(gè)靜態(tài)方法, 只有一個(gè)
// 自執(zhí)行函數(shù): 只是為了將變量保存在 函數(shù)的作用域中, 避免污染而已
Singleton.singleInstance = (function () {
// 通過(guò)閉包實(shí)現(xiàn): 類似通過(guò)一個(gè)全局變量來(lái)存儲(chǔ)這個(gè)實(shí)例
let instance; // 保存創(chuàng)建好的實(shí)例
return function() {
if (!instance) {
// 如果沒(méi)有創(chuàng)建, 就創(chuàng)建一個(gè)
instance = new Singleton()
}
return instance
}
})()
// 通過(guò)調(diào)用靜態(tài)方法來(lái)創(chuàng)建單實(shí)例
let single11 = Singleton.singleInstance()
let single22 = Singleton.singleInstance()
// 通過(guò)調(diào)用類 初始化的實(shí)例
let single3333 = new Singleton()
single11.login();
single22.login();
console.log(single11 === single22); // ture
console.log(single11 === single3333); // false
demo演示, 頁(yè)面登錄框
class LoginForm {
constructor() {
this.state = "hide" // 初始狀態(tài)
}
// 顯示
show() {
if (this.state === "show") {
console.log("登錄框已經(jīng)顯示");
return ;
}
this.state = "show";
console.log("登錄框顯示了, 請(qǐng)輸入");
}
// 隱藏
hide() {
if (this.state === "hide") {
console.log("登錄框已隱藏");
return ;
}
this.state = "hide";
console.log("登錄框隱藏");
}
}
// 添加單例方法
// 通過(guò)這個(gè)方法, 我初始化出來(lái)的 都是指向同一個(gè)實(shí)例對(duì)象
LoginForm.initSingle = (function () {
let instance; // 存儲(chǔ)實(shí)例對(duì)象
return function () {
if (!instance) {
instance = new LoginForm()
}
return instance
}
})()
// 當(dāng)同時(shí)對(duì)一個(gè)實(shí)例進(jìn)行操作時(shí):
// 頁(yè)面1的登陸操作
let login1 = LoginForm.initSingle()
login1.show()
// 頁(yè)面2的登陸操作
let login2 = LoginForm.initSingle()
login2.show() // 登陸框已經(jīng)顯示, 頁(yè)面2也是對(duì)同一實(shí)例進(jìn)行訪問(wèn),就會(huì)彈出錯(cuò)誤
login2.hide()
// 單例模式 就是實(shí)例化出來(lái)的對(duì)象 都指向同一實(shí)例, 對(duì)同一實(shí)例進(jìn)行操作,
// 實(shí)現(xiàn)了 數(shù)據(jù)共享
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/102571.html
摘要：工廠模式實(shí)例定義一個(gè)接口定義一個(gè)實(shí)現(xiàn)類定義一個(gè)實(shí)現(xiàn)類根據(jù)不同需求返回不同實(shí)現(xiàn)類的方法運(yùn)行結(jié)果單利模式實(shí)例懶漢式餓漢式 工廠模式實(shí)例 //定義一個(gè)接口：Vehicle interface Vehicle{ void work(); } //定義一個(gè)實(shí)現(xiàn)類：Car class Car implements Vehicle{ @Override public void wo...
摘要：注意事項(xiàng)聲明函數(shù)時(shí)候處理業(yè)務(wù)邏輯區(qū)分和單例的區(qū)別，配合單例實(shí)現(xiàn)初始化構(gòu)造函數(shù)大寫字母開(kāi)頭推薦注意的成本。簡(jiǎn)單工廠模式使用一個(gè)類通常為單體來(lái)生成實(shí)例。 @(書籍閱讀)[JavaScript, 設(shè)計(jì)模式] 常見(jiàn)設(shè)計(jì)模式 一直對(duì)設(shè)計(jì)模式不太懂，花了一下午加一晚上的時(shí)間，好好的看了看各種設(shè)計(jì)模式，并總結(jié)了一下。 設(shè)計(jì)模式簡(jiǎn)介 設(shè)計(jì)模式概念解讀 設(shè)計(jì)模式的發(fā)展與在JavaScript中的應(yīng)用 ...
摘要：滿足此要求的簡(jiǎn)單模式是在創(chuàng)建新實(shí)例時(shí)將資源傳遞給構(gòu)造函數(shù)。依賴注入同樣適用于構(gòu)造函數(shù)靜態(tài)工廠第項(xiàng)和構(gòu)建器第項(xiàng)。將資源工廠傳遞給構(gòu)造函數(shù)就會(huì)變成一個(gè)有用的模式。這種做法稱為依賴注入，將極大地增強(qiáng)類的靈活性，可重用性和可測(cè)試性。 ??許多類依賴于一個(gè)或多個(gè)底層資源。 例如，拼寫檢查器依賴于字典。常見(jiàn)的做法是將這些類實(shí)現(xiàn)為靜態(tài)實(shí)用程序類(第4項(xiàng))： // Inappropriate use ...
摘要：定義與類型定義又叫門面模式，提供了一個(gè)統(tǒng)一的接口，用來(lái)訪問(wèn)子系統(tǒng)中的一群接口外觀模式定義了一個(gè)高層接口，讓子系統(tǒng)更容易使用類型結(jié)構(gòu)型類圖門面模式是對(duì)系統(tǒng)復(fù)雜的關(guān)系處理做了一個(gè)封裝，對(duì)外提供一個(gè)簡(jiǎn)單的接口，成員介紹子系統(tǒng)被門面模式封裝的子系統(tǒng) 0x01.定義與類型 定義：又叫門面模式，提供了一個(gè)統(tǒng)一的接口，用來(lái)訪問(wèn)子系統(tǒng)中的一群接口 外觀模式定義了一個(gè)高層接口，讓子系統(tǒng)更容易使用 類型...
摘要：原文單例模式被熟知是因?yàn)樗岩粋€(gè)類的實(shí)例化限制在只有一個(gè)對(duì)象。這在中也是可以實(shí)現(xiàn)的。單例和靜態(tài)對(duì)象都很有用，但是不能過(guò)度使用。實(shí)踐中，當(dāng)我們?cè)谡麄€(gè)系統(tǒng)中只需要一個(gè)對(duì)象與其他對(duì)象通信的時(shí)候，單例模式是非常有用的。 原文：The Single Pattern 單例模式被熟知是因?yàn)樗岩粋€(gè)類的實(shí)例化限制在只有一個(gè)對(duì)象。傳統(tǒng)的實(shí)現(xiàn)方式是：創(chuàng)建一個(gè)類，這個(gè)類里面有一個(gè)方法在對(duì)象不存在的時(shí)候創(chuàng)造一...
閱讀 1642·2023-04-26 02:50
閱讀 3627·2023-04-26 00:28
閱讀 2009·2023-04-25 15:18
閱讀 3279·2021-11-24 10:31
閱讀 1082·2019-08-30 13:00
閱讀 1071·2019-08-29 15:19
閱讀 1834·2019-08-29 13:09
閱讀 3043·2019-08-29 13:06
