原创 js常用設計模式10-裝飾者模式 1，裝飾者模式實現飛機大戰 2，用AOP裝飾函數 3，試一試before的威力
能動態的給對象增加職責的方式稱爲裝飾者模式。 裝飾者模式能夠在不改變對象自身的基礎上，在程序運行期間給對象動態地添加職責。跟繼承相比，裝飾者模式靈活很多，“即用即付”，有點熱插拔那味了。 1，裝飾者模式實現飛機大戰 現在我們有一個飛機，初始
2021-01-21 00:51:35
原创 js常用設計模式11-狀態模式 1，一個簡單的電燈程序 2，改進的燈泡程序 3，light增加新的狀態 4，關鍵之處
狀態模式的關鍵是區分事物內部的狀態，事物內部狀態的改變往往會帶來事物的行爲改變 1，一個簡單的電燈程序 我們設想這麼一個場景：有一個電燈，燈開的時候，按開關，啪一下就關了；燈關的時候，按開關，啪一下就開了。 同一個開關，不同的狀態下執行，表
2021-01-21 00:51:35
原创 js常用設計模式9-中介者模式 1，現實中的中介者 2，中介者模式的例子------文字版泡泡堂遊戲 3，爲遊戲增加隊伍 4，存在的問題 5，中介者模式的優缺點
面向對象設計鼓勵將行爲分散到對象中，把對象劃分爲更小的粒度，有助於增強對象的可複用性。但是粒度太小又導致對象之間聯繫增加，進一步導致複用性降低。 中介者模式的作用就是解除對象與對象之間緊密的耦合。 1，現實中的中介者 機場指揮者：調度範圍所
2021-01-20 00:50:07
原创 js常用設計模式8-職責鏈模式 1，現實中的職責鏈模式 2，實際開發中的職責鏈模式 3，用職責鏈模式重構代碼 4，職責鏈優化 5，異步的職責鏈
職責鏈模式：使多個對象都有機會處理請求，從而避免請求的發送者和接收者之前的耦合關係，將這些對象連成一條鏈，並沿着這條鏈傳遞該請求，知道又一個對象處理它爲止。 1，現實中的職責鏈模式 公交車上人很多的時候，把卡給前面的人，一個一個往前遞過去，
2021-01-20 00:50:07
原创 js常用設計模式6-組合模式 1，命令模式和組合模式的聯合應用 2，分析一下組合模式 3，更強大的宏命令 4，組合模式的實例-掃描文件夾 5，一些需要注意的地方 6，葉對象引用父對象 7，小結
組合模式和命令模式有點像，命令模式是一個個小的指令，而組合模式是一些小指令組合成的大指令 1，命令模式和組合模式的聯合應用 試想這麼一個場景：我們回家之後先關門，然後開電腦，最後打開QQ 關門，開電腦，開QQ是三個命令，現在我們用Macro
2021-01-19 00:50:24
原创 js常用設計模式7-享元模式 1，假髮工廠 2，享元模式優化 3，內部狀態與外部狀態 4，普通版本上傳文件的例子 5，享元模式優化文件上傳
享元模式是一種用於性能優化的模式，核心是運用共享技術來有效支持大量細粒度的對象。 如果系統中創建了大量類似的對象，導致內存佔用過高，這時候享元模式就很有用了。 1，假髮工廠 假設有一個假髮工廠，生產50種男士假髮和50種女士假髮，這時候我們
2021-01-19 00:50:24
原创 js常用設計模式2-策略模式 1，計算獎金 2，表單校驗 3，策略模式的優缺點
在生活中，我們去某個地方，可以走路，騎自行車，坐地鐵，坐火箭等等，方案很多。 策略模式的定義：定義一系列算法，把他們一個個封裝起來，並且使他們可以相互替換。 1，計算獎金 1.1，根據員工績效和工資來發獎金。 //策略模式：最初代碼實現 v
2021-01-17 00:50:35
原创 js常用設計模式5-命令模式 1，菜單程序 2，用閉包來實現 3，撤銷命令 4，小結
命令模式是最簡單和優雅的模式之一，命令模式中的命令（command）指的是一個執行某些特定事情的指令。 設計模式的主題總是把不變的事物和變化的事物分離開來，命令模式也不例外。 應用場景：請求者需要做一些操作，但是並不需要這些操作是誰來做，只
2021-01-17 00:50:25
原创 js常用設計模式4-發佈-訂閱模式 1，售樓消息訂閱 2，修改代碼，讓訂閱者只收到自己的消息 3，發佈-訂閱模式的通用實現 4，取消訂閱 5，全局的發佈-訂閱模式 6，總結
發佈-訂閱模式也叫觀察者模式，它定義對象之間一種一對多的依賴關係，當一個對象的狀態發生改變時，所有依賴於它的對象都將得到通知。在javaScript開發中，我們一般用事件模型來代替傳統的發佈-訂閱模式。 DOM的addEventListen
2021-01-17 00:50:25
原创 js常用設計模式3-代理模式 1，例子-小明追妹子 2，保護代理和虛擬代理 3，虛擬代理實現圖片預加載 4，虛擬代理在惰性加載中的應用
代理模式是爲一個對象提供一個代用品或佔位符，以便控制對它的訪問 1，例子-小明追妹子 （1） 小明喜歡一個妹子，現在小明直接給妹子送花 var Flower = function () { } var xiaoming = { se
2021-01-17 00:50:25
原创 js常用算法1---單例模式
單例模式的定義：保證一個類僅有一個實例，並提供一個訪問它的全局訪問點 1，簡單實現 var Singleton = function (name) { this.name = name } Singleton.instance =
2020-11-09 17:27:00
原创 url輸入之後發生了什麼以及優化點 一，url解析以及緩存 二，DNS解析 三，減少HTTP請求和請求資源大小 四，發送http請求之後應用緩存（把內容緩存起來，他不香嗎） 七，瀏覽器渲染
已經建立連接了，但是服務器崩潰了，怎麼辦？ HSTS 緩存校驗 DNS解析（20ms到120ms） 一，url解析以及緩存 二，DNS解析 1，首先本地解析，沒有的話再去別的地方找（遞歸過程--深度搜索） 2，去DNS服務器
2020-07-26 19:39:42
原创 http詳解 一， http請求過程： 二， 網絡協議分層： 三， http歷史： 四， 跨域CORS 五， HTTP請求頭以及緩存Cache-Control 六 https:
1，http使用場景： 網頁輸入url ajax獲取數據 img標籤加載圖片 2，主要技術點：緩存，這是最能優化性能的地方！！！ cache-control： public，private must-revalidate no-chche，
2020-07-26 19:39:32
原创 ajax跨域的幾種方式
url:http://localhost/CORS/ajax/index.html 文件目錄： 一，首先，ajax使用： // 創建對象 var ajax = new XMLHttpRequest(); // 建立連接 ajax.op
2020-06-16 04:50:30
原创 js執行上下文 一，執行上下文的類型 二，執行上下文的生命週期
執行上下文（Execution Context）：函數執行前進行的準備工作（也稱執行上下文環境）。 當執行代碼進入一個環境時，就會爲該環境創建一個執行上下文，它會做一些準備工作，如變量提升，確定作用域等。 一，執行上下文的類型 js中有三
2020-06-16 04:50:30