垦荒学园
  • 中文

      • JavaScript 基础语法

      JavaScript 语法是编写 JavaScript 代码时必须遵循的规则和结构。掌握基础语法是学习 JavaScript 的第一步，也是最重要的一步。在本章节中，我们将学习 JavaScript 的基本语法规则。

      JavaScript 语句

      JavaScript 程序是由一系列可执行的语句组成的。语句是执行特定任务的指令。在 JavaScript 中，语句通常以分号（;）结尾，但分号是可选的。

      let x = 5;
let y = 6;
let z = x + y;

      语句分隔符

      虽然分号是可选的，但为了代码的清晰性和避免潜在问题，建议始终使用分号分隔语句。

      // 推荐写法
let name = "张三";
console.log(name);

// 不推荐写法（虽然可以工作）
let age = 25
console.log(age)

      JavaScript 代码块

      JavaScript 语句可以组合成代码块，用花括号 {} 包裹。代码块通常用于函数、条件语句和循环语句中。

      function myFunction() {
    let message = "Hello World";
    console.log(message);
    return message;
}

      JavaScript 注释

      注释是代码中不会被执行的部分，用于解释代码的作用，提高代码的可读性。

      单行注释

      使用 // 开头的注释是单行注释，注释内容从 // 开始到行尾结束。

      // 这是一个单行注释
let x = 5; // 这也是单行注释

      多行注释

      使用 /* */ 包裹的注释是多行注释，可以跨越多行。

      /*
这是一个多行注释
可以跨越多行
用于详细解释代码
*/
let y = 10;

      JavaScript 变量

      变量是存储数据值的容器。在 JavaScript 中，使用 var、let 或 const 关键字声明变量。

      var name = "张三";
let age = 25;
const PI = 3.14159;

      变量命名规则

      1. 变量名必须以字母、下划线（_）或美元符号（$）开头
      2. 变量名可以包含字母、数字、下划线和美元符号
      3. 变量名区分大小写
      4. 不能使用 JavaScript 保留关键字作为变量名
      // 正确的变量命名
let myVariable = "正确";
let _private = "正确";
let $price = 99.99;
let userName123 = "正确";

// 错误的变量命名
// let 123name = "错误"; // 不能以数字开头
// let my-variable = "错误"; // 不能包含连字符
// let let = "错误"; // 不能使用保留关键字

      JavaScript 数据类型

      JavaScript 有多种数据类型，包括：

      • 字符串（String）：用于存储文本
      • 数字（Number）：用于存储数值
      • 布尔值（Boolean）：表示 true 或 false
      • 对象（Object）：用于存储复杂数据
      • 数组（Array）：特殊的对象类型，用于存储有序数据集合
      • null：表示"无值"
      • undefined：表示未定义的值
      let name = "张三";        // 字符串
let age = 25;            // 数字
let isStudent = true;    // 布尔值
let person = {           // 对象
    name: "李四",
    age: 30
};
let colors = ["红", "绿", "蓝"]; // 数组
let empty = null;        // null
let notDefined;          // undefined

      JavaScript 运算符

      运算符用于对操作数执行操作。

      算术运算符

      let x = 10;
let y = 5;

console.log(x + y);  // 加法：15
console.log(x - y);  // 减法：5
console.log(x * y);  // 乘法：50
console.log(x / y);  // 除法：2
console.log(x % y);  // 取模（余数）：0
console.log(x ** y); // 幂运算：100000

      赋值运算符

      let x = 10;

x += 5;  // 等同于 x = x + 5
x -= 3;  // 等同于 x = x - 3
x *= 2;  // 等同于 x = x * 2
x /= 4;  // 等同于 x = x / 4

      比较运算符

      let x = 5;
let y = 10;

console.log(x == y);  // 等于：false
console.log(x != y);  // 不等于：true
console.log(x === y); // 严格等于：false
console.log(x !== y); // 严格不等于：true
console.log(x > y);   // 大于：false
console.log(x < y);   // 小于：true
console.log(x >= y);  // 大于等于：false
console.log(x <= y);  // 小于等于：true

      逻辑运算符

      let x = 5;
let y = 10;

console.log(x < 10 && y > 5);  // 逻辑与：true
console.log(x < 10 || y < 5);  // 逻辑或：true
console.log(!(x == y));        // 逻辑非：true

      JavaScript 函数

      函数是一段可重复使用的代码块，用于执行特定任务。

      // 函数声明
function greet(name) {
    return "你好，" + name + "！";
}

// 调用函数
let message = greet("张三");
console.log(message); // 输出：你好，张三！

      JavaScript 条件语句

      条件语句用于根据不同的条件执行不同的代码块。

      let age = 18;

if (age >= 18) {
    console.log("您已成年");
} else {
    console.log("您未成年");
}

      JavaScript 循环语句

      循环语句用于重复执行代码块。

      // for 循环
for (let i = 0; i < 5; i++) {
    console.log("循环次数：" + i);
}

// while 循环
let count = 0;
while (count < 5) {
    console.log("计数：" + count);
    count++;
}

      JavaScript 错误处理

      JavaScript 提供了 try...catch 语句来处理错误。

      try {
    // 可能出现错误的代码
    let result = x / y;
} catch (error) {
    // 处理错误
    console.log("发生错误：" + error.message);
} finally {
    // 无论是否出错都会执行的代码
    console.log("执行完成");
}

      JavaScript 严格模式

      严格模式是 JavaScript 的一种受限变体，它消除了 JavaScript 语言的一些不合理、不严谨之处。

      "use strict";

// 在严格模式下，未声明的变量会报错
// x = 5; // 这会报错
let x = 5; // 正确写法

      JavaScript 代码风格建议

      1. 使用一致的缩进：通常使用 2 个或 4 个空格进行缩进
      2. 使用有意义的变量名：变量名应清楚表达其用途
      3. 添加注释：对复杂逻辑添加注释说明
      4. 保持代码简洁：避免过长的代码行和过深的嵌套
      5. 使用代码格式化工具：如 Prettier 保持代码风格一致
      // 好的代码风格示例
function calculateArea(width, height) {
    // 计算矩形面积
    const area = width * height;
    
    // 输出结果
    console.log("矩形面积为：" + area);
    
    return area;
}

// 调用函数
calculateArea(10, 5);

      总结

      JavaScript 基础语法包括：

      1. 语句：JavaScript 程序的基本单位，通常以分号结尾
      2. 代码块：用花括号包裹的语句集合
      3. 注释：单行注释（//）和多行注释（/* */）
      4. 变量：使用 var、let、const 声明，遵循命名规则
      5. 数据类型：字符串、数字、布尔值、对象、数组等
      6. 运算符：算术、赋值、比较、逻辑运算符
      7. 函数：可重复使用的代码块
      8. 条件语句：if...else 语句
      9. 循环语句：for 循环、while 循环
      10. 错误处理：try...catch 语句
      11. 严格模式：提高代码质量和安全性

      掌握这些基础语法是学习 JavaScript 的重要第一步。在下一章节中，我们将深入学习 JavaScript 的数据类型。