JavaScript基础语法全解析

JavaScript 基础语法

变量声明使用 var、let 或 const。let 和 const 是 ES6 引入的块级作用域变量声明方式，const 用于声明常量。

let name = "Alice";
const PI = 3.14;

数据类型包括原始类型（string、number、boolean、null、undefined、symbol）和引用类型（object、array、function）。

函数与作用域

函数可以通过函数声明或函数表达式定义。箭头函数是 ES6 的简洁语法。

function greet(name) {
  return `Hello, ${name}!`;
}

const greetArrow = (name) => `Hello, ${name}!`;

作用域分为全局作用域、函数作用域和块级作用域（ES6 的 let 和 const）。

控制流与循环

条件语句包括 if...else 和 switch。

if (age >= 18) {
  console.log("Adult");
} else {
  console.log("Minor");
}

循环有 for、while 和 do...while。

for (let i = 0; i < 5; i++) {
  console.log(i);
}

数组与对象

数组是有序的数据集合，可以通过索引访问。

let fruits = ["Apple", "Banana"];
fruits.push("Orange");

对象是键值对的集合。

let person = {
  name: "Alice",
  age: 25,
  greet: function() {
    console.log(`Hello, ${this.name}`);
  }
};

DOM 操作

JavaScript 可以通过 DOM API 操作网页元素。

document.getElementById("myButton").addEventListener("click", function() {
  alert("Button clicked!");
});

异步编程

回调函数、Promise 和 async/await 用于处理异步操作。

fetch("https://api.example.com/data")
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error(error));

事件处理

事件监听器用于响应用户交互。

document.querySelector("#myForm").addEventListener("submit", function(event) {
  event.preventDefault();
  console.log("Form submitted");
});

ES6+ 特性

包括模板字符串、解构赋值、扩展运算符、类等。

class Person {
  constructor(name) {
    this.name = name;
  }
  greet() {
    console.log(`Hello, ${this.name}`);
  }
}

错误处理

try...catch 用于捕获和处理错误。

try {
  let result = riskyOperation();
} catch (error) {
  console.error("An error occurred:", error);
}