JavaScript语法基础

提示

ECMAScript的语法很大程度上借鉴了C语言和其他类C语言，这使得熟悉C/C++、Java等语言的开发者能够快速上手JavaScript编程。

本文将详细介绍JavaScript的基本语法规则，帮助你建立良好的编程习惯，编写出更加规范和高质量的JavaScript代码。

1.区分大小写

首先要知道，ECMAScript中一切都区分大小写。无论是变量、函数名还是操作符，都区分大小写。这是JavaScript最基本的特性之一，需要特别注意：

变量名大小写敏感：Test和test是两个完全不同的变量
函数名大小写敏感：getMessage()和getmessage()是不同的函数
属性名大小写敏感：object.name和object.Name引用的是不同的属性

// 大小写敏感示例
let test = "小写test";
let Test = "大写Test";
console.log(test);  // 输出：小写test
console.log(Test);  // 输出：大写Test

// 关键字的大小写
typeof "string";    // 有效的操作符
let Typeof = "自定义变量";  // 有效的变量名
let typeof = "错误";  // 语法错误：typeof是关键字

2.标识符

标识符就是变量、函数、属性或函数参数的名称。在JavaScript中，标识符的命名需要遵循以下规则：

2.1 命名规则

第一个字符必须是一个字母、下划线(_)或美元符号($)
剩下的其他字符可以是字母、下划线、美元符号或数字
标识符中可以使用扩展ASCII或Unicode字符

// 有效的标识符
let name = "张三";
let $price = 99.99;
let _private = "私有变量";
let firstName = "John";
let 中文变量 = "支持中文";

// 无效的标识符
let 1name = "错误";    // 不能以数字开头
let user-name = "错误"; // 不能包含连字符
let class = "错误";    // 不能使用关键字

2.2 命名约定

虽然JavaScript的标识符命名规则很灵活，但在实际开发中，我们通常遵循以下约定：

驼峰命名法：这是最常用的命名方式，与ECMAScript内置函数和对象的命名方式一致

// 小驼峰命名法（推荐用于变量和函数名）
let getUserName;
let firstName;

// 大驼峰命名法（推荐用于类名）
class UserAccount;
class TodoList;

常量命名：通常使用全大写字母，单词间用下划线分隔

const MAX_COUNT = 100;
const API_BASE_URL = "https://api.example.com";

命名限制

以下内容不能作为标识符：

关键字（如：if、else、for、class等）
保留字（可能在未来版本中成为关键字的词）
true、false、null

使用保留字作为标识符可能导致代码在未来版本中出现兼容性问题。

3.注释

JavaScript支持两种注释风格，良好的注释习惯可以提高代码的可读性和可维护性：

3.1 单行注释

使用双斜杠（//）进行单行注释，通常用于简短的说明：

// 声明变量
let count = 0;

let name = "张三";  // 用户姓名

// TODO: 后续需要添加数据验证
function validate() {
  // 待实现
}

3.2 多行注释

使用 /* */ 进行多行注释，通常用于较长的说明文档或临时注释掉多行代码：

/* 
 * 函数功能：计算两个数的和
 * 参数说明：
 *   - a: 第一个数
 *   - b: 第二个数
 * 返回值：两数之和
 */
function add(a, b) {
  return a + b;
}

/*
这段代码暂时注释掉
function oldFunction() {
  // 旧的实现
}
*/

注释最佳实践

注释要简洁明了，说明代码的用途而不是重复代码的内容
及时更新注释，确保注释与代码保持同步
使用特殊注释标记如 TODO、FIXME、XXX 等来标记需要特别注意的地方
为函数、类、复杂算法添加必要的文档注释

4.严格模式

严格模式（Strict Mode）是ECMAScript 5引入的一个重要特性，它提供了更严格的错误检查和更安全的运行环境。

4.1 启用严格模式

有两种方式可以启用严格模式：

全局启用：在脚本文件的最开始添加 'use strict' 声明

"use strict";
// 这个文件中的所有代码都运行在严格模式下
function test() {
  // 这里是严格模式
}

函数级启用：在函数体的开始位置添加 'use strict' 声明

function strictFunc() {
  "use strict";
  // 这个函数中的代码运行在严格模式下
}

function normalFunc() {
  // 这个函数运行在非严格模式下
}

4.2 严格模式的主要变化

变量必须声明：

"use strict";
name = "张三";  // 错误：未声明的变量
let name = "张三";  // 正确：变量已声明

禁止删除变量或函数：

"use strict";
let x = 1;
delete x;  // 语法错误

禁止重名属性：

"use strict";
let obj = {
  name: "张三",
  name: "李四"  // 语法错误：重复的属性名
};

禁止使用八进制字面量：

"use strict";
let n = 023;  // 语法错误：八进制
let m = 0o23; // 正确：使用新的八进制语法

this的值不会自动转换为全局对象：

"use strict";
function showThis() {
  console.log(this);  // undefined
}
showThis();

使用建议

推荐在所有新项目中使用严格模式
在模块化开发中，严格模式是默认开启的
在老项目中添加严格模式时要谨慎，需要全面测试
使用严格模式有助于发现潜在问题，提高代码质量

5.语句

JavaScript中的语句是执行特定操作的代码单元。了解语句的正确写法和最佳实践对于编写高质量的代码至关重要。

5.1 语句结束

ECMAScript中的语句通常以分号结尾。虽然在某些情况下可以省略分号，但为了代码的可靠性和可读性，建议始终添加分号。

// 基本语句示例
let name = "张三";    // 变量声明语句
console.log(name);   // 函数调用语句
return false;        // return语句

// 不推荐的写法（省略分号）
let age = 25        // 可能导致难以预料的问题
let score = 90

// 推荐的写法（使用分号）
let age = 25;       // 清晰地表明语句结束
let score = 90;     // 避免潜在的解析问题

5.2 代码块

代码块用花括号({})将多条语句组合在一起，常用于控制语句中。代码块可以创建作用域，影响变量的访问范围。

// 基本代码块示例
if (score >= 60) {
  console.log("及格");
  let message = "继续加油";
  console.log(message);
}

// 嵌套代码块示例
for (let i = 0; i < 3; i++) {
  if (i % 2 === 0) {
    console.log("偶数：" + i);
  } else {
    console.log("奇数：" + i);
  }
}

5.3 控制语句的代码块使用

虽然某些控制语句在只有一条语句时可以省略花括号，但为了代码的可维护性和避免错误，建议始终使用代码块。

// 不推荐的写法（省略花括号）
if (isValid)
  console.log("验证通过");

// 推荐的写法（使用花括号）
if (isValid) {
  console.log("验证通过");
}

// 多条件判断示例
if (score >= 90) {
  console.log("优秀");
  sendReward();
} else if (score >= 60) {
  console.log("及格");
  sendEncouragement();
} else {
  console.log("需要努力");
  sendHelp();
}

语句编写建议

始终使用分号结束语句，保持代码的一致性
控制语句始终使用花括号，即使只有一条语句
保持适当的代码缩进，提高可读性
相关的语句组合在一起，形成有意义的代码块
避免过度嵌套代码块，保持代码结构清晰

语法

JavaScript语法基础 ​

1.区分大小写 ​

2.标识符 ​

2.1 命名规则 ​

2.2 命名约定 ​

3.注释 ​

3.1 单行注释 ​

3.2 多行注释 ​

4.严格模式 ​

4.1 启用严格模式 ​

4.2 严格模式的主要变化 ​

5.语句 ​

5.1 语句结束 ​

5.2 代码块 ​

5.3 控制语句的代码块使用 ​