原创 觸發層疊上下文的CSS屬性
層疊上下文，又稱stacking context，是指元素在垂直於屏幕的z軸上的排列布局。 其中影響層疊上下文的屬性包括以下幾種： 1. flex元素的子元素，同時z-index不是auto 2. opacity值不爲1的元素 3. tr
2020-06-01 12:08:44
原创 css控制單行文字溢出...
利用overflow實現單行文字溢出點點點效果： text-overflow：clip|ellipsis|string; white-space:nowrap; overflow:hidden; clip: 直接修剪文本，文本末端
2020-06-01 12:08:44
原创 CSS網頁變灰
IE7, 8, 9 body { filter: gray; } IE10, 11 由於grayscale.js會使頁面渲染速度變慢，而且會在IE低版本下無效，所以要判斷瀏覽器版本，給IE10, 11單獨使用。 <script
2020-04-14 11:10:42
原创 工作交接
RC Admin Panel 項目簡介 項目前端主要使用react+redux+react-router+redux-sage以及react周圍生態構建。 項目後端使用nodejs+express+mongodb+mongoose以及
2019-08-08 21:01:45
原创 職責鏈模式
職責鏈模式的定義是：使多個對象都有機會處理請求，從而避免請求的發送者和接收者之間的耦合關係，將這些對象連成一條鏈，並沿着這條鏈傳遞該請求，直到有一個對象處理它爲止。 假設我們負責一個售賣手機的電商網站，經過分別交納 500 元定金和 20
2019-06-11 00:21:47
原创 裝飾者模式
裝飾者模式就是一種給對象動態添加職責的模式。裝飾者模式能夠在不改變對象自身的情況下，在程序運行期間動態的給對象添加職責。 我們可以使用AOP來裝飾函數： Function.prototype.before = function(befo
2019-06-11 00:21:47
原创 發佈-訂閱模式
發佈—訂閱模式又叫觀察者模式，它定義對象間的一種一對多的依賴關係，當一個對象的狀態發生改變時，所有依賴於它的對象都將得到通知。 發佈—訂閱模式可以廣泛應用於異步編程中，這是一種替代傳遞迴調函數的方案。 比如，我們可以訂閱 ajax 請求的
2019-05-29 20:08:31
原创 單例模式
JavaScript單例模式的核心是確保只有一個實例，並提供全局訪問。 var getSingle = function(fn) { var result; return function() { ret
2019-05-29 20:08:31
原创 策略模式
策略模式的定義是：定義一系列的算法，把它們一個個封裝起來，並且使它們可以互相替換。 策略模式可用於緩動動畫，表單驗證等方面。 下面的代碼是用於表單驗證的策略模式。 /*******************策略類*************
2019-05-29 20:08:31
原创 原型模式
原型模式是一種用於創建對象的模式，原型模式不關心對象具體類型，而是通過克隆一個已有對象來創建新的對象。 JavaScript原型繼承遵循以下規則： 所有數據都是對象。 得到一個對象，不是通過實例化類，而是通過克隆一個對象生成的。 對象會記
2019-05-29 20:08:31
原创 實現new操作符
new操作符返回一個對象，所以需要在函數內部返回一個對象。 這個對象，也就是構造函數中的this，可以訪問到掛載在this上的任意屬性。 這個對象可以訪問到構造函數原型上的屬性，所以需要將對象與構造函數鏈接起來。 只有返回值是對象，才進行
2019-05-29 20:08:31
原创 JavaScript深度優先遍歷和廣度優先遍歷
深度優先遍歷DFS 假設初始狀態是圖中所有頂點均未被訪問，則從某個頂點v出發，首先訪問該頂點然後依次從它的各個未被訪問的鄰接點出發深度優先搜索遍歷圖，直至圖中所有和v有路徑相通的頂點都被訪問到。若此時尚有其他頂點未被訪問到，則另選一個未
2019-04-14 21:52:27
原创 節流和防抖的個人見解
防抖（debounce），是指在觸發事件後n秒內函數只執行一次，如果在n秒內又觸發了事件，則會重新計算函數執行時間。 function debounce(func, wait) { let timer; return
2019-04-14 21:52:27
原创 寫 React / Vue 項目時爲什麼要在列表組件中寫 key，其作用是什麼？
key的作用就是給每一個VNode一個唯一的key，通過key可以更準確更快的拿到VNode。 vue和react都是採用diff算法來對比新舊虛擬節點，從而更新節點。當新節點跟舊節點頭尾交叉對比沒有結果時，會根據新節點的key去對比舊節
2019-04-14 21:52:27
原创 ['1', '2', '3'].map(parseInt) what & why ?
parseInt parseInt函數接受一個字符串作爲參數，返回一個指定基數的整數 。 const intValue = parseInt(string[, radix]); string：要被解析的值。 radix：一個介於2和36
2019-04-14 21:52:27