误，只有运行时才能知道（因为全局变量可能是顶层对象的属性创造的，而属性的 let 和 const 命令 41 创造是动态的）；其次，程序员很容易不知不觉地就创建了全局变量（比如打字出 错）；最后，顶层对象的属性是到处可以读写的，这非常不利于模块化编程。另一 方面， window 对象有实体含义，指的是浏览器的窗口对象，顶层对象是一个有实 体含义的对象，也是不合适的。 ES6为了改变这一点，一方面规定，为了保持兼容性， Symbol 239 上面代码将导致其他脚本都无法引用 FOO_KEY 。但这样也有一个问题，就是如果 多次执行这个脚本，每次得到的 FOO_KEY 都是不一样的。虽然Node会将脚本的执 行结果缓存，一般情况下，不会多次执行同一个脚本，但是用户可以手动清除缓 存，所以也不是完全可靠。 内置的Symbol值 除了定义自己使用的Symbol值以外，ES6还提供了11个内置的Symbol值，指向语 }); 上面代码对一个空对象架设了一层拦截，重定义了属性的读取（ get ）和设置 （ set ）行为。这里暂时先不解释具体的语法，只看运行结果。对设置了拦截行 为的对象 obj ，去读写它的属性，就会得到下面的结果。 obj.count = 1 // setting count! ++obj.count // getting count! // setting count

js（1.1M），各页面的业务代码 xxx.part.js（使用 FutureBuilder 后）、图片文 件。直接应用这些资源到项目中，会遇到以下问题： ● 功能无法及时更新：浏览器对同名文件的缓存，可能导致程序代码不被及时更 新或者出现执行错乱。 26 > 2021年美团技术年货 ● 首屏渲染性能差：main.dart.js 文件过大，单一文件加载、解析时间过长，势 必会影响首屏的渲染时间。 pool 中已经缓存 过的 Canvas 以便能够节省内存。由于 Flutter Web 自身实现了一套页面滚动机制， 页面滚动过程中，会频繁计算位置信息，引起滚动区域内容被重新创建，这就是为什 么每次滚动都会创建 Canvas 的原因。 我们设计的解决方案是：修改 FlutterSDK，在滚动的过程中定义一个阈值，当滚动 的高度在阈值范围内，我们就会把当前的 Canvas 缓存起来。这样选择性的创建和销 要求。但加载性能数据仍有较大的优化空间，我们会持续对其进行探索。 5.3 滚动性能 针对滚动优化，我们通过修改 Flutter SDK，使得 Canvas 在页面滚动时无需重复 创建，而是被缓存起来。这样大大节省了内存的开销（优化后页面内存占用稳定为 100M 左右，与常规 Web 页面无异），同时在一定程度上提升了滚动性能。以商家学 院文章内容页为例，对比优化前后滚动 FPS ：

500, 600], '-']; 3. 4. var x = ??; 5. 6. alert(x); // x应该为500 Array 提供了一种顺序存储一组元素的功能，并可以按索引来读写。 练习：在新生欢迎会上，你已经拿到了新同学的名单，请排序后显示： 欢迎XXX，XXX，XXX和XXX同 学！ ： 1. 'use strict'; 2. var arr = ['小明', (reason) { 34. log('Failed: ' + reason); 35. }); Log: 可见Promise最大的好处是在异步执行的流程中，把执行代码和处理结果的代码清晰地分离了： 6.6 Promise - 158 - 本文档使用 书栈(BookStack.CN) 构建 Promise还可以做更多的事情，比如，有若干个异步任务，需要先做任务1，如果成功后再做任务2，任 cube(5); // 125 6. cube(10); // 1000 可见，创建偏函数的目的是将原函数的某些参数固定住，可以降低新函数调用的难度。 如果一个函数调用开销很大，我们就可能希望能把结果缓存下来，以便后续调用时直接获得结果。举个 例子，计算阶乘就比较耗时： 1. 'use strict'; 2. 3. function factorial(n) { 4. console

JavaScript 功能、脚本语言 5 VCG JavaScript 2020/4/28 6 2. JavaScript 功能  主要功能  向 HTML 页面添加交互行为  读写 HTML 元素  在数据被提交到服务器之前验证数据  检测访客的浏览器信息  控制 cookies 和本地存储 JavaScript 功能、脚本语言 JavaScript 特点 • 脚本编写语言 • 基于对象的语言 • 简单性 • 安全性 • 动态性 • 跨平台 6 VCG JavaScript 2020/4/28 7  主要功能  向 HTML 页面添加交互行为  读写 HTML 元素  在数据被提交到服务器之前验证数据  检测访客的浏览器信息  控制 cookies 和本地存储 VCG JavaScript 2020/4/28 8 2. JavaScript js 文件内容如下： document.write("欢迎您学习JavaScript!");  优点  可维护性：可在不触及 HTML 标记的情况下，集中精力编辑 JS 代码  可缓存：浏览器可缓存链接的所有外部 JS 文件。若多个页面使用同一个文 件，该文件只需下载一次。 VCG JavaScript 2020/4/28 20 4.3 引入外部文件 标签位置 浏览器遇到

5. o2.a // 1 6. 7. o2.b = 2; 8. o1.b // 2 上面代码中， o1 和 o2 指向同一个对象，因此为其中任何一个变量 添加属性，另一个变量都可以读写该属性。 此时，如果取消某一个变量对于原对象的引用，不会影响到另一个变 量。 1. var o1 = {}; 2. var o2 = o1; 3. 4. o1 = 1; 5. o2 // not defined 5. })() 上面代码中，函数 f 内部是严格模式，这时 eval 内部声明 的 foo 变量，就不会影响到外部。 不过，即使在严格模式下， eval 依然可以读写当前作用域的变量。 函数 - 136 - 本文档使用 书栈(BookStack.CN) 构建 1. (function f() { 2. 'use strict'; 3. var foo Elements：查看网页的 HTML 源码和 CSS 代码。 Resources：查看网页加载的各种资源文件（比如代码文件、字 体文件 CSS 文件等），以及在硬盘上创建的各种内容（比如本地 缓存、Cookie、Local Storage等）。 Network：查看网页的 HTTP 通信情况。 Sources：查看网页加载的脚本源码。 Timeline：查看各种网页行为随时间变化的情况。

长度不可变 长度可变 内存使用率 占用内存少、缓存局部性好 占用内存多 优势操作 随机访问 插入、删除 � 缓存局部性的简单解释 在计算机中，数据读写速度排序是“硬盘 < 内存 < CPU 缓存”。当我们访问数组元素时，计算 机不仅会加载它，还会缓存其周围的其它数据，从而借助高速缓存来提升后续操作的执行速度。 链表则不然，计算机只能挨个地缓存各个结点，这样的多次“搬运”降低了整体效率。 两种实现都支持栈定义中的各项操作，数组实现额外支持随机访问，但这已经超出栈的定义范畴，一般不会用 到。 时间效率 在数组（列表）实现中，入栈与出栈操作都是在预先分配好的连续内存中操作，具有很好的缓存本地性，效率 很好。然而，如果入栈时超出数组容量，则会触发扩容机制，那么该次入栈操作的时间复杂度为 ?(?) 。 在链表实现中，链表的扩容非常灵活，不存在上述数组扩容时变慢的问题。然而，入栈操作需要初始化结点对 效率更高，这是因为： ‧ 出现最差情况的概率很低：虽然快速排序的最差时间复杂度为 ?(?2) ，不如归并排序，但绝大部分情况 下，快速排序可以达到 ?(? log ?) 的复杂度。 ‧ 缓存使用效率高：哨兵划分操作时，将整个子数组加载入缓存中，访问元素效率很高。而诸如「堆排序」 需要跳跃式访问元素，因此不具有此特性。 ‧ 复杂度的常数系数低：在提及的三种算法中，快速排序的 比较、赋值、交换 三种操作的总体数量最少

3 列表 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79 4.4 内存与缓存 * . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 83 4.5 小结 . . . . . 序便可以访问内存中的数据。 图 3‑2 内存条、内存空间、内存地址 Tip 值得说明的是，将内存比作 Excel 表格是一个简化的类比，实际内存的工作机制比较复杂，涉及地址 空间、内存管理、缓存机制、虚拟内存和物理内存等概念。 内存是所有程序的共享资源，当某块内存被某个程序占用时，则无法被其他程序同时使用了。因此在数据结 构与算法的设计中，内存资源是一个重要的考虑因素。比如，算法所占用的内存峰值不应超过系统剩余空闲 优化数据结构的操作效率。 ‧ 空间效率高：数组为数据分配了连续的内存块，无须额外的结构开销。 ‧ 支持随机访问：数组允许在 ?(1) 时间内访问任何元素。 ‧ 缓存局部性：当访问数组元素时，计算机不仅会加载它，还会缓存其周围的其他数据，从而借助高速缓 存来提升后续操作的执行速度。 连续空间存储是一把双刃剑，其存在以下局限性。 ‧ 插入与删除效率低：当数组中元素较多时，插入与删除操作需要移动大量的元素。

3 列表 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79 4.4 内存与缓存 * . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 83 4.5 小结 . . . . . 序便可以访问内存中的数据。 图 3‑2 内存条、内存空间、内存地址 Tip 值得说明的是，将内存比作 Excel 表格是一个简化的类比，实际内存的工作机制比较复杂，涉及地址 空间、内存管理、缓存机制、虚拟内存和物理内存等概念。 内存是所有程序的共享资源，当某块内存被某个程序占用时，则通常无法被其他程序同时使用了。因此在数 据结构与算法的设计中，内存资源是一个重要的考虑因素。比如，算法所占用的内存峰值不应超过系统剩余 优化数据结构的操作效率。 ‧ 空间效率高：数组为数据分配了连续的内存块，无须额外的结构开销。 ‧ 支持随机访问：数组允许在 ?(1) 时间内访问任何元素。 ‧ 缓存局部性：当访问数组元素时，计算机不仅会加载它，还会缓存其周围的其他数据，从而借助高速缓 存来提升后续操作的执行速度。 连续空间存储是一把双刃剑，其存在以下局限性。 ‧ 插入与删除效率低：当数组中元素较多时，插入与删除操作需要移动大量的元素。

3 列表 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 78 4.4 内存与缓存 * . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82 4.5 小结 . . . . . ，程序便可以访问内存中的数据。 图 3‑2 内存条、内存空间、内存地址 � 值得说明的是，将内存比作 Excel 表格是一个简化的类比，实际内存的工作机制比较复杂，涉 及地址空间、内存管理、缓存机制、虚拟内存和物理内存等概念。 内存是所有程序的共享资源，当某块内存被某个程序占用时，则无法被其他程序同时使用了。因此在数据结 构与算法的设计中，内存资源是一个重要的考虑因素。比如，算法所占用的内存峰值不应超过系统剩余空闲 优化数据结构的操作效率。 ‧ 空间效率高：数组为数据分配了连续的内存块，无须额外的结构开销。 ‧ 支持随机访问：数组允许在 ?(1) 时间内访问任何元素。 ‧ 缓存局部性：当访问数组元素时，计算机不仅会加载它，还会缓存其周围的其他数据，从而借助高速缓 存来提升后续操作的执行速度。 连续空间存储是一把双刃剑，其存在以下局限性。 ‧ 插入与删除效率低：当数组中元素较多时，插入与删除操作需要移动大量的元素。

Unlock 声明一个变量/标识 符，使之在确定的上 下文中占有存储位 置。 有变量 1 使存储位置中有值。 绑定值 3 RW（置值后） 4 可以读写：var/let 只读：const RW（置值前） 2 可以读写：var 读失效：let/const 声明一个标识符（作 为常量），使之在确 定的上下文中有确定 值和存储位置。 常量 1 绑定值 3 RW（置值后）