正心全栈编程-文档站

Appearance

JavaScript ​

注意

这个章节的 JavaScript 仅是 JavaScript 编程语言的部分内容。JavaScript 语言庞大且内容繁多，这个课程的目的是让 Python 程序员快速上手全栈开发。

如果想要系统学习前端，这部分的内容可以当是打基础了，后续从 es6 开始补充即可。

JavaScript 最初被创建的目的是“使网页更生动”。

这种编程语言写出来的程序被称为 脚本。它们可以被直接写在网页的 HTML 中，在页面加载的时候自动执行。

脚本被以纯文本的形式提供和执行。它们不需要特殊的准备或编译即可运行。

如今，JavaScript 不仅可以在浏览器中执行，也可以在服务端执行，甚至可以在任意搭载了 JavaScript 引擎 的设备中执行。

浏览器中嵌入了 JavaScript 引擎，有时也称作 “JavaScript 虚拟机”。

不同的引擎有不同的“代号”，例如：

  • V8 —— Chrome、Opera 和 Edge 中的 JavaScript 引擎。
  • SpiderMonkey —— Firefox 中的 JavaScript 引擎。
  • 还有其他一些代号，像 “Chakra” 用于 IE，“JavaScriptCore”、“Nitro” 和 “SquirrelFish” 用于 Safari，等等。

上面这些术语很容易记住，因为它们经常出现在开发者的文章中。我们也会用到这些术语。例如，如果 “V8 支持某个功能”，那么我们可以认为这个功能大概能在 Chrome、Opera 和 Edge 中正常运行。

浏览器中的 JavaScript 能做什么？

现代的 JavaScript 是一种 “安全的” 编程语言。它不提供对内存或 CPU 的底层访问，因为它最初是为浏览器创建的，不需要这些功能。

JavaScript 的能力很大程度上取决于它运行的环境。例如，Node.js 支持允许 JavaScript 读取/写入任意文件，执行网络请求等的函数。

浏览器中的 JavaScript 可以做与网页操作、用户交互和 Web 服务器相关的所有事情。

例如，浏览器中的 JavaScript 可以做下面这些事：

  • 在网页中添加新的 HTML，修改网页已有内容和网页的样式。
  • 响应用户的行为，响应鼠标的点击，指针的移动，按键的按动。
  • 向远程服务器发送网络请求，下载和上传文件（所谓的 AJAX）。
  • 获取或设置 cookie，向访问者提出问题或发送消息。
  • 记住客户端的数据（“本地存储”）。

是什么使得 JavaScript 与众不同？

至少有 3 件事值得一提：

  • 与 HTML/CSS 完全集成。
  • 简单的事，简单地完成。
  • 被所有的主流浏览器支持，并且默认开启。

JavaScript 是将这三件事结合在一起的唯一的浏览器技术。

这就是为什么 JavaScript 与众不同。这也是为什么它是用于创建浏览器界面的使用最广泛的工具。

此外，JavaScript 还可用于创建服务器和移动端应用程序等。

总结

  • JavaScript 最开始是专门为浏览器设计的一门语言，但是现在也被用于很多其他的环境。
  • JavaScript 作为被应用最广泛的浏览器语言，且与 HTML/CSS 完全集成，具有独特的地位。

JS 的组成 ​

ECMAScript ​

ECMAScript 是由 ECMA 国际（ 原欧洲计算机制造商协会）进行标准化的一门编程语言，这种语言在万维网上应用广泛，它往往被称为 JavaScript或 JScript，但实际上后两者是 ECMAScript 语言的实现和扩展。

image-20200709030400475

ECMAScript：规定了 JS 的编程语法和基础核心知识，是所有浏览器厂商共同遵守的一套 JS 语法工业标准。

更多参看MDN: MDN手册

DOM：文档对象模型 ​

文档对象模型（DocumentObject Model，简称 DOM ），是 W3C 组织推荐的处理可扩展标记语言的标准编程接口。通过 DOM 提供的接口可以对页面上的各种元素进行操作（大小、位置、颜色等）

BOM：浏览器对象模型 ​

浏览器对象模型 (Browser Object Model，简称BOM) 是指浏览器对象模型，它提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。通过 BOM 可以操作浏览器窗口，比如弹出框、控制浏览器跳转、获取分辨率等。

开发者工具 ​

代码是很容易出现错误的。你也很可能犯错误……哦，我在说什么？只要你是人，你 一定 会犯错误（在写代码的时候），除非你是机器人。

但在浏览器中，默认情况下用户是看不到错误的。所以，如果脚本中有错误，我们看不到是什么错误，更不能够修复它。

为了发现错误并获得一些与脚本相关且有用的信息，浏览器内置了“开发者工具”。

通常，开发者倾向于使用 Chrome 或 Firefox 进行开发，因为它们有最好的开发者工具。一些其它的浏览器也提供开发者工具，有时还具有一些特殊的功能，通常它们都是在“追赶” Chrome 或 Firefox。所以大多数人都有“最喜欢”的浏览器，当遇到某个浏览器独有的问题的时候，人们就会切换到其它的浏览器。

开发者工具很强大，功能丰富。首先，我们将学习如何打开它们，查找错误和运行 JavaScript 命令。

Google Chrome ​

打开网页按下 F12 键，如果你使用 Mac，试试 Cmd+Opt+J。

默认情况下，开发者工具会被在 Console 标签页中打开。