### 1.4 本章小结与目标
恭喜你完成了JavaScript的第一章学习!让我们一起回顾一下本章的核心内容和学习目标,确保你已经掌握了这些基础但重要的知识点。
#### 核心目标回顾
##### 1. 能说出JS的作用:让网页有交互
JavaScript最核心的功能就是为网页添加交互性。没有JS的网页就像一本静态的杂志,只能看不能动;而有了JS,网页就变成了可以对话的智能助手。
**实际应用场景**:
- 点击按钮弹出提示
- 表单输入时实时验证
- 动态更新页面内容
- 响应鼠标移动、键盘输入等用户操作
记住:**HTML负责结构,CSS负责样式,JS负责交互**,三者分工明确又紧密合作。
##### 2. 能独立用VS Code创建文件、在浏览器运行
开发环境是编程的基础,现在你应该能够:
1. **创建项目文件夹**:在电脑上整理好你的代码文件
2. **用VS Code打开文件夹**:通过"文件 > 打开文件夹"菜单
3. **新建HTML文件**:点击左侧文件图标+按钮,输入文件名(如`index.html`)
4. **编写代码并保存**:使用`Ctrl+S`(Windows)或`Cmd+S`(Mac)保存
5. **在浏览器中运行**:通过"Open in Browser"插件或直接拖放文件到浏览器
**常见问题解决**:
- 如果浏览器没有显示最新修改,按`F5`刷新页面
- 确保文件名后缀是`.html`而不是`.txt`
- 检查代码中是否有拼写错误
##### 3. 记住两个基础语法
###### `alert()` - 弹窗提示
这是最简单的交互方式,会弹出一个带有消息和确定按钮的对话框:
```javascript
// 显示文本消息
alert("Hello, World!");
// 也可以显示数字
alert(123);
// 或者简单计算结果
alert(2 + 3);
```
**使用场景**:简单的用户提示或调试信息。
###### `console.log()` - 控制台输出
这是开发者最常用的调试工具,在浏览器控制台中显示信息,不会打扰用户:
```javascript
// 打印文本
console.log("我在控制台输出");
// 打印变量
let name = "小明";
console.log(name);
// 打印多个值
console.log("姓名:", name, "年龄:", 18);
```
**如何查看**:按`F12`打开开发者工具,切换到"控制台"(Console)标签。
**使用场景**:开发过程中的调试、查看变量值、跟踪程序执行流程。
#### 自查清单
在进入下一章前,确保你能完成以下任务:
- [ ] 解释为什么网页需要JavaScript
- [ ] 独立完成从创建文件夹到在浏览器运行HTML文件的全过程
- [ ] 写出使用`alert()`显示"学习JS很有趣"的代码
- [ ] 写出使用`console.log()`打印你的名字的代码
- [ ] 知道如何在浏览器中查看控制台输出
#### 编程金句
> "编程就像搭建积木,复杂的系统都是由简单的部分组成。掌握基础,才能构建高楼。"
下一章我们将学习JavaScript的基本语法,开始真正的编程之旅!准备好迎接新的挑战了吗?
1.4 本章小结与目标
1 分钟阅读
72 字
如果文章对您有帮助,欢迎支持作者继续创作