导论

注意
本文最后更新于 2024-05-06,文中内容可能已过时。

导论

什么是 JavaScript 语言?

JavaScript 是一种轻量级的脚本语言。所谓“脚本语言”(script language),指的是它不具备开发操作系统的能力,而是只用来编写控制其他大型应用程序(比如浏览器)的“脚本”

JavaScript 也是一种嵌入式(embedded)语言。它本身提供的核心语法不算很多,只能用来做一些数学和逻辑运算。JavaScript 本身不提供任何与 I/O(输入/输出)相关的 API,都要靠宿主环境(host)提供,所以 JavaScript 只合适嵌入更大型的应用程序环境,去调用宿主环境提供的底层 API

目前,已经嵌入 JavaScript 的宿主环境有多种,最常见的环境就是浏览器,另外还有服务器环境,也就是 Node 项目。

从语法角度看,JavaScript 语言是一种“对象模型”语言。各种宿主环境通过这个模型,描述自己的功能和操作接口,从而通过 JavaScript 控制这些功能。但是,JavaScript 并不是纯粹的“面向对象语言”,还支持其他编程范式(比如函数式编程)。这导致几乎任何一个问题,JavaScript 都有多种解决方法。阅读本书的过程中,你会诧异于 JavaScript 语法的灵活性。

JavaScript 的核心语法部分相当精简,只包括两个部分:基本的语法构造(比如操作符、控制结构、语句)和标准库(就是一系列具有各种功能的对象比如ArrayDateMath等)。除此之外,各种宿主环境提供额外的 API(即只能在该环境使用的接口),以便 JavaScript 调用。以浏览器为例,它提供的额外 API 可以分成三大类。

  • 浏览器控制类:操作浏览器
  • DOM 类:操作网页的各种元素
  • Web 类:实现互联网的各种功能

如果宿主环境是服务器,则会提供各种操作系统的 API,比如文件操作 API、网络通信 API 等等。这些你都可以在 Node 环境中找到。

本书主要介绍 JavaScript 核心语法和浏览器网页开发的基本知识,不涉及 Node。全书可以分成以下四大部分。

  • 基本语法
  • 标准库
  • 浏览器 API
  • DOM

JavaScript 语言有多个版本。本书的内容主要基于 ECMAScript 5.1 版本,这是学习 JavaScript 语法的基础。ES6 和更新的语法请参考阮一峰大佬写的《ECMAScript 6 入门》

为什么学习 JavaScript?

最主要的一点是:

JavaScript 的发明目的,就是作为浏览器的内置脚本语言,为网页开发者提供操控浏览器的能力。它是目前唯一一种通用的浏览器脚本语言,所有浏览器都支持。它可以让网页呈现各种特殊效果,为用户提供良好的互动体验。

实验环境

浏览器

本教程包含大量的示例代码,只要电脑安装了浏览器,就可以用来实验了。读者可以一边读一边运行示例,加深理解。

推荐安装 Chrome 浏览器,它的“开发者工具”(Developer Tools)里面的“控制台”(console),就是运行 JavaScript 代码的理想环境。

进入 Chrome 浏览器的“控制台”,有两种方法。

  • 直接进入:按下Option + Command + J(Mac)或者Ctrl + Shift + J(Windows / Linux)
  • 开发者工具进入:开发者工具的快捷键是 F12,或者Option + Command + I(Mac)以及Ctrl + Shift + I(Windows / Linux),然后选择 Console 面板

进入控制台以后,就可以在提示符后输入代码,然后按Enter键,代码就会执行。如果按Shift + Enter键,就是代码换行,不会触发执行。建议阅读本教程时,将代码复制到控制台进行实验。

作为尝试,你可以将下面的程序复制到“控制台”,按下回车后,就可以看到运行结果。

1
2
3
4
5
6
function greetMe(yourName) {
  console.log('Hello ' + yourName);
}

greetMe('World')
// Hello World

WebStorm

我们也可以通过专业的 IDE,比如 WebStorm 来运行 JavaScript 代码,首先我们需要在本地安装 NodeJS 环境,并在 WebStorm 中配置好,然后我们就可以直接在 WebStorm 中新建 JavaScript 文件然后直接运行了。

注意,前面我们提到过,JavaScript 代码在不同的宿主环境中会有不同的表现,因此,同一份 JavaScript 代码在 Node 环境下跟在浏览器环境下,可能有所差别,如果我们想要在浏览器环境下运行我们在 WebStorm 中编写的代码,很简单,只需将 JavaScript 代码放到 HTML 文件中即可。

JavaScript 的各种宿主环境有啥不通,请看《JavaScript 运行环境》

而且在 WebStorm 中我们还可以调试 JavaScript 代码,进行查看变量的操作,虽然浏览器的开发者模式也可以,但是体验确实没有 WebStorm 好

具体的操作请看《WebStorm 小技巧》的如何调试 html 文件中的JavaScript脚本小节

0%