一篇文章掌握JavaScript的80%：前端到後端
JavaScript，作為一種高級解釋型程式語言，自1995年問世以來，已經成為了Web開發不可或缺的技術之一。從最初的簡單手稿語言，到現在成為了可以開發復雜前端界面和伺服端套用的全棧語言，JavaScript的發展可謂一日千裏。在這篇文章中，我將從JavaScript的基礎語法談起，經過DOM操作、事件處理、異步編程，直至探索Node.js的基礎套用，希望能夠幫助你掌握其80%的核心內容，無論是前端還是後端開發。
JavaScript基礎語法
JavaScript的基礎構建塊包括變量聲明、數據型別、函式、條件判斷和迴圈控制等。理解這些基礎知識，對於深入學習JavaScript至關重要。
變量和數據型別
在JavaScript中，我們使用
var
、
let
或
const
來聲明變量，區別在於
var
聲明的變量可以被重新聲明和更新，而
let
和
const
則解決了這個問題，
const
用於定義常量。
JavaScript的數據型別包括六種原始型別：
String
、
Number
、
Boolean
、
null
、
undefined
和
Symbol
，以及一種復雜型別
Object
。
let name = "John Doe"; // Stringlet age = 30; // Numberlet isDeveloper = true; // Booleanlet hobbies = null; // nulllet project; // undefinedconst PI = 3.14159; // Symbol
函式
函式是執行特定任務的程式碼塊。在JavaScript中，我們可以透過
function
關鍵字來定義函式。
functiongreet(name) {console.log("Hello, " + name + "!");}greet("Alice");
條件判斷和迴圈控制
JavaScript支持常見的條件判斷和迴圈控制結構，如
if...else
語句和
for
迴圈。
if (age >= 18) {console.log("You are an adult.");} else {console.log("You are a minor.");}for (let i = 0; i < 5; i++) {console.log("Number " + i);}
DOM操作
Document Object Model（DOM）是一個跨平台的和語言獨立的介面，允許程式和指令碼動態地存取和更新文件的內容、結構和樣式。
我們可以使用JavaScript來操作DOM，實作對網頁內容的動態修改。例如，以下程式碼演示了如何透過JavaScript修改頁面上元素的內容。
document.getElementById("demo").innerHTML = "Hello, JavaScript!";
透過這種方式，我們可以根據使用者的操作或其他事件動態地更改頁面內容，增強使用者的互動體驗。
事件處理
在Web開發中，事件處理是一項重要功能。JavaScript允許我們捕捉並響應使用者操作，如點選、敲擊鍵盤、移動滑鼠等，透過這種方式，我們可以建立更加動態和互動性強的網頁。
document.getElementById("myButton").onclick = function() { alert("Button clicked!");}
理解並運用好事件處理，是成為一個前端開發者的關鍵步驟之一。
異步編程
JavaScript是單執行緒的，意味著它一次只能處理一個任務。為了不阻塞主執行緒，JavaScript提供了異步編程的能力。異步編程常見的實作方式有回呼函式、Promises和Async/Await。
Promises
Promise是異步編程的一種解決方案，從語法上講，它是一個物件，從它可以獲取異步操作的訊息。
let promise = newPromise(function(resolve, reject) { setTimeout(() => resolve("done"), 1000);});promise.then(result =>console.log(result),error =>console.log(error));
Async/Await
Async/Await是建立在Promises之上的更高層次的抽象，使異步程式碼看起來更像是同步程式碼。
asyncfunctionshowContent() {let promise = newPromise((resolve, reject) => { setTimeout(() => resolve("Async/Await demo"), 1000); });let result = await promise; // 等待，直到promise解決 ()console.log(result);}showContent();
Node.js基礎套用
Node.js是一個基於Chrome V8引擎的JavaScript執行時環境，它使得JavaScript也能夠開發後端程式，進行檔操作、網路請求等。
以下是一個簡單的Node.js程式範例，展示了如何建立一個HTTP伺服器：
const http = require('http');const server = http.createServer((req, res) => { res.statusCode = 200; res.setHeader('Content-Type', 'text/plain'); res.end('Hello, Node.js');});server.listen(3000, '127.0.0.1', () => {console.log('Server running at http://127.0.0.1:3000/');});
透過學習Node.js，JavaScript開發者可以拓展他們的技能集到後端開發，進而全面掌握全棧開發技能。
透過本文的學習，相信你已經對JavaScript有了一個全面的認識，從基礎語法到復雜的異步編程，再到伺服端開發的Node.js，這是一條充滿挑戰和機遇的學習之路。我期待看到你的成長和作品。如果喜歡我的內容，不妨點贊關註，我們下次再見！
大家註意：因為微信最近又改了推播機制，經常有小夥伴說錯過了之前被刪的文章，或者一些限時福利，錯過了就是錯過了。所以建議大家加個 星標 ，就能第一時間收到推播。
點個喜歡支持我吧，點個 在看 就更好了
