CSS 佈局方式與JavaScript數據結構和算法

一、常見 CSS 佈局方式
詳見： 一些常見的 CSS 佈局方式梳理，涉及 Flex 佈局、Grid 佈局、聖盃佈局、雙飛翼佈局等。

二、幾種 JavaScript 動畫庫推薦
JavaScript 庫對設計師和開發人員來講，都是很是有用的工具。它們能夠爲你的網站添加一些超級強大的功能，給用戶帶來更好的體驗。

三、JS 命名與註釋規範詳解
從事前端開發也有一段時間了，一直在遵循着規範化開發，從 js 也逐漸轉向了 ts ，在這個過程當中也有了不少收穫，在此把本身的開發心得寫下來。 本文參考了 JavaScript 開發規範 ，並作了補充和修改，同時刪去了框架開發相關的內容。

四、JavaScript數據結構和算法
數據結構和算法對於不少前端工程師來講，一直以爲是無關緊要的，但其實否則，我的以爲，前端工程師實際上是最須要重視數據結構和算法的人，由於前端所作的東西是用戶訪問網站第一眼看到的東西，特別在移動浪潮到來以後，對用戶體驗愈來愈高，對前端提出了更高的要求，面對愈來愈複雜的產品，須要堅實的數據結構和算法基礎才能駕馭。 若是沒有學習過計算機科學的程序員，當咱們在處理一些問題時，比較熟悉的數據結構就是數組，數組無疑是一個很好的選擇。但不少時候，對於不少複雜的問題，數組就顯得太過簡陋了，當學習了數據結構和算法以後，對於不少編程問題，當想到一個合適的數據結構後，設計和實現解決這些問題的算法就手到擒來。

五、JavaScript數據類型的存儲
一個很基礎的知識點，JavaScript中基本數據類型和引用數據類型是如何存儲的。 因爲本身是野生程序員，在剛開始學習程序設計的時候沒有在乎內存這些基礎知識，致使後來在提到「什麼什麼是存在棧中的，棧中只是存了一個引用」這樣的話時老是一臉懵逼。。 後來漸漸的瞭解了一些內存的知識，這部分仍是很是有必要了解的。

六、iframe和HTML5 blob實現JS,CSS,HTML直接當前頁預覽
這前端代碼效果實時預覽的需求其實是很是常見的，例如jsbin，codepen，runjs之類的網站就是知足此需求的。傳統作法是這樣子的，會新建一個另外的獨立頁面，專門用來接收傳入的前端代碼，經過新開窗口或者嵌入iframe頁面的方式達到最終效果，其中可能會用到 HTML5 postMessage等通訊技術 。本文講述 藉助iframe和blob實現前端代碼的實時預覽。

七、淺談JavaScript中的接口實現
接口是面向對象JavaScript程序員的工具箱中最有用的工具之一。在設計模式中提出的可重用的面向對象設計的原則之一就是「針對接口編程而不是實現編程」，即咱們所說的面向接口編程，這個概念的重要性可見一斑。但問題在於，在JavaScript的世界中，沒有內置的建立或實現接口的方法，也沒有能夠判斷一個對象是否實現了與另外一個對象相同的一套方法，這使得對象之間很難互換使用，好在JavaScript擁有出色的靈活性，這使得模擬傳統面向對象的接口，添加這些特性並不是難事。接口提供了一種用以說明一個對象應該具備哪些方法的手段，儘管它能夠代表這些方法的含義，可是卻不包含具體實現。有了這個工具，就能按對象提供的特性對它們進行分組。

八、深刻理解 JavaScript 中的 this
你是否常常被JavaScript中的this關鍵字搞暈? 不用太過於小心, 不少JavaScript的初學者都被它搞暈過. 你不是一我的在戰鬥. 話雖如此, 但這並不意味着你能夠永遠不用理解this. 無論是在JavaScript中仍是在許多教程中, 都普遍的使用this, 因此掌握this是早晚的事. 一旦你理解this, 就會以爲它實際上比你想象的簡單許多. 讀過這篇文章之後, 你就會深刻理解this的祕密. 到時候你就知道它是什麼, 它作什麼以及如何使用它.

九、如何編寫輕量級 CSS 框架
想說的東西不少，卻又無從提及。現在輕量級框架如雨後春筍，層出不窮。我想每一個人都應該概括總結工做中的常見需求，編寫一套適合本身的 CSS 框架。 （by nzbin）

十、JavaScript 中的執行上下文和調用棧是什麼？
詳見： 一篇文章帶你瞭解 JavaScript 基本概念之執行上下文。在本文中，做者將幫助你理解 JavaScript 解釋器是如何執行你的代碼的。

十一、JavaScript精進之路 — 異步的實現（上）
程序中如今運行部分和未來運行部分的關係就是異步編程的核心。簡單來說，若是程序中出現了一部分要在如今運行（順序同步執行），一部分要在未來運行（多是設置了timeout也多是一個ajax的異步調用後執行的函數），那麼二者之間的關係的構建就構成了異步編程。

十二、深度好文 | JavaScript 疲勞終極指南：咱們行業的真相
上週我在 NebraskaJS 2017 會議上作了一個和這個話題極其相似的演講，我也收到了許多積極的反饋，因此我就想這個演講也能夠寫成一篇文章發表出來，讓更多的人知道，並幫助他們應對 JS 疲勞，理解咱們行業的真相。 這篇文章的目的是但願改變你對軟件工程行業的廣泛的見解，助你在你可能工做的領域上一臂之力。
1三、在JavaScript中實現隊列
隊列和棧很是相似，可是使用了不一樣的原則，而非後進先出。 隊列是遵循FIFO（First In First Out，先進先出， 也稱先來先服務）原則的一組有序的項。隊列在尾部添加新元素，並從頂部移除元素。最新添加的元素必須排在隊列的末尾。 在現實中，最多見的例子就是排隊： 排在第一位的人會先接受服務。

1四、深刻淺出 Web Audio Api
Web Audio API 須要在音頻上下文中處理音頻的操做，並具備模塊化路由的特色。基本的音頻操做是經過音頻節點來執行的，這些音頻節點被鏈接在一塊兒造成音頻路由圖。咱們能夠從上面這段文字中提取出幾個關鍵詞： 音頻上下文 音頻節點 模塊化 音頻圖 我將會以這些關鍵詞爲開始，慢慢介紹什麼是 Web Audio Api，如何使用 Web Audio Api 來處理音頻等等。

1五、2017年8月前端開發者超實用乾貨大合集
在過去的幾年當中，網絡上所流傳的各類設計和開發資源，在素質上有明顯的提高。其中有一些已經幾乎成爲了設計師和開發者必備的工具，可是其中絕大多數因爲其應用範疇的侷限，或者傳播不夠廣，致使它們大多並廣爲人知。將這些素材集中到一塊兒，很大程度上是但願它們的目標用戶可以明白，須要這些工具的時候，上哪兒找。 此次的前端乾貨合集內容也很齊全，仔細看看，總能找到幾款你所須要的。

1六、我的總結（css3新特性）
css3這個相信你們不陌生了，是個很是有趣，神奇的東西！有了css3，js均可以少寫不少！我以前也寫過關於css3的文章，也封裝過css3的一些小動畫。我的以爲css3不難，可是很難用得好，用得順手，最近我也在過一遍css3的一些新特性（不是所有，是我在工做上經常使用的，或者以爲有用的），以及一些實例，就寫了這一篇總結！但願，這篇文章能幫到你們認識css3。寫這篇文章主要是讓你們能瞭解css3的一些新特性，以及基礎的用法，感受css3的魅力！若是想要用好css3，這個得靠你們繼續努力學習，尋找一些講得更深刻的文章或者書籍了！若是你們有什麼其餘特性推薦的，歡迎補充！你們一塊兒學習，進步！

1七、Vue 插件編寫與實戰
本文立足vue開源的理念，主要爲vue開發者講解編寫vue插件的方法和步驟，經過理論與實踐相結合的方式來加深你們對vue插件編寫的認識。

1八、Ajax的全面總結
Ajax在前端開發中有着舉足輕重的地位，關於Ajax的使用和注意事項一直是一個重要的話題，藉此機會，本文但願對Ajax作一個全面的總結，完全揭開Ajax的神祕面紗。 一.什麼是AjaxAjax(Asynchronous JavaScript and XM...

1九、HTTP緩存機制詳解
Http 緩存機制做爲 web 性能優化的重要手段，對於從事 Web 開發的同窗們來講，應該是知識體系庫中的一個基礎環節，同時對於有志成爲前端架構師的同窗來講是必備的知識技能。 可是對於不少前端同窗來講，僅僅只是知道瀏覽器會對請求的靜態文件進行緩存，可是爲何被緩存，緩存是怎樣生效的，卻並非很清楚。 在此，我會嘗試用簡單明瞭的文字，像你們系統的介紹HTTP緩存機制，指望對各位正確的理解前端緩存有所幫助。

20、Vue.js數據綁定原理Vue.js是一款MVVM框架，上手快速簡單易用，經過數據綁定在修改數據的時候更新視圖。Vue.js的數據綁定原理依賴於Object.defineProperty，尤大大在Vue.js文檔中就已經提到過，這也是Vue.js不支持E8 以及更低版本瀏覽器的緣由。Vue經過設定對象屬性的 setter/getter 方法來監聽數據的變化，經過getter進行依賴收集，而每一個setter方法就是一個觀察者，在數據變動的時候通知訂閱者更新視圖。