JavaScript 基础语法
JavaScript 语法是编写 JavaScript 代码时必须遵循的规则和结构。掌握基础语法是学习 JavaScript 的第一步,也是最重要的一步。在本章节中,我们将学习 JavaScript 的基本语法规则。
JavaScript 语句
JavaScript 程序是由一系列可执行的语句组成的。语句是执行特定任务的指令。在 JavaScript 中,语句通常以分号(;)结尾,但分号是可选的。
javascript
let x = 5;
let y = 6;
let z = x + y;语句分隔符
虽然分号是可选的,但为了代码的清晰性和避免潜在问题,建议始终使用分号分隔语句。
javascript
// 推荐写法
let name = "张三";
console.log(name);
// 不推荐写法(虽然可以工作)
let age = 25
console.log(age)JavaScript 代码块
JavaScript 语句可以组合成代码块,用花括号 {} 包裹。代码块通常用于函数、条件语句和循环语句中。
javascript
function myFunction() {
let message = "Hello World";
console.log(message);
return message;
}JavaScript 注释
注释是代码中不会被执行的部分,用于解释代码的作用,提高代码的可读性。
单行注释
使用 // 开头的注释是单行注释,注释内容从 // 开始到行尾结束。
javascript
// 这是一个单行注释
let x = 5; // 这也是单行注释多行注释
使用 /* */ 包裹的注释是多行注释,可以跨越多行。
javascript
/*
这是一个多行注释
可以跨越多行
用于详细解释代码
*/
let y = 10;JavaScript 变量
变量是存储数据值的容器。在 JavaScript 中,使用 var、let 或 const 关键字声明变量。
javascript
var name = "张三";
let age = 25;
const PI = 3.14159;变量命名规则
- 变量名必须以字母、下划线(_)或美元符号($)开头
- 变量名可以包含字母、数字、下划线和美元符号
- 变量名区分大小写
- 不能使用 JavaScript 保留关键字作为变量名
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:表示未定义的值
javascript
let name = "张三"; // 字符串
let age = 25; // 数字
let isStudent = true; // 布尔值
let person = { // 对象
name: "李四",
age: 30
};
let colors = ["红", "绿", "蓝"]; // 数组
let empty = null; // null
let notDefined; // undefinedJavaScript 运算符
运算符用于对操作数执行操作。
算术运算符
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赋值运算符
javascript
let x = 10;
x += 5; // 等同于 x = x + 5
x -= 3; // 等同于 x = x - 3
x *= 2; // 等同于 x = x * 2
x /= 4; // 等同于 x = x / 4比较运算符
javascript
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逻辑运算符
javascript
let x = 5;
let y = 10;
console.log(x < 10 && y > 5); // 逻辑与:true
console.log(x < 10 || y < 5); // 逻辑或:true
console.log(!(x == y)); // 逻辑非:trueJavaScript 函数
函数是一段可重复使用的代码块,用于执行特定任务。
javascript
// 函数声明
function greet(name) {
return "你好," + name + "!";
}
// 调用函数
let message = greet("张三");
console.log(message); // 输出:你好,张三!JavaScript 条件语句
条件语句用于根据不同的条件执行不同的代码块。
javascript
let age = 18;
if (age >= 18) {
console.log("您已成年");
} else {
console.log("您未成年");
}JavaScript 循环语句
循环语句用于重复执行代码块。
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 语句来处理错误。
javascript
try {
// 可能出现错误的代码
let result = x / y;
} catch (error) {
// 处理错误
console.log("发生错误:" + error.message);
} finally {
// 无论是否出错都会执行的代码
console.log("执行完成");
}JavaScript 严格模式
严格模式是 JavaScript 的一种受限变体,它消除了 JavaScript 语言的一些不合理、不严谨之处。
javascript
"use strict";
// 在严格模式下,未声明的变量会报错
// x = 5; // 这会报错
let x = 5; // 正确写法JavaScript 代码风格建议
- 使用一致的缩进:通常使用 2 个或 4 个空格进行缩进
- 使用有意义的变量名:变量名应清楚表达其用途
- 添加注释:对复杂逻辑添加注释说明
- 保持代码简洁:避免过长的代码行和过深的嵌套
- 使用代码格式化工具:如 Prettier 保持代码风格一致
javascript
// 好的代码风格示例
function calculateArea(width, height) {
// 计算矩形面积
const area = width * height;
// 输出结果
console.log("矩形面积为:" + area);
return area;
}
// 调用函数
calculateArea(10, 5);总结
JavaScript 基础语法包括:
- 语句:JavaScript 程序的基本单位,通常以分号结尾
- 代码块:用花括号包裹的语句集合
- 注释:单行注释(//)和多行注释(/* */)
- 变量:使用 var、let、const 声明,遵循命名规则
- 数据类型:字符串、数字、布尔值、对象、数组等
- 运算符:算术、赋值、比较、逻辑运算符
- 函数:可重复使用的代码块
- 条件语句:if...else 语句
- 循环语句:for 循环、while 循环
- 错误处理:try...catch 语句
- 严格模式:提高代码质量和安全性
掌握这些基础语法是学习 JavaScript 的重要第一步。在下一章节中,我们将深入学习 JavaScript 的数据类型。