前言

生活有度，人生添壽。

Javascript從當初的一個“彈窗語言”，一步步發展成為現在前后端通吃的龐然大物。javascript的受歡迎程度也是與日俱增，今年編程語言又是花落javascript，這實在是一個充滿了活力的語言。如今，隨隨便一個網頁javascript代碼量都不下數千行，要是node后端那更不止幾千行了。（WTF）代碼量的增加給編程帶來的首要的問題就是如何去編寫和維護如此龐大的代碼呢？答案就是模塊化思想，其實就是面向對象（OOP）編程，如今比較流行的三大前端框架（angular,react,vue）基本都實現了組件化編程，但組件化和我們所說的模塊化又有所不同，應該可以這么理解，組件化是模塊化的升級版，模塊化是組件化的基礎。那么，問題來了，javascript怎么面向對象編程呢？我想這很多老鳥也不定說的清楚吧，前端雜而活躍的各種社區，很多前端er一度依賴各種插件，根本不需要去了解這些深層的東西卻照樣能完成任務。但我想作為一個有追求的前端er還是很有必要去學習這些看似用不著的東西的，別的不說，就單單因為我們是前端er,只會用jquery一個稍微厲害的后端都能代替你。好吧，廢話不多說，到底如何面向對象coding呢…..

很不幸，es5中并沒有給出明確的定義‘類’的概念，所以傳統的面向對象編程似乎是行不通的，那么又該腫么辦呢？值得慶幸的是，前輩們通過不斷探索總結，成功的用javascript模擬出了“類”。那么，javascript的類又該怎么定義呢？

在面向對象編程中，類（class）是對象（object）的模板，定義了同一組對象（又稱”實例”）共有的屬性和方法。

問題提出

font-weight的屬性值有100、200、300、400、500、600、700、800、900和normal、bold、lighter、bolder，它們的區別是？
另外，在實際開發中，我們應該使用數值表達還是文字表達呢？

認識font-weight

根據W3C Fonts節章的規范標準，可知：

前言

React 好像已經火了很久很久，以致于我們對于 Virtual DOM 這個詞都已經很熟悉了，網上也有非常多的介紹 React、Virtual DOM 的文章。但是直到前不久我專門花時間去學習 Virtual DOM，才讓我對 Virtual DOM 有了一定的理解，以致于要懷疑起很久之前看過的那些文章來。倒不是這些文章講得不對，而是現在在我看來角度不太好，說得越多，越說不清。

讓我能夠有所開竅（自認為）的，是這篇文章：

Change And Its Detection In JavaScript Frameworks
Monday Mar 2, 2015 by Tero Parviainen

作者看問題的角度很棒，從數據變更與UI同步的角度來介紹各個典型框架，特別是對于 React 的 Virtual DOM，從這個角度理解起來更容易些。

什么是 rem

可能在你使用收音機或者用其他音樂播放器之前，就已經聽過“R.E.M.”這個詞了。在這個樂隊眼中，這個詞是“淺睡眠時眼球的快速轉動”的縮寫，而在 css 中，rem 代表著“以根元素為參照物的 em 單位“。他不會讓你拋棄你的宗教信仰也不會讓你相信那個遠在月球的人，但是它可以幫助你實現一個和諧、平穩的設計。

根據 W3C 規范中對 1rem 的定義：

1rem 與等于根元素 font-size 的計算值。當明確規定根元素的 font-size 時，rem 單位以該屬性的初始值作參照。

WEB服務器、應用程序服務器、HTTP服務器有何區別？IIS、Apache、Tomcat、Weblogic、WebSphere 都各屬于哪種服務器？這些問題困惑了很久，今天終于梳理清楚了：

Web服務器的基本功能就是提供Web信息瀏覽服務。它只需支持HTTP協議、HTML文檔格式及URL。與客戶端的網絡瀏覽器配合。因為Web服務器主要支持的協議就是HTTP，所以通常情況下HTTP服務器和WEB服務器是相等的(有沒有支持除HTTP之外的協議的web服務器，作者沒有考證過)，說的是一回事。

應用程序服務器(簡稱應用服務器)，我們先看一下微軟對它的定義：”我們把應用程序服務器定義為“作為服務器執行共享業務應用程序的底層的系統軟件”。 就像文件服務器為很多用戶提供文件一樣，應用程序服務器讓多個用戶可以同時使用應用程序（通常是客戶創建的應用程序）”

通俗的講，Web服務器傳送(serves)頁面使瀏覽器可以瀏覽，然而應用程序服務器提供的是客戶端應用程序可以調用(call)的方法(methods)。確切一點，你可以說:Web服務器專門處理HTTP請求(request)，但是應用程序服務器是通過很多協議來為應用程序提供(serves)商業邏輯 (business logic)。

在JavaScript中，對對象進行拷貝的場景比較常見。但是簡單的復制語句只能對對象進行淺拷貝，即復制的是一份引用，而不是它所引用的對象。而更多的時候，我們希望對對象進行深拷貝，避免原始對象被無意修改。

對象的深拷貝與淺拷貝的區別如下：

• 淺拷貝：僅僅復制對象的引用，而不是對象本身；
• 深拷貝：把復制的對象所引用的全部對象都復制一遍。

一. 淺拷貝的實現

淺拷貝的實現方法比較簡單，只要使用是簡單的復制語句即可。

1.1 方法一：簡單的復制語句

/* ================ 淺拷貝 ================ */ function simpleClone(initalObj) { var obj = {}; for ( var i in initalObj) {
        obj[i] = initalObj[i];
    } return obj;
}

一. 無中生有

起初，什么都沒有。

造物主說：沒有東西本身也是一種東西啊，于是就有了null：

現在我們要造點兒東西出來。但是沒有原料怎么辦？

有一個聲音說：不是有null嘛？

另一個聲音說：可是null代表無啊。

造物主說：那就無中生有吧！

于是：

當人們嘗試學習 JavaScript , 或者其他編程技術的時候，常常會遇到同樣的挑戰：

• 有些概念容易混淆，特別是當你學習過其他語言的時候。
• 很難找到學習的時間（有時候是動力）。
• 一旦當你理解了一些東西的時候，卻很容易再一次忘記。
• 可以使用的工具甚多且經常變化,所以不知道從哪里開始入手。

幸運的是，這些挑戰最終都可以被戰勝。在這篇文章里，我將介紹 6 個思維技巧來幫你更快的學習 JavaScript ，讓你成為一個更快樂更多產的程序員。

對于很多學習 JavaScript 的人來說，他們問的第一個問題是選用哪個框架（現有框架非常多）。但是如果你還不熟悉原生的 JavaScript ，那這就是個不該問的問題。你會花費你全部的時間去查詢不同的框架并且不會取得任何進展。

基本類型值有：undefined，NUll，Boolean，Number和String，這些類型分別在內存中占有固定的大小空間，他們的值保存在棧空間，我們通過按值來訪問的。

今天在微博上看到了 有人分享了下面的這段函數式代碼，我把代碼貼到下面，不過我對原來的代碼略有改動，對于函數式的版本，咋一看，的確令人非常費解，仔細看一下，你可能就暈掉了，似乎完全就是天書，看上去非常裝逼，哈哈。不過，我感覺解析那段函數式的代碼可能會一個比較有趣過程，而且，我以前寫過一篇《函數式編程》的入門式的文章，正好可以用這個例子，再升華一下原來的那篇文章，順便可以向大家更好的介紹很多基礎知識，所以寫下這篇文章。

先看代碼

這個代碼平淡無奇，就是從一個數組中找到一個數，O(n)的算法，找不到就返回 null。

下面是正常的 old-school 的方式。不用多說。

//正常的版本 function find (x, y) { for ( let i = 0; i < x.length; i++ ) { if ( x[i] == y ) return i;
  } return null;
} let arr = [0,1,2,3,4,5] console.log(find(arr, 2)) console.log(find(arr, 8))