開始學習 JavaScript：為什麼應該以及如何免費學習

已發表: 2022-04-23

您是否想開始學習 JavaScript 但不知道如何或從哪裡開始？ 在這篇文章中，我們將為您提供開始使用流行編程語言自學所需的指導。

我們將討論為什麼您可能會考慮從難度和職業前景兩個方面學習 JavaScript。 在那之後，這篇文章將介紹如何開始，通常是免費的。 完成後，我們希望您對如何從零開始自己學習 JavaScript 有一個很好的理解。

什麼是 JavaScript，為什麼要學習它？

在開始學習如何開始學習 JavaScript 之前，讓我們先談談這樣做的原因。 為此，了解可以使用編程語言做什麼是很有用的。

JavaScript 應用程序

我們先來談談網頁設計。 在構建網站時，JavaScript 是使它們具有交互性的部分。 HTML 提供框架和內容，CSS 定義站點的佈局和設計，而 JavaScript 則用於添加功能和行為。 您可以在下拉菜單、彈出窗口和其他模式、聯繫表格、動畫和交互式地圖中找到它最常見的部分。

javascript 應用程序示例：交互式地圖

就像 HTML 和 CSS 一樣，JavaScript 也是每個瀏覽器都可以理解和處理的東西。

在 WordPress 中，我們也看到 JavaScript 的應用越來越多。 Calypso，WordPress.com 的桌面應用程序完全基於 JavaScript，特別是 React 和 Node.js。

Calypso 堆棧：開始學習 javascript 的原因之一
Calypso 建立在現代 JavaScript 堆棧之上。

Gutenberg 編輯器在 2018 年取代了經典的 WordPress 編輯器成為默認的寫作界面，它也使用 JavaScript 作為其主要技術。

wordpress gutenberg 編輯器：javascript 應用程序示例

雖然最初是一種客戶端語言（意味著它在用戶瀏覽器中被解釋和處理），但由於 Node.js，它現在也可以運行在服務器端。 此外，React Native 和 Iconic 將其帶到了移動設備，將 Electron 帶到了桌面。

因此，JavaScript 的應用遠遠超出了 Web。 您可以使用它來創建 Web 應用程序和後端產品、運行智能電視、物聯網設備和原生移動應用程序。 另外，由於它是跨平台兼容的，它可以為在任何地方工作的桌面應用程序提供動力。

JavaScript 的優缺點

除了知道你可以使用 JavaScript 做什麼之外，它還有助於檢查它的優缺點。

JavaScript 專家

讓我們從 JavaScript 作為編程語言的優勢開始：

  • 多功能性——我們已經在上面提到了 JavaScript 的無數應用領域。 從網站、移動和桌面應用程序，到智能設備和遊戲，甚至機器學習——幾乎沒有什麼是您不能使用的。 JavaScript 也適用於前端和後端，並且可以與其他編程語言很好地配合使用。 簡而言之，JavaScript 是一個多功能性強者。
  • 初學者友好——JavaScript 的語法很容易學習。 也不需要構建開發環境，您可以在瀏覽器中開始編碼。 此外，該語言還有一個龐大的在線社區，可提供建議和支持。 另外，JavaScript 非常適合學習適用於其他語言的基本概念（例如面向對象編程）。 最後，有許多框架可以幫助您。
  • 速度——與其他編程語言相比，尤其是那些像 PHP 那樣運行服務器端的編程語言，JavaScript 通常執行得更快。 這並不奇怪，因為它可以直接在瀏覽器中運行，而無需編譯或與服務器對話（除非它需要外部資源）。 它還導致對服務器的需求減少。 因此，它通常是具有大量交互性的應用程序或網站的選擇。

JavaScript 的缺點

JavaScript有什麼缺點嗎？ 當然，很少有事情是完全沒有缺點的。 在這種情況下，需要考慮以下幾點：

  • 安全問題——由於 JavaScript 在用戶瀏覽器中運行，因此有可能利用它進行惡意攻擊。 這就是為什麼有些人選擇默認在瀏覽器中將其關閉的原因。
  • 跨瀏覽器支持——與服務器端腳本相比，有時不同的瀏覽器會以不同的方式解釋相同的 JavaScript 代碼。 這會使編寫跨瀏覽器兼容的代碼變得困難。
  • SEO — 搜索引擎抓取 JavaScript 的能力尚不完全清楚，因此它存在潛在的 SEO 問題。 無論如何，您需要學習如何以對 SEO 友好的方式實現 JavaScript。

職業前景

近年來，編程語言變得越來越流行。 在 2021 年 Stack Overflow 開發者調查中，它被評為專業開發者中最受歡迎的編程語言。 連續第九年！

堆棧溢出開發人員調查 2021 年最流行的語言

此外，前 5 名的 Web 框架也都是 JavaScript 框架。

堆棧溢出開發者調查 2021 年最流行的 Web 框架

隨著語言轉移到新的領域，它開闢了越來越多的工作機會。 Devskiller 發現，在 2019 年，72% 的公司都在尋找 JavaScript 開發人員。 編程語言也是面試中最常測試的技能。

如果您想成為全棧開發人員的前端，那麼了解 JavaScript 對這門課程來說幾乎是標準的。 此外，如果您想進入遊戲開發、機器學習或人工智能領域，了解 JavaScript 也很有用。

此外，精通 JavaScript 的人可以獲得高薪。 根據 Indeed.com 的數據，美國 JavaScript 開發人員的平均基本工資為每年 111,278 美元。 即使是初學者也可以期望起價為 90,000 美元。

javascript開發人員薪水美國2021

此外，當您在 LinkedIn 上搜索 JavaScript 時，僅在美國就有超過 400,000 個職位空缺。 因此，掌握了 JavaScript 技能後，您將面臨良好的工作機會和高薪的機會。

JavaScript 對初學者來說容易學習嗎？

更進一步，我們提到 JavaScript 的優點之一是它易於學習。 為了向您展示這是真的，我們現在將介紹一些基本的 JavaScript 概念和代碼。 這樣，您就可以為自己形成意見。

評論

我們先來談談評論。 與大多數編程語言一樣，JavaScript 允許您以瀏覽器不會嘗試執行它們的方式來註釋您的代碼和標記註釋。 這樣，您可以記錄您的工作而不會導致錯誤。

JavaScript 知道兩種類型的註釋：單行和多行。 以下是它們的編寫方法：

 // Nothing in this line will be executed /* Neither Will Any of This */

熟悉 PHP 的人會感到賓至如歸，因為這兩種語言以相同的方式標記註釋。

輸出數據

嘗試 JavaScript 的最簡單方法之一是使用alert() 。 您可以使用它在瀏覽器內的彈出窗口中輸出消息。

javascript開始學習alert方法

要獲得上述信息，只需在瀏覽器開發人員工具中打開控制台並粘貼以下代碼：

 alert("With JavaScript, it's really easy to make this box appear.");

很容易理解，對吧？ 當您現在按 Enter 鍵時，您應該會看到與上面相同的消息。

alert()是一種向用戶輸出數據的 JavaScript 方法。 括號內的字符串（意思是文本）是彈出窗口的內容。 最後需要一個分號來表示這行代碼是完整的。

有了這些知識，就可以自己嘗試了。 只需將括號內的字符串（確保將其放在引號中）更改為您想要創建自己的彈出窗口的任何內容。

帶有控制台的 javascript 警報方法示例

操作 DOM

在網頁設計中，您最常使用 JavaScript 來更改用戶界面或 DOM。 DOM 代表“文檔對像模型”，基本上是構成網頁的 HTML 元素樹。 當您使用開發人員工具檢查任何頁面時，您可以看到它。

在瀏覽器開發者工具中檢查 html

JavaScript 提供了許多不同的選項來對其進行更改。 讓我們通過一個示例來展示它如何做到這一點以及它的外觀。

 <!DOCTYPE html> <html> <body> <h2>Start Learning JavaScript Demo Page</h2> <p></p> <script> document.getElementById("target").innerHTML = "With JavaScript, it's really easy to manipulate the DOM."; </script> </body> </html>

上面，我們創建了一個簡單的 HTML 頁面。 如您所見，它有一個標題和一個帶有target ID 的空段落元素（如果您不了解 HTML 類和 ID，可以在此處了解更多信息）。

底部還有一個 JavaScript 腳本。 它被包裹在<script>標記中，以便瀏覽器識別它。 為了理解它的作用，讓我們把它拆開：

  • document — 訪問文檔對象，即網頁。
  • getElementByID("target") — 根據 ID 查找元素。 括號包含要在引號中查找的 ID。
  • innerHTML — 更改元素的內部 HTML。

將它們放在一起時，腳本基本上會在網頁中搜索具有target ID 並添加到其內部 HTML 的元素。 它應該包含在該位置的內容位於雙引號內的等號後面。 因此，當您在瀏覽器中使用上述代碼訪問文件時，您會看到：

開始學習用 javascript 操作 dom

沒那麼難理解吧？ 希望以上內容能讓您快速了解 JavaScript 語法的工作原理。 您可以在此 JavaScript 備忘單中找到更多基本技巧。

框架呢？

當你開始學習 JavaScript 時，你會開始聽到很多關於框架的東西。 如果您不熟悉這個術語，那麼框架幾乎就是代碼庫的集合。 它們包含網頁、應用程序或任何其他目標的共同特徵和元素。 這使您可以創建和使用這些元素和功能，而無需從頭開始編寫它們。

那麼，如果 JavaScript 框架讓生活變得如此輕鬆，您是否應該立即開始使用它們？

這實際上是開發人員之間激烈辯論的一部分。 有人說你應該在學習框架之前學習 vanilla（意思是簡單的）JavaScript。 其他人認為您應該立即開始使用框架以開始運行。

我們不能在這裡給你一個明確的答案，但在擴展之前至少學習 JavaScript 的基礎知識可能總是一個好主意。 這樣做會讓你更好、更深入地了解你正在做什麼，並使你成為更好的開發人員。

如何開始免費學習 JavaScript？

這只留下了一個問題，你究竟可以從哪裡開始學習 JavaScript，最好不用付費？ 您可以使用以下一些免費資源開始您的旅程：

  • MDN Web Docs — Mozilla 開發者網絡被認為是網頁設計知識的主要資源之一。 它充滿了一流的教程，從 HTML 到 CSS 到 Web 表單、可訪問性等等。 他們還有一個廣泛的 JavaScript 學習指南，您可以免費閱讀。
  • W3Schools — 與 MDN 類似，W3Schools 對 JavaScript 有完整的介紹。 它包含一口大小的課程，其中包含大量自己動手嘗試的示例。 該網站也非常適合作為查找資源。 此外，如果您想要一種稍微結構化的方法並且願意為此付費，您可以嘗試他們的付費課程。
  • JavaScript.info — 一個完整的 JavaScript 在線課程，您可以自己點擊。 大量信息、視覺效果和提示（例如，包括使用哪些代碼編輯器）。 它還具有評論功能，讀者可以在其中提出問題、討論或分享代碼片段。
  • Eloquent JavaScript — Eloquent JavaScript 最初是一本印刷書籍，可在線免費獲取，也可作為電子書獲取。 它非常密集，因此可能更適合中級開發人員。

如果您正在尋找更多，我們還有一篇包含學習資源的文章。 此外，還有一些付費課程，例如 Team Treehouse、Udemy 和 Skillshare。

那麼，你應該在 2022 年開始學習 JavaScript 嗎？

JavaScript 是現代網絡不可或缺的一部分。 如果沒有這種動態編程語言，網站和應用程序的許多功能是不可想像的。 此外，它已擴展到許多其他領域，例如游戲和機器學習。

在這篇文章中，我們試圖回答你是否應該以及如何開始學習 JavaScript 的問題。 當您查看該語言在哪裡發揮作用、它能做什麼以及工作和薪水機會時，很容易看出進入 JavaScript 是一條明智的道路。 即使或特別是作為 WordPress 領域的某個人，這也是有道理的，因為它在這裡也取得了進展。

如果你想試一試，有很多免費的在線資源可以開始學習 JavaScript。 你可以馬上開始，為什麼不呢？

你還有其他學習 JavaScript的入門資源可以分享嗎？ 如果是這樣，請在下面的評論中進行！