网站
引入
JavaScript 用来控制网页的交互和逻辑。学习 JS 之前,先要知道它的基础写法,比如语句怎么写、注释怎么写、代码按什么顺序执行。
基础语法不复杂,但它会影响后面写变量、函数、DOM 操作和事件处理。
正文
定义
定义
JS 基础语法就是 JS 代码最基本的书写规则,包括语句、注释、大小写、代码块和执行顺序。
JS 代码通常由一条一条语句组成,浏览器会按照代码出现的顺序从上往下执行。
语句
语句就是 JS 中一条完整的操作。
let name = "Tom";
console.log(name);这里有两条语句:
let name = "Tom";:声明变量并保存数据console.log(name);:在控制台输出变量内容
语句结尾建议写分号 ;,这样结构更清楚,也能减少一些不必要的问题。
注释
注释是写给人看的,浏览器执行代码时会忽略注释。
单行注释
// 这是单行注释
let age = 18;多行注释
/*
这是多行注释
可以写多行说明
*/
let age = 18;注释适合用来说明代码目的,但不要把每一行都解释一遍。
大小写
JS 是区分大小写的。
let name = "Tom";
let Name = "Jerry";
console.log(name);
console.log(Name);name 和 Name 是两个不同的变量。
常见错误:
let userName = "Tom";
console.log(username);上面代码中,userName 和 username 大小写不同,会导致找不到变量。
代码块
代码块通常使用 {} 包起来,表示一组代码。
if (true) {
console.log("条件成立");
}以后学习 if、for、function 时,经常会看到代码块。
执行顺序
JS 默认会按照代码出现顺序,从上往下执行。
console.log("第一步");
console.log("第二步");
console.log("第三步");输出顺序就是:
第一步第二步第三步
如果代码依赖前面创建的变量,就要注意先后顺序。
let title = "学习 JS";
console.log(title);不能在变量声明之前随便使用它。
console.log(title);
let title = "学习 JS";这种写法容易报错,因为代码执行到 console.log(title); 时,title 还没有完成声明。
输出内容
学习 JS 时,最常用的调试方式是 console.log()。
console.log("Hello JS");
console.log(100);
console.log(true);console.log() 会把内容输出到浏览器控制台,适合查看变量值和代码执行结果。
配合 HTML 使用
JS 经常和 HTML 一起使用,用来控制页面内容。
<p class="text">原来的内容</p>const text = document.querySelector(".text");
text.textContent = "修改后的内容";这段代码的意思是:先找到页面中 class 为 text 的元素,再修改它的文本内容。
如果 JS 执行太早,HTML 元素还没有加载出来,就可能找不到元素。
常见写法
| 写法 | 作用 |
|---|---|
// 注释 | 单行注释 |
/* 注释 */ | 多行注释 |
console.log() | 在控制台输出内容 |
let name = "Tom"; | 声明变量并保存数据 |
{} | 表示一个代码块 |
; | 表示一条语句结束 |
特点
- JS 代码由一条一条语句组成
- 语句结尾建议写分号
; - JS 区分大小写
- 注释不会被浏览器执行
{}通常用来包裹一组代码- JS 默认从上往下执行
- 如果代码依赖页面元素,要注意 HTML 是否已经加载完成
理解
JS 基础语法可以理解为写 JS 的基本规矩。
先知道语句怎么写、注释怎么写、代码怎么执行,后面学习变量、函数、对象、DOM 和事件时才不会混乱。
我理解 JS 的基础写法重点不是背概念,而是养成清楚的代码习惯:名字写对、顺序写对、需要调试时用 console.log() 看结果。
引出
理解了基础语法之后,就可以继续学习 JS 变量,用变量保存和使用数据。
后续再结合 JS 函数、JS DOM API 和 JS 事件,就可以让网页根据用户操作发生变化。