首頁  >  文章  >  web前端  >  js要怎麼學

js要怎麼學

little bottle
little bottle原創
2019-05-31 14:50:356226瀏覽

有朋友說想要一個學javascript,但不知道如何去學習。這篇文章中小編總結了JavaScript重要知識點以及學習方法,有點長,但是很好用,希望對你有幫助。

js要怎麼學

一、開發環境與JavaScript版本問題

開發環境越簡單越好,一定不要在這個環節浪費時間。

首先說編輯器的選擇,sublime text、vs code、atom、webstorm,還有HBuilder。新手入門的時候總想找一個最好的編輯器,其實這編輯器就跟遊戲裡面選英雄一樣,沒有最厲害的,只有最適合你的,如果還是拿不定注意,就選vs code吧,我感覺這個對新手挺友善的。

瀏覽器就用chrome,然後就可以開始擼程式碼了。

關於JavaScript版本,我建議還是從ES5開始學,有一定基礎之後再來看ES2015 的新特性。

二、基本文法

學程式語言和學自然語言有很多相似的地方,我們得從最基本的單字和文法開始學。

  • 變數:如何宣告變量,如何為變數賦值。
  • 資料型態:什麼是資料類型,數字與字串有什麼不同。
  • 運算子與表達式:常用的運算子有哪些? “=”、“==”與“===”的區別等等。
  • 分支語句:if、switch
  • 循環語句:for、while
  • 函數:什麼是函數,什麼是參數,什麼是回傳值。

這些基本文法一定要非常熟悉,不然後續的學習會舉步維艱。

三、物件

物件是一個非常重要的概念,一定要靈活掌握:

  • 物件:屬性的無序集合,當屬性值為函數的時候,我們叫這個函數為物件的方法。
  • 陣列:元素的有序集合。了解陣列的常用方法
  • 日期對象:取得年月日時分秒
  • 數學對象:取得隨機數
  • 以了解其他物件:正規表示式、包裝對象,其實函數也是對象,不過這些簡單了解就行。

每個物件都有很多方法,這些方法知道在哪裡查就行了,千萬不要去背,就像我們學英語,必要的單字要背,但是大部分單字知道用字典查就行了。

學習【基礎文法】和【物件】的過程比較枯燥,知識點之間銜接不是特別緊密,就像我們小學一年級學習漢字一樣,每一個字我們都知道是什麼,但是卻不會把他們組合在一起,所以小學才會練習組詞,造句,再到寫作文。我們把做的專案比喻成寫作文,那我們還有一段路要走,切莫心急。

四、DOM

  • DOM的樹狀結構
  • #節點:元素節點、文字節點、屬性節點
  • 節點關係:同級、父子級等等
  • 取得節點:querySelector、querySelectorAll等等
  • 節點操作:增刪改查
  • 事件綁定:事件流和事件委託應該了解

DOM提供的方法也很多,仍然不要過多的投入精力,新手自學總是會被這些大量的方法困擾,我們要做的是對DOM有一個概括性的了解,至於那些雜亂的接口,後續我們完全可以用jQuery或框架代替。

(如果對DOM感興趣,可以在技能掌握得稍微全面一些之後,再回來深入學習也是可以的,但是前期投入大量時間,確實會影響學習效率)

#五、jQuery

jQuery是必須要會的,但是jQuery上手確實很簡單,用兩天時間了解一下jQuery的用法,然後就可以利用jQuery實現各種頁面效果了,前期肯定會磕磕絆絆,但是jQuery的資料很多,一邊學一邊做就好。

六、JavaScript進階

jQuery熟練了之後,就可以開始著手學習JavaScript進階一點的內容了:

原始型別與引用型別的差異
各種型別轉換與型別偵測
閉包:函數套函數,怎麼套自己都不蒙就行了。
原型:建構子、原型屬性、基於原型的繼承是怎麼實現的。
this:可以開個坑好好研究研究

七、了解node

node現在可以說是前端必學的了,但是不是學用node做後台,而是用node生態下的各種工具,順便藉node來了解後台。

  • 使用node開啟一個靜態伺服器
  • 使用npm下載第三方模組
  • webpack
  • babel

最好能用express寫一個簡單的後台程式(一個server.js就夠了),處理一些請求,這樣我們學習ajax的時候就可以自己寫後台接口了,當然這需要有http協議的基礎知識。

八、ES2015 新特性

  • 變數與常數:為什麼要拋棄var?
  • 結構賦值
  • 箭頭函數
  • 模組化
  • class
  • 編譯

像promise, async/await函數等等這些,看自己能力了,有興趣看看,不看也不影響後面學習,但是,就算現在不學,這個後續也是要補的。

九、AJAX

簡單的說,了解一下http協議,知道什麼是請求,什麼是回應,get和post有什麼卻別,然後在學ajax,看看語法基本上就會了。

  • 用XMLHttpRequest發個請求,接個資料。
  • 用jQuery發個請求,接個資料。
  • json解析

知道這些就差不多了,後續不管是工作還是學習,一定還會遇到很多問題,到時候再具體問題具體分析。

十、框架

react、angular、vue三選一,零基礎的初學者強烈推薦vue,如果是後台轉前端推薦angular,如果技術型前端,推薦react。

這篇文章是給零基礎新手的,那自然就選vue比較好了。

最後

經過這十步,就可以對JavaScript體係有一個整體的了解,然後重點向那個方向發展,就看自己愛好或是工作需要了。科技的道路很漫長,這只是一個起點。

以上是js要怎麼學的詳細內容。更多資訊請關注PHP中文網其他相關文章!

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