首頁 web前端 js教程 學習JavaScript的經驗之路

學習JavaScript的經驗之路

Aug 04, 2017 pm 01:19 PM
javascript js

這篇文章主要介紹如何學JavaScript?前輩的經驗之談,也就是怎麼學前端的問題,具有一定的參考價值,有興趣的小伙伴們可以參考一下

鑑於時不時,有同學私信問我怎麼學前端的問題。
這裡統一回覆一下,如下次再遇到問我此問題同學,就直接把本文連結地址傳給你了。

先說句題外話。關於有人管我叫大神的事。
個人感覺這跟你買東西時,人家管你叫帥哥一樣,你答應與否都無妨。

正題開始,前端怎麼學,應該因人而異,別人的方法未必適合自己。
就說說我的學習方法吧。
我把大部分時間放在學習js上了。因為這個js的學習曲線,先平後陡。
專案實踐和練習啥的,我不說了,主要說下工作以外的時間利用問題。
我是怎麼學的呢,看書,分析原始碼。
個人這幾天統計了一下,前端書目前看了50多本吧。大部分都是js的。市面上的書基本,差不多都看過。

第一個問題是,看書有啥好處?
好處應該是不言而明的,書看多了,基礎會逐漸夯實起來。
看多了,自己的判斷力,自然就上來了。
看別人的文章,就能很快判斷出,對方每塊兒講得對不對,哪塊兒又是自己不清楚的,模稜兩可的。
當然也為看源碼,分析源碼提供了基礎。

10本書讀2遍的好處,應該大於一本書讀20遍。
10本書的交集,那就是基礎知識的核心,而並集那就是所有的知識。
好書當然要多讀,反覆讀。但是只讀一本是不行的。
因為每本書的重點都不一樣。從不同的側面,去理解一個知識點,是很有意義的。
所以特別佩服印度人,他跟你講英文,你一個詞語沒聽懂,他會蹦出n個同一意思的單詞,你聽懂一個,就ok了。
看書也是這樣的,某一塊講得不透徹,不用擔心,其他書籍可以幫助你來了解。

第二個問題是,書籍推薦。
個人覺得不錯的,沒事可以翻的。書籍如下:

>《javascript物件導向程式設計指南》,風格輕鬆易懂,比較適合初學者,原型那塊兒講得透徹,12種繼承方式呢。

>《js權威指南》、《js高級程式設計》,這兩本書經典是經典,但太厚,適合把其中任意一章都當成一本書來讀。洋洋灑灑,很難一口氣看完。比較適合當參考書。

>《你不知道的javascript》狙擊js核心細節,閉包、原型、this講得都還清楚。目前《中冊》也出了,還在看。

>《js設計模式與開發實踐》js設計模式也是要學的,此書把js的設計模式講得非常清晰,一點不晦澀,看起來沒多少難度。

>《正規指引》,分析原始碼時,如果正規表示式不懂,沒法進行下去的。此書相對來說講得比較清晰。

>《基於MVC的JavaScript Web豐富應用程式開發》,看完後,基本上能寫出自己的mvc框架了。是本好書。

>《javascript函數式程式設計》,js是一門函數式語言,此書是函數式程式設計一個入門,函數是一等公民那是非常重要的。

>《js忍者秘籍》,jq作者寫的,沒有傳說中的那麼難讀,話說就算你看完並理解所有知識點,也不會達到世界高手等級的。因為你還沒有做到隨心所欲。

>《javascript框架設計》,如果初看此書,會覺得此書有羅列程式碼之嫌。在我看來,此書講究的是框架的全局觀。

以上書籍是我認為是成就高手之路上必須看的,也需要反覆看。

css相關的書籍,說實話我看得比較少,總共有六、七本吧。有兩本必須推薦:

>《css權威指南》,css基礎點那是講得非常清楚的。什麼層疊優先權、line-height啥的。不是隨便一本書都敢叫「權威指南」的。

>《css揭秘》此書我也是不斷的看,此書才不屑於全面講css3各屬性呢。 css規範文檔能講的,它只會講你最不在意的。此書解決的47問題,解決想法和解決方案同等重要,很有啟發性。以上各書你都可以不買,至少買本此書吧。

第三個問題,怎麼看。

想必很多同學,都想看書,但是很難看下去。
文字部分相對來說還能看看,一遇到程式碼,頭皮就發麻了。
此問題一開始時我也遇到的。

說一個學習理論。
比如說學英語,有個開水理論。
詞彙量必須達到6000才行,如果沒達到,英文水平不會上去的,
這跟燒開水一樣,沒事燒燒,放著涼涼,從來沒燒到100度,那麼此水是永遠不能喝的。
一旦煮沸過,就可以隨時喝了。

20本書你看不下去,代表什麼呢?

任何一本書,你都沒看完過。熟悉的,永遠只是前三章。別笑,我原先也是這樣的。
那麼現在的問題是,怎麼把一本書看完呢?
很簡單,敲。
《基於MVC的JavaScript Web富應用程式開發》這本書我看時,就是這樣,終於有一天,我下定決心要把此書從頭到尾敲一遍。
文字加程式碼都敲,然後就一章一章得看完了。程式碼敲一遍後,你會發現,沒之前看起來的那麼難。
如果你屬於一看書就犯困那種同學。強烈建議你把《javascript物件導向程式設計指南》此書從頭到尾敲一遍。
堅持看完一本書後,信心就上來了。先保證看完一本再說。看完3本後,基本上應該可以做到幾天就能看一本了。萬事起頭難,加油吧。

第四個問題,看書的層次問題。

書看完後,要自己總結,要跟其他書本比較看。有同學同時對比看《權威指南》和《高設》來的。
隨便拿出個知識點,你都能閉著眼睛說得頭頭是道,表示水平夠了。

下一塊就是原始碼的學習了。
看框架原始碼之前,想說一件事情:dom的api不懂,沒問題,你可以百度。但是正則一定要先研究研究。
不然大多數人去嘗試分析原始碼時,遇到的挫折都在於此。

怎麼去閱讀原始碼呢?

敲,照著敲。

有哪些程式碼值得去敲呢?
優秀框架或是函式庫的原始碼都值得你去敲。
但是拿jq來敲,來入門,那不行的。原因:太他麼長了。八九千行呢! !

個人覺得underscore.js庫是不錯的第一個選擇。原因都是工具方法,敲完以後自己的水平應該要略有小成吧。
其實有一些api的實現,你要把它當成getElementById一樣,深深的印在腦海裡。例如extend方法,必須張口就來。
敲完underscore函式庫後,可以考慮去看看《javascript函數式程式設計》這本書了。

jq的原始碼不好敲。那麼zepto的原始碼比較少1800多行,敲一天應該敲完了。
敲幾遍後,把所有不懂的地方,都百度清楚,然後就可以寫自己的類jq的庫了。
然後就可以當作一項技能寫進自己的履歷裡。例如「創建過自己的jquery庫」。
當然敲的過程,也能幫助自己對jq的api認識。

然後是backbone.js,因為此框架是以類別jq和underscore為基礎的mvc框架。程式碼也沒多少行。敲吧。
spine.js與backbone類似。可以在敲敲之前,先來看看那本《基於MVC的JavaScript Web富應用程式開發》。
希望你的履歷可以加這麼一筆,「創建過自己的mvc框架」。

其他的,我也敲過一些。包括jq.validate.js,包括一些插件。
如果你願意的話,bootstrap你可以去敲敲啊。原始碼挺多的,可以按插件逐一來敲。
分析明白了,輪播、分頁、下拉框等等的插件那還不是分分鐘隨手就寫一個了。
最起碼看看人家api介面是怎麼設計的也是極好的。話說個人在閱讀其css代碼中,也學到了不少東西。
說到插件,有兩個必須提提,一個是表格插件,一個是樹。都敲完,履歷可以這麼寫上,「創建過自己的UI框架」。

當然了,你也可以敲你喜歡的框架程式碼,重要的是明白其實現原理,最好理解其為啥那麼設計,如果對設計模式比較熟悉的話,會經常發現原來是這麼回事。 。 。
照著敲只是分析原始碼的入門,用途也是為了學習,最後能用在自己的專案中,那是才是正道。
就算沒啥用,也是打發時間的好方式,比看電視劇強多了。我閒著無聊時,背著敲underscore源碼。

最後說句,如果你履歷上能如期寫上那幾句話後,必須是大神。加油吧。

後記:寫本文的最初目的,正如文章開頭所說的那樣,方便自己回覆大家的提問。
本站的任何一篇分享學習經驗的文章,基本上都會引起共鳴,這確實是一個值得討論的話題。
這裡再說說幾個事情。

以上是學習JavaScript的經驗之路的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

如何使用WebSocket和JavaScript實現線上語音辨識系統 如何使用WebSocket和JavaScript實現線上語音辨識系統 Dec 17, 2023 pm 02:54 PM

如何使用WebSocket和JavaScript實現線上語音辨識系統引言:隨著科技的不斷發展,語音辨識技術已成為了人工智慧領域的重要組成部分。而基於WebSocket和JavaScript實現的線上語音辨識系統,具備了低延遲、即時性和跨平台的特點,成為了廣泛應用的解決方案。本文將介紹如何使用WebSocket和JavaScript來實現線上語音辨識系

建議:優秀JS開源人臉偵測辨識項目 建議:優秀JS開源人臉偵測辨識項目 Apr 03, 2024 am 11:55 AM

人臉偵測辨識技術已經是一個比較成熟且應用廣泛的技術。而目前最廣泛的網路應用語言非JS莫屬,在Web前端實現人臉偵測辨識相比後端的人臉辨識有優勢也有弱勢。優點包括減少網路互動、即時識別,大大縮短了使用者等待時間,提高了使用者體驗;弱勢是:受到模型大小限制,其中準確率也有限。如何在web端使用js實現人臉偵測呢?為了實現Web端人臉識別,需要熟悉相關的程式語言和技術,如JavaScript、HTML、CSS、WebRTC等。同時也需要掌握相關的電腦視覺和人工智慧技術。值得注意的是,由於Web端的計

WebSocket與JavaScript:實現即時監控系統的關鍵技術 WebSocket與JavaScript:實現即時監控系統的關鍵技術 Dec 17, 2023 pm 05:30 PM

WebSocket與JavaScript:實現即時監控系統的關鍵技術引言:隨著互聯網技術的快速發展,即時監控系統在各個領域中得到了廣泛的應用。而實現即時監控的關鍵技術之一就是WebSocket與JavaScript的結合使用。本文將介紹WebSocket與JavaScript在即時監控系統中的應用,並給出程式碼範例,詳細解釋其實作原理。一、WebSocket技

股票分析必備工具:學習PHP和JS繪製蠟燭圖的步驟 股票分析必備工具:學習PHP和JS繪製蠟燭圖的步驟 Dec 17, 2023 pm 06:55 PM

股票分析必備工具:學習PHP和JS繪製蠟燭圖的步驟,需要具體程式碼範例隨著網路和科技的快速發展,股票交易已成為許多投資者的重要途徑之一。而股票分析是投資人決策的重要一環,其中蠟燭圖被廣泛應用於技術分析。學習如何使用PHP和JS繪製蠟燭圖將為投資者提供更多直觀的信息,幫助他們更好地做出決策。蠟燭圖是一種以蠟燭形狀來展示股票價格的技術圖表。它展示了股票價格的

如何利用JavaScript和WebSocket實現即時線上點餐系統 如何利用JavaScript和WebSocket實現即時線上點餐系統 Dec 17, 2023 pm 12:09 PM

如何利用JavaScript和WebSocket實現即時線上點餐系統介紹:隨著網路的普及和技術的進步,越來越多的餐廳開始提供線上點餐服務。為了實現即時線上點餐系統,我們可以利用JavaScript和WebSocket技術。 WebSocket是一種基於TCP協定的全雙工通訊協議,可實現客戶端與伺服器的即時雙向通訊。在即時線上點餐系統中,當使用者選擇菜餚並下訂單

如何使用WebSocket和JavaScript實現線上預約系統 如何使用WebSocket和JavaScript實現線上預約系統 Dec 17, 2023 am 09:39 AM

如何使用WebSocket和JavaScript實現線上預約系統在當今數位化的時代,越來越多的業務和服務都需要提供線上預約功能。而實現一個高效、即時的線上預約系統是至關重要的。本文將介紹如何使用WebSocket和JavaScript來實作一個線上預約系統,並提供具體的程式碼範例。一、什麼是WebSocketWebSocket是一種在單一TCP連線上進行全雙工

PHP與JS開發技巧:掌握繪製股票蠟燭圖的方法 PHP與JS開發技巧:掌握繪製股票蠟燭圖的方法 Dec 18, 2023 pm 03:39 PM

隨著網路金融的快速發展,股票投資已經成為了越來越多人的選擇。而在股票交易中,蠟燭圖是常用的技術分析方法,它能夠顯示股票價格的變動趨勢,幫助投資人做出更精準的決策。本文將透過介紹PHP和JS的開發技巧,帶領讀者了解如何繪製股票蠟燭圖,並提供具體的程式碼範例。一、了解股票蠟燭圖在介紹如何繪製股票蠟燭圖之前,我們首先需要先了解什麼是蠟燭圖。蠟燭圖是由日本人

JavaScript與WebSocket:打造高效率的即時天氣預報系統 JavaScript與WebSocket:打造高效率的即時天氣預報系統 Dec 17, 2023 pm 05:13 PM

JavaScript和WebSocket:打造高效的即時天氣預報系統引言:如今,天氣預報的準確性對於日常生活以及決策制定具有重要意義。隨著技術的發展,我們可以透過即時獲取天氣數據來提供更準確可靠的天氣預報。在本文中,我們將學習如何使用JavaScript和WebSocket技術,來建立一個高效的即時天氣預報系統。本文將透過具體的程式碼範例來展示實現的過程。 We

See all articles