自己寫的Js，自己不認識了？

最近在講課的時候，發現一個新問題，就是許多同學面對著自己寫完的代碼，蒙圈了。

我是誰？我在哪裡？我在做什麼？這些代碼是怎麼出現的？

說來可能難以相信，明明是你自己寫出來的代碼嘛。

但是，下課之前我說，今天的作業，如何如何要求，格式什麼樣，標明用了多長時間，然後就有同學在學習群里問我，。。原話記不太清了，大概意思就是，自己寫的看不明白了，還得再寫一遍呀？

我說，要這樣你何止再重寫一遍啊，你得反覆多寫幾遍才行。然後跟我說沒思路，我說每個功能點，每個函數它們是如何交互、溝通的，我都給你們畫思維導圖呀，

。。。

。。

如此這般吧。

咱們在課上寫代碼的時候，能寫出來主要有二個因素，

1、我剛講完，腦子裡還有印像；

2、我把代碼都寫好了，在視頻里你們都能照著寫；

寫完之後，腦子裡印象退散，又沒有代碼參考，思路又不太到位，自然再看自己的代碼就蒙圈了。

在我個人看來，咱們前端新人寫代碼的時候，容易只顧眼前，就是很容易顧頭不顧尾。所以寫完之後，最好就是從頭到尾再檢查一遍。如果js運行沒有錯誤，那麼就把JS的格式再清理一下，

那麼，回到根本的問題，JS代碼怎麼讀比較適合呢？

寫東西之前，

1、分析UI設計圖的功能結構；

2、根據功能、結構，理清此模塊的交互順序；

3、把各個交互的元素的id名寫好；

4、根據1，2，3，先定好各自的函數方法，還有調用關係；

我又給同學們畫了個思維導圖，就這樣式的，

如果你拿到的，是一個項目文件，並且它的文檔不完整的時候，

閱讀代碼的我個人主觀的基本方法：

1、先找入口，起點；

2、找到它定義的地方；

3、把它所有的方法、屬性，都列出來；

4、找到它們之間的調用的關係；

5、各個方法之間，傳遞的參數；

把所有的方法里，用到的所有的參數，

誰跟誰，都理清楚。

6、就開始用中文，

描述各個函數以及它收到或返回的參數的用途。

7、把你的中文描述，再畫一個圖；

8、用你寫出來的「中文文檔」，再加上代碼結構的圖，回過頭來，再對照著看代碼。

就是，無論多麼長的代碼，多麼複雜的代碼，我個人吧，都是這麼看，這麼讀。

盡量不要生生的硬看代碼。

遇到bug，一時找不到原因，可以使用排除法，

1、大段的刪除代碼，查看bug是否消失；

2、不斷縮小刪除的代碼的範圍，直到定位bug；

3、排除bug；

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！