最近一段時間，把React學習實踐了一把，算是又多掌握了一門新技術(shù)，雖然學習過程比較辛苦曲折，但熟練掌握后感覺還是很好的，以后又多了一種選擇，在技術(shù)思路上也開闊了很多。

回想編程生涯這些年，2001年開始學習Asp，2002年學習Javascript，2003年學習Asp.Net/C#，2009年學習Objective-C，2013年又跳到前端這個大坑，從Nodejs到j(luò)Query到Angularjs到現(xiàn)在的React。這一路學來，走過一些彎路，也積累了不少學習的經(jīng)驗。

積極開放的心態(tài)最重要

學習新技術(shù)，就如探索一片新的領(lǐng)域，一般在心態(tài)上來說，都會有兩種典型的心態(tài)，一種是恐慌和抗拒的，一種是積極和開放的，不同的心態(tài)會造成不同的結(jié)果。比如對我自己來說，對于編程技術(shù)，一直是我所喜歡的，所以編程的新技術(shù)，總是能積極的去學習，并且能很快掌握。而對于英語和寫作，從上學開始，就一直是我所不喜歡不擅長的領(lǐng)域，所以即使學了很多年，也并沒有什么明顯的進步。直到后來工作后，逐步意識到英語和寫作的重要性，在心態(tài)上作出了調(diào)整，積極的去面對，到現(xiàn)在總算是改善了很多。

學習新技術(shù)的另一個障礙來源于已經(jīng)熟練的技術(shù)。當好不容易把一門技術(shù)掌握的很熟練后，雖然這在將來學習新東西時，會幫助少走很多彎路，但同時可能也會變成一種障礙。

我曾對幾門語言掌握的相當熟練，甚至有些曾以為自己精通了。比如當年對于asp，可以熟練的完成在當年技術(shù)條件下的復(fù)雜BS系統(tǒng)，雖然按現(xiàn)在標準來看，也無非是用vbs對數(shù)據(jù)庫增刪改查，那時候交互并不復(fù)雜，還能配合寫一些簡單的javascript，讓體驗更好一些。那時候覺得會了Asp，可以搞定所有的BS系統(tǒng)開發(fā)了。后來Asp.Net出來了，心理很復(fù)雜，一方面覺得我用Asp已經(jīng)啥都可以搞定了，為什么要學Asp.Net？另一方面覺得這個是未來發(fā)展的趨勢，還是應(yīng)該學習掌握，不然以后可能跟不上時代發(fā)展。結(jié)果還是硬著頭皮去學。只是每次遇到困難挫折的時候，就會有放棄回去寫Asp的念頭，覺得這要是我用Asp來寫，早搞定了，何必這么苦逼學新技術(shù)呢？

當我終于有一天，對Asp.Net熟練掌握后，才發(fā)現(xiàn)自己原來的淺薄無知，以前Asp也就是停留在腳本編程，到了Asp.Net，已經(jīng)可以用面向?qū)ο蟮乃枷肴ピO(shè)計架構(gòu)，甚至于出了網(wǎng)頁，還可以去開發(fā)后臺服務(wù)。這對于我來說，相當于又打開了一扇新的大門，可以從更寬廣的角度來看待問題。

從心理學的角度來說，我們對于外部世界的認識可分為三個區(qū)域：舒適區(qū)，學習區(qū)，和恐慌區(qū)。我們所熟悉的技術(shù)領(lǐng)域就是舒適區(qū)，而新技術(shù)是處于學習區(qū)或恐慌區(qū)。隨著對新技術(shù)的掌握，新技術(shù)會進入舒適區(qū)，但是總還會有更新的技術(shù)在學習區(qū)甚至恐懼區(qū)，等著去學習掌握。

如果想高效的學習掌握新技術(shù)，在心態(tài)上一定得是開放和積極的。

做中學(Learning By Doing)

如果沒有@鄒欣老師的《構(gòu)建之法》，我可能沒法這么精準的去概括這種邊做邊學的方法，對于軟件技術(shù)的學習，***效的辦法應(yīng)該就是“做中學”。

如何通過“做中學”去學習掌握新技術(shù)，我一般分成這樣幾個步驟：

整體概覽

明確階段性目標，選擇實踐項目

搜集整理相關(guān)文章和開源項目，模仿借鑒

整體概覽

所謂磨刀不誤砍柴工，在動手去做前有必要先做一些準備工作。在開始學習一門新技術(shù)的時候，先對新技術(shù)整體有個了解是很有必要的，需要知道它能做什么，有哪些關(guān)鍵的知識點。接下來的步驟，也都依賴于對技術(shù)整體的掌握和了解。

這個工作，如果有條件，可以買一本薄一點的，淺顯易懂的書，整體翻一翻，基本就能有個了解。但不建議買大塊頭的書，一般大塊頭的書適合當詞典來查。但現(xiàn)在新技術(shù)推出速度太快，往往要等書出來往往是幾個月之后的事情了，所以絕大部分時候，還是得到其官方網(wǎng)站去查相關(guān)技術(shù)文檔。就像這次學React，確實難找到本合適的書，所以我直接去它的官方網(wǎng)站(http://facebook.github.io/react/) ，把Getting Started里面的文章快速的瀏覽了一遍，基本上算是有了個大概的了解。而且現(xiàn)在網(wǎng)絡(luò)上相關(guān)文章也比較多，通過搜索，也能找到很多相關(guān)的文章和資料。

明確階段性目標，選擇實踐項目

一般一門新技術(shù)所涉及的面比較廣，如果一開始就想全面掌握并不現(xiàn)實，但如果從一個個點去突破，相對要簡單很多。所以一般我會通過一個或多個項目實踐的形式，分成幾個階段，逐步去掌握各個知識點，最終整體去學習掌握技術(shù)。

例如我以前學習一些服務(wù)端語言，都會嘗試通過寫一個留言板或者博客系統(tǒng)來學習，而這次學習React，主要就是通過用React重構(gòu)我以前用Angularjs寫過的一個聊天室應(yīng)用，來學習掌握React。通過前面對React的概覽性學習，結(jié)合自身情況，我對于這個項目實踐，簡單分成了幾個階段：

1. 用React搭建基礎(chǔ)框架

React的應(yīng)用是基于Flux架構(gòu)，而Flux架構(gòu)并沒有統(tǒng)一的標準，需要選擇使用一種Flux架構(gòu)實現(xiàn)，并基于它搭建基礎(chǔ)框架。

2. 實現(xiàn)界面基礎(chǔ)組件

React是基于組件的方式來編程運行的，所以需要將整個應(yīng)用拆分成若干基礎(chǔ)組件，這個階段主要就是把界面的元素和交互拆分成若干基礎(chǔ)組件

3. 和服務(wù)器進行通信

一個完善的程序，離不開和服務(wù)端的交互，對于一個React程序，其和服務(wù)端交互的方式，和傳統(tǒng)應(yīng)用程序，并不全相同，并且對于和服務(wù)器通信的結(jié)果數(shù)據(jù)，還要和界面整合

4. 發(fā)布測試完善

對于做好的作品，發(fā)布給自己和其他人進行測試，然后繼續(xù)完善，在這個過程中去進一步學習掌握技術(shù)細節(jié)

當明確了實踐的項目和各個階段的目標，后面就是如何去達到這個目標了，在實踐中學習。

搜集整理相關(guān)文章和開源項目，模仿借鑒

書本或文檔上一個個知識點的說明，和最終的項目產(chǎn)品，還是有很大差距，項目最終是需要充分運用各個知識點，合理組合，才能寫出高質(zhì)量代碼，而對于新技術(shù)，一開始很難掌握這些細節(jié)，盲目依賴以往經(jīng)驗，很可能就是照貓畫虎，最終做出來的東西不倫不類。

在初學習實踐新技術(shù)時，模仿借鑒很重要，就像小孩子學說話，都是從模仿開始。好在現(xiàn)在通過github這種開源項目托管服務(wù)，利用搜索，可以找到非常多的優(yōu)秀開源項目。

早些年學習Asp.Net的時候，我有過很長一段時間對開源項目AspNetForums的二次開發(fā)經(jīng)歷，從中受益良多。以我當時的水平來說，是不可能設(shè)計開發(fā)出來那樣的高質(zhì)量產(chǎn)品，甚至于看懂都有些吃力，但正是通過對它的二次開發(fā)，不僅讓我快速的學習掌握了很多Asp.Net開發(fā)的知識點和細節(jié)，也養(yǎng)成了很多良好的編碼習慣。在后面在做其他項目，可以模仿和應(yīng)用它很多設(shè)計實現(xiàn)。

有些程序員寫了很多年程序，代碼質(zhì)量不高，一個原因就是因為看的太少，很少去參考學習那些優(yōu)秀的開源項目。沒有見過好的代碼是什么樣的，自然很難寫出來高質(zhì)量的代碼。

在我這次開始動手實踐React項目前，也嘗試找了很多開源項目，由于React技術(shù)較新，還沒有可以直接完整參考的項目，所以只能是多個項目參考對照。以下就是部分我學習和參考過的項目列表：

emmenko/redux-react-router-async-example · GitHub 一個服務(wù)端交互的示例

quangbuule/redux-example · GitHub 一個和Immutable.js整合的示例

Rebuilding HipChat with React.js 一個和我要做項目類似的應(yīng)用HipChat，用React開發(fā)的，并非開源項目，但是通過React Dev Tool可以參考借鑒很多組件設(shè)計的思路

在前期搭建基礎(chǔ)框架的時候，就是直接借用的前兩個項目的框架，這樣很快就能讓程序跑起來，然后在后面的基礎(chǔ)組件設(shè)計的時候，更多的就是參考hipchat的組件設(shè)計。

做中學(Learning By Doing)

在看書看資料的時候，一個個知識點看起來并不復(fù)雜，但是當真正去動手實踐的時候，會遇到各種各樣的問題（坑），而這些問題只有反復(fù)的思考、查資料、問人才能最終解決。

在做中學，聽起來很酷，但這個過程總是艱辛曲折的！學習往往就是這樣的，只有經(jīng)歷各種各樣的磨練，才能真正的去掌握這些知識，把這些知識轉(zhuǎn)變成自身的能力。

我這次用React重構(gòu)聊天室的經(jīng)歷，如同我以往學習其他新技術(shù)的經(jīng)歷一樣，充滿了艱難險阻，兩個月來付出良多。但最終完成的時候，卻是成就感滿滿，感覺到對于新技術(shù)終于算是基本掌握了，雖然還有一些知識點沒有應(yīng)用到，也不過是時間問題罷了，再回頭看以前的一些程序設(shè)計，又有了很多新的思路。

經(jīng)驗教訓

以下是總結(jié)的一些經(jīng)驗教訓

貪多嚼不爛

雖然現(xiàn)在新技術(shù)推出很快，但很多技術(shù)本質(zhì)并沒有變，在有其他技術(shù)“良好基礎(chǔ)”的前提下，掌握一門新技術(shù)并不需要花太長時間，但“良好基礎(chǔ)”就如學習武功的內(nèi)功，才是真正需要多花時間去培養(yǎng)的。

所以去學習新技術(shù)之前，先看看手頭的技術(shù)是不是掌握好了，如果沒掌握好，不妨先學好再說，不然每門技術(shù)都淺嘗則止，反而是難有成就。

目標不宜太大，要有階段性成就正向激勵自己

人的學習熱情都是有周期性的，最開始激情滿滿，一段時間后就會激情逝去，很容易就半途而廢放棄了。

所以在設(shè)定階段性目標時，***能目標小一點，現(xiàn)實一點，能多一些正向的反饋，這樣能讓自己走的遠一點。

舉例來說，寫程序可以優(yōu)先寫單元測試和界面部分，這樣很快就有明確的反饋，比如當你看到單元測試全部通過了，能看到界面了。

學習不會白費

有時候辛辛苦苦學的新技術(shù)，可能不久后就會過時，這時候難免會有是不是白學的想法，但實際上學習從來不會白費的，看過一句話我覺得很有道理：

你所學習的一切都在幫助構(gòu)建你頭腦中的神經(jīng)元網(wǎng)絡(luò)，會幫你建立某種聯(lián)系使你在后續(xù)學習其他東西時更加容易，了解一種知識能夠使你跟其他知識進行比較和對比。因此，學習總是有用的，無論學什么。

出處：如何克服 JavaScript 框架疲勞？

就像十幾年前我把Javascript學的很熟練了，那時候覺得沒什么卵用，現(xiàn)在看來卻是大有用途：）