# 📚 JavaScript 高级程序设计(第 4 版)

# 第 1 章 什么是 JavaScript

1995 年,JavaScript 问世。当时,它的主要用途是代替 Perl 等服务器端语言处理输入验证。

  1. ECMAScript:由 ECMA-262 定义并提供核心功能
  2. 文档对象模型(DOM):提供与网页内容交互的方法和接口
  3. 浏览器对象模型(BOM):提供与浏览器交互的方法和接口

# DOM

文档对象模型(DOM,Document Object Model)是一个应用编程接口(API),用于在 HTML 中使 用扩展的 XML。DOM 将整个页面抽象为一组分层节点。HTML 或 XML 页面的每个组成部分都是一种 节点,包含不同的数据。

  • DOM 的级别
    • DOM Level 1 的目标是映射文档结构
    • DOM Level 2 新增了以下模块
      • DOM 视图:描述追踪文档不同视图(如应用 CSS 样式前后的文档)的接口
      • DOM 事件:描述事件及事件处理的接口
      • DOM 样式:描述处理元素 CSS 样式的接口
      • DOM 遍历和范围:描述遍历和操作 DOM 树的接口
    • DOM Level 3 进一步扩展了 DOM,增加了以统一的方式加载和保存文档的方法

# BOM

IE3 和 Netscape Navigator 3 提供了浏览器对象模型(BOM) API,用于支持访问和操作浏览器的窗口

BOM 主要针对浏览器窗口和子窗口(frame)

# 兼容性查询

mdn (opens new window)

Can I USE (opens new window)

# 第 2 章 HTML 中的 JavaScript

  • 推迟执行脚本

    HTML 4.01 为<script>元素定义了一个叫 defer 的属性。这个属性表示脚本在执行的时候不会改 变页面的结构。也就是说,脚本会被延迟到整个页面都解析完毕后再运行。因此,在<script>元素上 设置 defer 属性,相当于告诉浏览器立即下载,但延迟执行。

  • 异步执行脚本

    给脚本添加 async 属性的目的是告诉浏览器,不必等脚本下载和执行完后再加载页面,同样也不必等到 该异步脚本下载和执行后再加载其他脚本。正因为如此,异步脚本不应该在加载期间修改 DOM

# 总结

  • JavaScript 是通过<script>元素插入到 HTML 页面中的。这个元素可用于把 JavaScript 代码嵌入到 HTML 页面中,跟其他标记混合在一起,也可用于引入保存在外部文件中的 JavaScript。本章的重点可 以总结如下。

    • 要包含外部 JavaScript 文件,必须将 src 属性设置为要包含文件的 URL。文件可以跟网页在同 一台服务器上,也可以位于完全不同的域。
    • 所有<script>元素会依照它们在网页中出现的次序被解释。在不使用 defer 和 async 属性的 情况下,包含在<script>元素中的代码必须严格按次序解释。
    • 对不推迟执行的脚本,浏览器必须解释完位于<script>元素中的代码,然后才能继续渲染页面 的剩余部分。为此,通常应该把<script>元素放到页面末尾,介于主内容之后及</body>标签 之前。
    • 可以使用 defer 属性把脚本推迟到文档渲染完毕后再执行。推迟的脚本原则上按照它们被列出 的次序执行。
    • 可以使用 async 属性表示脚本不需要等待其他脚本,同时也不阻塞文档渲染,即异步加载。异 步脚本不能保证按照它们在页面中出现的次序执行。
    • 通过使用<noscript>元素,可以指定在浏览器不支持脚本时显示的内容。如果浏览器支持并启 用脚本,则<noscript>元素中的任何内容都不会被渲染。

# 思考

# 第 3 章 语言基础

# 语法

  • 最佳实践:ECMAScript 标识符使用驼峰大小写形式,即第一个单词的首字母小写,后面每个单词 的首字母大写
  • 注释 单行 // 多行 /* 1212*/

# 变量

  • 最佳实践
    • 不使用 var
    • const 优先 ,let 次之

# 数据类型

ECMAScript 有 6 中原始类型 Symbol String Number Boolean Undefined BigInt(ECMA2020) typeof 可以判断原始类型,除了 null 因为特殊值 null 被认为是一个对空对象的引用

  • undefined
    • 永远不必显式地将变量值设置为 undefined
  • null
    • console.log(typeof null); // "object"
    • 作为空对象初始值
  • boolean
    • 其他值转换为布尔类型的情况
      数据类型 转换为 true 的值 转换为 false 的值
      String 非空字符串 ""
      Number 非零数值(包括无穷值) 0 NAN
      Symbol 任意值 --
      BigInt 非零数值 0
      Object 任意对象 null
  • number

    Number 类型使用 IEEE 754 格式表示整 数和浮点值(在某些语言中也叫双精度值)。

    • 浮点值 0.1+0.2 不要测试某个特定的浮点值
    • 值得范围
      • ECMAScript 可以表示的最小数值保存在 Number.MIN_VALUE 5e-324
        Number.MAX_VALUE 是 1.797 693 134 862 315 7e+308
      • 正无穷 Infinity 负无穷 -Infinity
      • 要确定一个值是不是有限大(即介于 JavaScript 能表示的最小值和最大值之间),可以使用 isFinite()函数,
    • NaN (Not a Number)

      用于表示本来要返回数值的操作失败了(而不是抛出错误)。

    • 其他值转换为数字类型的情况
      数据类型 转换为 true 的值
      Number 直接返回
      Symbol TypeError
      BigInt 直接返回
      null 0
      undefined NaN
      对象 调用 valueOf()方法,并按照上述规则转换返回的值。如果转换结果是 NaN,则调用 toString()方法,再按照转换字符串的规则转换。
    • 字符串转为数字类型
      1. 如果字符串包含数值字符,包括数值字符前面带加、减号的情况,则转换为一个十进制数值。因此,Number("1")返回 1,Number("123")返回 123,Number("011")返回 11(忽略前面的零)。
      2. 如果字符串包含有效的浮点值格式如"1.1",则会转换为相应的浮点值(同样,忽略前面的零)。
      3. 如果字符串包含有效的十六进制格式如"0xf",则会转换为与该十六进制值对应的十进制整数值。
      4. 如果是空字符串(不包含字符),则返回 0。
      5. 如果字符串包含除上述情况之外的其他字符,则返回 NaN。
    • 使用 parseInt()转换数字类型取整

      通常在需要得到整数时可以优先使 用 parseInt()函数。parseInt()函数更专注于字符串是否包含数值模式。字符串最前面的空格会被 忽略,从第一个非空格字符开始转换。如果第一个字符不是数值字符、加号或减号,parseInt()立即 返回 NaN。这意味着空字符串也会返回 NaN(这一点跟 Number()不一样,它返回 0)。如果第一个字符 是数值字符、加号或减号,则继续依次检测每个字符,直到字符串末尾,或碰到非数值字符。

    • 使用 parseFloat()转换数字类型浮点型

      parseFloat()函数的另一个不同之处在于,它始终忽略字符串开头的零。这个函数能识别前面讨 论的所有浮点格式,以及十进制格式(开头的零始终被忽略)。十六进制数值始终会返回 0。因为 parseFloat()只解析十进制值,因此不能指定底数。最后,如果字符串表示整数(没有小数点或者小 数点后面只有一个零),则 parseFloat()返回整数。

# 第 4 章 变量、作用域与内存

# 第 5 章 基本引用类型

# 第 6 章 集合引用类型

# 第 7 章 迭代器与生成器

# 第 8 章 对象、类与面向对象编程

# 第 9 章 代理与反射

# 第 10 章 函数

# 第 11 章 期约与异步函数

# 第 12 章  BOM

# 第 13 章 客户端检测

# 第 14 章  DOM

# 第 15 章  DOM 扩展

# 第 16 章  DOM2 和 DOM3

# 第 17 章 事件

# 第 18 章 动画与 Canvas 图形

# 第 19 章 表单脚本

# 第 20 章  JavaScript API

# 第 21 章 错误处理与调试

# 第 22 章 处理 XML

# 第 24 章 网络请求与远程资源

# 第 25 章 客户端存储

# 第 26 章 模块

# 第 27 章 工作者线程

# 第 28 章 最佳实践

上次更新: 4/22/2021, 9:35:52 PM