JavaScript 是一种动态类型的脚本语言,广泛用于前端开发。以下是 JavaScript 基础语法的核心内容,包括变量、数据类型、运算符、条件语句和循环。
---
### 1. 变量
变量用于存储数据。JavaScript 中有三种声明变量的方式:
- **`var`**:传统方式,作用域为函数级。
- **`let`**:块级作用域,推荐使用。
- **`const`**:块级作用域,用于声明常量(不可重新赋值)。
```javascript
var name = "Alice"; // 函数作用域
let age = 25; // 块级作用域
const PI = 3.14; // 常量,不可重新赋值
```
---
### 2. 数据类型
JavaScript 是一种动态类型语言,变量的数据类型可以随时改变。主要数据类型包括:
#### 基本数据类型(原始类型)
- **`number`**:数字(整数、浮点数)。
- **`string`**:字符串。
- **`boolean`**:布尔值(`true` 或 `false`)。
- **`undefined`**:未定义的值。
- **`null`**:空值。
- **`symbol`**(ES6):唯一的、不可变的值。
#### 引用数据类型
- **`object`**:对象(包括数组、函数等)。
```javascript
let num = 42; // number
let text = "Hello"; // string
let isActive = true; // boolean
let person = { name: "Alice", age: 25 }; // object
let fruits = ["apple", "banana"]; // array
```
---
### 3. 运算符
JavaScript 支持多种运算符,用于操作变量和值。
#### 算术运算符
- `+`(加)、`-`(减)、`*`(乘)、`/`(除)、`%`(取余)、`**`(幂)。
```javascript
let a = 10;
let b = 3;
console.log(a + b); // 13
console.log(a % b); // 1
```
#### 比较运算符
- `==`(相等)、`===`(严格相等)、`!=`(不等)、`!==`(严格不等)、`>`、`<`、`>=`、`<=`。
```javascript
console.log(10 == "10"); // true(值相等)
console.log(10 === "10"); // false(值和类型都相等)
```
#### 逻辑运算符
- `&&`(与)、`||`(或)、`!`(非)。
```javascript
let x = true;
let y = false;
console.log(x && y); // false
console.log(x || y); // true
console.log(!x); // false
```
#### 赋值运算符
- `=`、`+=`、`-=`、`*=`、`/=`。
```javascript
let num = 10;
num += 5; // num = num + 5
console.log(num); // 15
```
---
### 4. 条件语句
条件语句用于根据条件执行不同的代码块。
#### `if...else`
```javascript
let age = 18;
if (age >= 18) {
console.log("You are an adult.");
} else {
console.log("You are a minor.");
}
```
#### `switch`
```javascript
let day = "Monday";
switch (day) {
case "Monday":
console.log("Start of the week");
break;
case "Friday":
console.log("Weekend is near");
break;
default:
console.log("Midweek");
}
```
#### 三元运算符
```javascript
let isAdult = age >= 18 ? "Yes" : "No";
console.log(isAdult); // Yes
```
---
### 5. 循环
循环用于重复执行代码块。
#### `for` 循环
```javascript
for (let i = 0; i < 5; i++) {
console.log(i); // 0, 1, 2, 3, 4
}
```
#### `while` 循环
```javascript
let i = 0;
while (i < 5) {
console.log(i); // 0, 1, 2, 3, 4
i++;
}
```
#### `do...while` 循环
```javascript
let j = 0;
do {
console.log(j); // 0, 1, 2, 3, 4
j++;
} while (j < 5);
```
#### `for...of` 循环(ES6)
用于遍历可迭代对象(如数组、字符串)。
```javascript
let fruits = ["apple", "banana", "orange"];
for (let fruit of fruits) {
console.log(fruit); // apple, banana, orange
}
```
#### `for...in` 循环
用于遍历对象的属性。
```javascript
let person = { name: "Alice", age: 25 };
for (let key in person) {
console.log(key + ": " + person[key]); // name: Alice, age: 25
}
```
---
### 6. 函数
函数用于封装可重用的代码块。
#### 函数声明
```javascript
function greet(name) {
return "Hello, " + name;
}
console.log(greet("Alice")); // Hello, Alice
```
#### 函数表达式
```javascript
const greet = function(name) {
return "Hello, " + name;
};
console.log(greet("Bob")); // Hello, Bob
```
#### 箭头函数(ES6)
```javascript
const greet = (name) => "Hello, " + name;
console.log(greet("Charlie")); // Hello, Charlie
```
---
### 总结
- **变量**:使用 `let` 和 `const` 声明变量。
- **数据类型**:包括原始类型和引用类型。
- **运算符**:算术、比较、逻辑、赋值等。
- **条件语句**:`if...else`、`switch`、三元运算符。
- **循环**:`for`、`while`、`do...while`、`for...of`、`for...in`。
- **函数**:函数声明、函数表达式、箭头函数。
掌握这些基础语法是学习 JavaScript 的第一步,后续可以深入学习 DOM 操作、异步编程、ES6+ 新特性等。