JavaScript 简介

JavaScript（JS）是一种高级的、解释型的编程语言。它是一种多范式语言，支持面向对象、命令式、声明式和函数式编程风格。JavaScript 广泛用于网页开发，以实现页面上的动态效果和交互功能。

基本语法

变量声明

let variableName = value;
const constantName = value; // 常量

• let 和 const 用于声明变量，const 用于声明常量，其值不可更改。

函数

function functionName(parameters) {
    // 代码
}

• function 关键字用于声明一个函数。

条件语句

if (condition) {
    // 代码
} else {
    // 代码
}

• if 和 else 用于基于条件执行不同的代码块。

循环

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

• for 循环用于重复执行一段代码。

经典示例

1. 交换两个变量的值

let a = 5;
let b = 10;

[a, b] = [b, a]; // ES6 解构赋值

console.log(a); // 10
console.log(b); // 5

2. 函数声明和调用

function greet(name) {
    console.log("Hello, " + name + "!");
}

greet("Alice"); // 输出: Hello, Alice!

3. 条件语句

let score = 75;

if (score > 70) {
    console.log("Pass");
} else {
    console.log("Fail");
}

4. 循环

for (let i = 0; i < 5; i++) {
    console.log(i); // 0 1 2 3 4
}

5. 事件监听器

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

• 为按钮添加点击事件监听器。

6. 异步编程

function fetchData() {
    fetch('https://api.example.com/data')
        .then(response => response.json())
        .then(data => console.log(data))
        .catch(error => console.error('Error:', error));
}

fetchData();

• 使用 fetch API 进行异步数据请求。

7. 箭头函数

const squares = [1, 2, 3, 4, 5].map(x => x * x);

console.log(squares); // [1, 4, 9, 16, 25]

• 使用箭头函数简化函数表达式。

8. 类和对象

class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }

    greet() {
        console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
    }
}

const person = new Person("Bob", 30);
person.greet();

• 使用 class 关键字定义类和对象。

9. 模块导入和导出

// mathUtils.js
export function add(x, y) {
    return x + y;
}

export function subtract(x, y) {
    return x - y;
}

// app.js
import { add, subtract } from './mathUtils.js';

console.log(add(5, 3)); // 8
console.log(subtract(5, 3)); // 2

• 使用 import 和 export 关键字进行模块化编程。

10. Promises

const promise = new Promise((resolve, reject) => {
    if (/* 条件 */ true) {
        resolve("Promise was fulfilled");
    } else {
        reject("Promise was rejected");
    }
});

promise.then(result => console.log(result))
    .catch(error => console.error(error));