原创 🔒 CSP——前端安全第一道防線
⭐️ 更多前端技術和知識點，搜索訂閱號 JS 菌 訂閱 內容安全策略的主要作用就是儘量降低網站遭受 XSS 跨站腳本攻擊的可能。瀏覽器沒辦法區分要執行的代碼是否爲頁面本身的還是惡意注入的，XSS 就是利用這一點對網站進行攻擊。 🙁 CSP
2019-03-30 00:45:01
原创 Node 引入 ESM 新方案
2019年3月29日目前，Node 對 ES6 Module 的支持又有新進展。一個新的 PR 更新了當前 --experimental-modules 的實現方案。 type 動態判斷模塊加載模式 更新後的方案將根據 package.j
2019-03-29 17:15:05
原创 Permission API 統一查詢權限狀態
Permission API 不是一個新的標準，早在 2015 年，就已經成爲標準。這個 API 的主要作用就是提供一個統一的查詢 API 權限的接口。 😌 如果我們使用 Notification API，那麼需要這樣操作： Notifi
2019-03-26 23:15:11
6
原创 🍉 PWA 系列（三）——IndexedDB
IDB 操作的基本步驟是 open 方法打開數據庫 🗄 然後是創建數據庫 store 對象倉庫 📂 需要注意更新數據庫版本應先調用 close 方法關閉舊版數據庫 需要注意創建 store 一定要在新版本數據庫的 upgradene
2019-03-26 21:45:08
1
原创 🍉 PWA系列——Fetch API
🍉 PWA系列——Fetch API 今天聊聊 xhr 的替代品 Fetch，在全局作用域中有個 fetch 方法方便使用。雖然同樣也是處理 HTTP 請求和響應的，但 fetch 有兩個不同之處，一個是收到錯誤的 HTTP 狀態碼時，f
2019-03-25 00:05:05
1
原创 🍉 PWA 系列（一）——Cache API
🍉 PWA 系列（一）——Cache API PWA（Progressive web apps，漸進式 Web 應用）運用現代的 Web API 以及傳統的漸進式增強策略來創建跨平臺 Web 應用程序。 PWA 主要用到了瀏覽器儲存技術、
2019-03-24 01:45:08
1
原创 瀏覽器畫中畫模式初窺
瀏覽器畫中畫模式 瀏覽器畫中畫功能允許用戶在一個小的疊加窗口中彈出網頁中播放的視頻 🎥，Chrome 版本大於 71 均默認開啓該功能。下面簡單介紹一下該 API 如何使用 📖 準備工作 首先要有個 video，以及一個 btn ⏹ 用來
2019-03-23 11:15:09
原创 [譯]使用 JavaScript 對象 Rest 和 Spread 的7個技巧
[譯]使用 JavaScript 對象 Rest 和 Spread 的7個技巧 原文作者：Joel Thoms 原文標題：7 Tricks with Resting and Spreading JavaScript Objects 原文
2019-03-22 08:45:08
原创 📦 首個瀏覽器內置模塊 kv-storage 異步版的 localStorage
瀏覽器內置模塊 kv-storage 異步版的 localStorage LocalStorage 大家都不陌生基本上每天都在跟他打交道。但這是個會阻塞主線程的同步 API，很多情況下存取大量數據可能會造成性能問題。🙁 爲了解決這個問題，
2019-03-20 23:45:07
原创 記一次自定義導航欄及加載動畫的解決方案
記一次自定義導航欄及加載動畫的解決方案 主要邏輯就是動態獲取設備的 statusBarHeight 和 titleBarHeight，來設置導航欄的高度和 paddingTop ip6 ipx loading 導航欄是一個組件，自定
2019-03-20 16:45:03
原创 🔌 TS 的 Interface 瞭解一下？
Interface 是一種描述對象或函數的東西。你可以把它理解爲形狀，一個對象需要有什麼樣的屬性，函數需要什麼參數或返回什麼樣的值，數組應該是什麼樣子的，一個類和繼承類需要符合什麼樣的描述等等。下文分七個部分，一起看一下對象接口、函數接口
2019-03-19 00:05:08
原创 🕕30 秒瞭解尾遞歸和尾遞歸優化
之前提到過尾調用，尾調用就是函數的最後一步調用另外一個函數。那麼遞歸就是調用自身，尾遞歸就是再函數的最後一步調用自身。😵 和尾調用一樣，尾遞歸因爲調用棧中只存在一個調用記錄，因此不會像普通遞歸那樣耗費那麼多內存。 以乘階函數爲例 func
2019-03-18 10:15:09
原创 💎 一文看懂 JS 繼承
最近回顧 js 繼承的時候，發現還是對一些概念不是很清晰。這裏再梳理一下 JS 中繼承的幾種主要的方式，構造函數繼承、原型鏈繼承、組合繼承以及原型式繼承、寄生式繼承、寄生組合式繼承和 ES6 的 Class： 構造函數繼承 構造函數繼承沒
2019-03-17 20:55:07
原创 [譯] 理解 JavaScript Mutation 突變和 PureFunction 純函數
作者：Chidume Nnamdi 英文原文：https://blog.bitsrc.io/unders... [譯] 理解 JavaScript Mutation 突變和 PureFunction 純函數 不可變性、純函數、副作用
2019-03-15 23:45:05
6
原创 圖解原型和原型鏈
圖解原型和原型鏈 原型和原型鏈是 JS 中不可避免需要碰到的知識點📕，本文使用圖片思維導圖的形式縷一縷原型、原型鏈、實例、構造函數等等概念之間的關係🌚 Constructor 構造函數 首先我們先寫一個構造函數 Person，構造函數一般
2019-03-14 22:55:12
5