JavaScript 语法

JavaScript 语法简介

JavaScript 语法是一套规则，它定义了 JavaScript 代码的结构和书写方式。了解 JavaScript 语法是学习 JavaScript 的基础。

基本语法规则

1. 区分大小写

JavaScript 是区分大小写的语言：

javascript

let name = "John";
let NAME = "Jane";
console.log(name); // 输出: John
console.log(NAME); // 输出: Jane

2. 语句结束

JavaScript 语句通常以分号 ; 结束：

javascript

let x = 5;
let y = 10;
console.log(x + y);

虽然分号在某些情况下是可选的，但建议始终使用分号，以避免潜在的错误。

3. 注释

JavaScript 支持两种类型的注释：

javascript

// 单行注释

/*
  多行注释
  可以跨越多行
*/

4. 空白和换行

JavaScript 会忽略多余的空白和换行：

javascript

let x = 5 + 10;
let y = 5 + 10;

5. 代码块

代码块用花括号 {} 包围：

javascript

if (condition) {
  // 代码块
  console.log("Condition is true");
}

function myFunction() {
  // 代码块
  return "Hello";
}

变量声明

JavaScript 中有三种变量声明方式：

1. `var`

函数作用域
可以重复声明
可以被重新赋值

javascript

var x = 5;
var x = 10; // 允许重复声明
x = 15; // 允许重新赋值

2. `let`

块级作用域
不可以重复声明
可以被重新赋值

javascript

let x = 5;
// let x = 10; // 错误：不允许重复声明
x = 15; // 允许重新赋值

3. `const`

块级作用域
不可以重复声明
不可以被重新赋值
必须在声明时初始化

javascript

const x = 5;
// const x = 10; // 错误：不允许重复声明
// x = 15; // 错误：不允许重新赋值

数据类型

JavaScript 有以下数据类型：

1. 原始类型

Number：数字（整数和浮点数）
String：字符串
Boolean：布尔值（true 或 false）
Null：空值
Undefined：未定义
Symbol：唯一标识符（ES6+）
BigInt：大整数（ES2020+）

2. 引用类型

Object：对象
Array：数组
Function：函数

运算符

JavaScript 支持以下运算符：

1. 算术运算符

+：加法
-：减法
*：乘法
/：除法
%：取模
++：自增
--：自减

2. 赋值运算符

=：赋值
+=：加赋值
-=：减赋值
*=：乘赋值
/=：除赋值
%=：取模赋值

3. 比较运算符

==：等于（值相等）
===：严格等于（值和类型都相等）
!=：不等于
!==：严格不等于
>：大于
<：小于
>=：大于等于
<=：小于等于

4. 逻辑运算符

&&：逻辑与
||：逻辑或
!：逻辑非

5. 其他运算符

typeof：获取变量类型
instanceof：检查对象类型
in：检查对象是否包含属性
?:：三元运算符

控制流语句

1. 条件语句

javascript

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

2. 循环语句

`for` 循环

javascript

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

`while` 循环

javascript

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

`do...while` 循环

javascript

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

`for...in` 循环

javascript

const person = { name: "John", age: 30 };
for (let key in person) {
  console.log(key + ": " + person[key]);
}

`for...of` 循环

javascript

const fruits = ["apple", "banana", "orange"];
for (let fruit of fruits) {
  console.log(fruit);
}

3. 跳转语句

break：跳出循环或 switch 语句
continue：跳过当前循环迭代
return：从函数中返回值

函数

1. 函数声明

javascript

function myFunction() {
  return "Hello";
}

2. 函数表达式

javascript

const myFunction = function () {
  return "Hello";
};

3. 箭头函数

javascript

const myFunction = () => "Hello";
const add = (a, b) => a + b;

对象

1. 对象字面量

javascript

const person = {
  name: "John",
  age: 30,
  greet: function () {
    return "Hello, " + this.name;
  },
};

2. 访问对象属性

javascript

console.log(person.name); // 点表示法
console.log(person["age"]); // 方括号表示法

3. 方法调用

javascript

console.log(person.greet());

数组

1. 数组字面量

javascript

const fruits = ["apple", "banana", "orange"];

2. 访问数组元素

javascript

console.log(fruits[0]); // 第一个元素
console.log(fruits.length); // 数组长度

3. 数组方法

javascript

fruits.push("grape"); // 添加元素到末尾
fruits.pop(); // 移除末尾元素
fruits.shift(); // 移除第一个元素
fruits.unshift("mango"); // 添加元素到开头

错误处理

javascript

try {
  // 可能会出错的代码
  throw new Error("Something went wrong");
} catch (error) {
  // 处理错误
  console.error(error.message);
} finally {
  // 无论是否出错都会执行的代码
  console.log("Execution completed");
}

严格模式

严格模式是一种更严格的 JavaScript 执行模式：

javascript

"use strict";

// 严格模式下的代码
let x = 5;
// x = 10; // 正常
// y = 15; // 错误：未声明的变量

小结

JavaScript 语法是学习 JavaScript 的基础，掌握这些基本语法规则可以帮助你编写正确的 JavaScript 代码。JavaScript 的语法相对简单直观，但也有一些需要注意的细节，比如变量声明方式的选择、分号的使用等。随着你对 JavaScript 的深入学习，你会逐渐掌握更多高级语法特性。

JavaScript 语法 ​