原创 正則表達式總結（JavaScript忍者祕籍第二版）
正則表達式 創建 字面量語法 /表達式內容/後跟修飾符 構造函數 new RegExp(‘表達式內容’, ‘修飾符’) 修飾符 i : 對大小寫不敏感； g : 查找所有匹配項，即全局查找匹配；全局匹配時，返回的數組元素爲在
2020-07-07 17:47:43
原创 HTML編碼、innerHTML、innerText與URL編碼
HTML編碼字符集 爲了讓瀏覽器知道頁面應該顯示什麼，必須要給頁面一個明確的字符集用於瀏覽器編碼解碼。通常，我們都用utf-8字符集。如<meta charset="UTF-8">來指定頁面所用的字符集。這樣一來，瀏覽器可以根據u
2020-07-07 17:47:43
9
原创 CSS經典佈局——sticky footer粘滯頁腳
簡述 sticky footer粘滯頁腳佈局是經常使用的CSS經典佈局之一，其表現形式是：頁腳始終在視口的底部，不管是內容區內容較少不足以佔據視口高度，還是內容區內容很多超過視口高度導致出現滾動條，頁腳都處於視口的底部，並且不會遮
2020-07-07 17:47:43
2
原创 npm包安裝與npm link
npm包安裝的兩種方式 全局安裝 npm install <package-name> -g 意義：將安裝的包作爲一個命令行工具，在任意目錄下都可以訪問調用 安裝路徑：默認安裝在 /usr/local/lib/node_modu
2020-07-07 17:47:40
2
原创 JavaScript語言層面的優化
JavaScript優化 內存管理 高級語言自帶垃圾回收機制 如果不注意內存管理，可能會導致內存泄漏問題。 內存管理：開發者主動申請空間、使用空間和釋放空間。JavaScript中並未提供相應的API，由執行引擎根據語言來執行內
2020-07-07 17:47:40
原创 JavaScript的函數式編程簡介
函數式編程的優點 React的推廣、Vue3開始採用 可以拋棄模擬面向對象編程的this 打包時，利用sideEffects來過濾副作用代碼 方便測試，並行處理 lodash、underscore、ramda等庫幫助開發 與數據
2020-07-07 17:47:40
原创 ES2015新特性
ECMAScript概述 JavaScript = ECMAScript + 運行環境的API 其中，運行環境包括瀏覽器和Node環境 ES2015（ES6來泛指ES2015之後的新標準）新特性 解決原有用語法上的不足 let、c
2020-07-07 17:47:40
原创 JavaScript相關的類型註解系統
TypeScrip 類型系統 強類型與弱類型（類型安全方面） 非權威機構的定義 強類型 函數的實參與形參的類型必須相同 類型約束 不允許隱式類型轉換 弱類型 函數的實參與形參的類型在語法上不必相同 類型上約束少 允許任意的數
2020-07-07 17:47:40
4
原创 ES6中的Promise實現原理
說明 由於手寫實現Promise無法區別宏任務與微任務，因此這裏的實現源碼只是爲了理解。 Promise規範要點 Promise是一個類，接收一個函數作爲參數，該函數稱爲執行器，創建Promise對象時，執行器會立刻執行； Pr
2020-07-07 17:47:40
原创 前端工程化之自動化構建
自動化構建 源代碼自動轉換爲生產環境代碼 NPM Scripts腳本實現自動化 利用npm scripts腳本實現自動化，npm scripts原理參照阮一峯老師博客 鉤子機制實現構建流： pre-<name>：該命令在nam
2020-07-07 17:47:37
原创 前端工程化之腳手架工具
腳手架工具 常用腳手架工具 React項目create-react-app Vue項目vue-cli Angular項目angular-cli Yeoman通用型腳手架工具 Plop創建一個組件/模塊所需要的文件（類似於Yeom
2020-07-07 17:47:37
1
原创 typescript--裝飾器
裝飾器 可以對類、類的屬性（數據屬性、訪問器屬性）和方法、方法的參數進行包裝，擴展或修改原來的功能。 目前作爲一項實驗性的特性，需要在tsconfig.json配置中打開Experimental Options選項 /* Expe
2020-07-07 17:47:37
6
原创 從matrix變換函數矩陣來說明CSS Transform的原理和操作
文章以二維變換爲例說明，三維變換採用類似的操作理解即可。 變換的座標系統 默認的變換座標系統，變換原點爲元素中心，x軸與y軸與web中定義的一致。其中，變換原點可以用transform-origin屬性來設置。transform是
2020-05-11 20:53:04
1
原创 button元素被點擊後自動獲得焦點
元素在被鼠標點擊後，會自動獲得焦點，此時如果按下enter鍵，就會觸發元素的click事件。但是元素如果是用Tab鍵獲得焦點後按下enter，則只會觸發一次click，然後就失去焦點，再按下enter鍵並不會觸發click事件。因
2020-04-15 09:57:55
原创 JavaScript設計模式——單例模式
本文由《JavaScript設計模式與開發實踐》–曾探著總結而來。 應用場景 某個作用域內（如全局作用域）只需要一個具備功能的對象。例如全局的window，登錄框等等。總之，就是在頂級的作用域中用來掌控頂級信息的對象。這樣的對象是
2020-02-28 01:11:05