行介绍。 1. 渲染流程打通 我们再来回顾一下 Flutter 的图像渲染流程。如图所示，设备发起垂直同步（VSync） 信号之后，先经过 UI 线程的渲染管线（Animate/Build/Layout/Paint），再经过 Raster 线程的组合和栅格化，最终通过 OpenGL 或 Vulkan 将图像上屏。这个流程 的大部分工作都由框架层和引擎层完成，对于鸿蒙的适配，我们主要关注的是与设备 与设备 自身能力相关的问题，即： 4 > 2021年美团技术年货 (1) 如何监听设备的 VSync 信号并通知 Flutter 引擎？ (2) OpenGL/Vulkan 用于上 屏的窗口对象从何而来？ VSync 信号的监听及传递 在 Flutter 引擎的 Android 实现中，设备的 VSync 信号通过 Choreographer 触发， 它产生及消费流程如下图所示： Flutter 的能力。所以现阶段我们可以借用鸿蒙 提供的类似 iOS Grand Central Dispatch 的线程 API，模拟出 VSync 的信号触发 与回调： @Override public void asyncWaitForVsync(long cookie) { // 模拟每秒 60 帧的屏幕刷新间隔：向主线程发送一个异步任务 , 16ms 后调用 applicationContext.getUITaskDispatcher()

4 数组 2.5 对象 2.6 条件判断 2.7 循环 2.8 Map和Set 2.9 iterable 3 函数 3.1 函数定义和调用 3.2 变量作用域 3.3 方法 3.4 高阶函数 3.4.1 map/reduce 3.4.2 filter 3.4.3 sort 3.5 闭包 3.6 箭头函数 3.7 generator 4 标准对象 4.1 Date Date 4.2 RegExp 4.3 JSON 5 面向对象编程 5.1 创建对象 5.2 原型继承 6 浏览器 6.1 浏览器对象 6.2 操作DOM 6.2.1 更新DOM 6.2.2 插入DOM - 2 - 本文档使用 书栈(BookStack.CN) 构建 6.2.3 删除DOM 6.3 操作表单 6.4 操作文件 6.5 AJAX 6.6 Promise 6.7 索引超出了范围，返回undefined JavaScript的对象是一组由键-值组成的无序集合，例如： 1. var person = { 2. name: 'Bob', 3. age: 20, 4. tags: ['js', 'web', 'mobile'], 5. city: 'Beijing', 数组 对象 2.2 数据类型和变量 - 19 - 本文档使用

null，undefined 和布尔值 数值 字符串 对象 函数 数组 运算符 算术运算符 比较运算符 布尔运算符 二进制位运算符 其他运算符，运算顺序 语法专题 数据类型的转换 错误处理机制 编程风格 console 对象与控制台 标准库 Object 对象 属性描述对象 Array 对象 包装对象 Boolean 对象 - 1 - 本文档使用 书栈(BookStack 书栈(BookStack.CN) 构建 Number 对象 String 对象 Math 对象 Date 对象 RegExp 对象 JSON 对象 面向对象编程 实例对象与 new 命令 this 关键字 对象的继承 Object 对象的相关方法 严格模式 异步操作 概述 定时器 Promise 对象 DOM 概述 - 2 - 本文档使用 书栈(BookStack.CN) 构建 - 9 - 本文档使用 书栈(BookStack.CN) 构建 从语法角度看，JavaScript 语言是一种“对象模型”语言。各种宿主 环境通过这个模型，描述自己的功能和操作接口，从而通过 JavaScript 控制这些功能。但是，JavaScript 并不是纯粹的“面 向对象语言”，还支持其他编程范式（比如函数式编程）。这导致几乎 任何一个问题，JavaScript 都有多种解决方法。阅读本书的过程

ECMAScript 6简介 let 和 const 命令 变量的解构赋值 字符串的扩展 正则的扩展 数值的扩展 函数的扩展 数组的扩展 对象的扩展 Symbol Set 和 Map 数据结构 Proxy Reflect Promise 对象 Iterator 和 for...of 循环 Generator 函数的语法 Generator 函数的异步应用 async 函数 Class map, ast } // Babel AST转码 babel.transformFromAst(ast, code, options); // => { code, map, ast } 配置对象 options ，可以参看官方文档http://babeljs.io/docs/usage/options/。 下面是一个例子。 var es6Code = 'let x = n => n + 代码，第二个参数是转换的配置对象。 ECMAScript 6简介 16 babel-polyfill Babel 默认只转换新的 JavaScript 句法（syntax），而不转换新的 API，比 如 Iterator 、 Generator 、 Set 、 Maps 、 Proxy 、 Reflect 、 Symbol 、 Promise 等全局对象，以及一些定义在全局对象上的方法（比

陶召胜 next: 异步编程的问题 变量量读写冲突 异步任务1 异步任务2 共享变量量 读、写 读、写 IO阻塞 回调地狱 Future也有不不⾜足 • get 很容易易导致另⼀一个对象阻塞 • 不不⽀支持多值、⾼高级错误处理理 next: 多任务求解1-10,000,000的和 序号 语⾔言 关键点 1 JavaScript 不不再有回调地狱，变异步为顺序化思维，程序更更加可读 关键点：不不再有回调地狱，变异步为顺序化思维，程序更更加可读 2010年年 ECMAScript 5 2015年年 ECMAScript 6 2017年年 ECMAScript 2017 单线程事件循环 异步，callback 例例⼦子JavaScript实现(Promise) 例例⼦子JavaScript实现(Generator) 例例⼦子JavaScript实现(async/await) gorutine在逻辑处理理器器上执⾏行行 逻辑处理理器器, GOMAXPROCS gorutine OS线程, SetMaxThreads • Go运⾏行行时(runtime)，有⾃自⼰己的 调度器器 • 可以将⼀一个goroutine分配给⼀一 个OS线程并使其执⾏行行，或者把 它挂起⽽而不不与OS线程关联。 处理理阻塞 逻辑处理理器器 P0 线 程 M2 正在运⾏行行的 G1 G2

........................................................................................10 4.2.1 对象................................................................................................... .........................................................................................12 4.3.3 对象................................................................................................... ......................12 4.3.6 本地对象.....................................................................................................................12 4.3.7 内置对象.................................

State Result Reactions1 Resolve Reject Reactions2 p = Promise.resolve(x) p2 = p.then(f) JS 类 对象 构造器 ⾯面向对象的 动态的 名字空间 结构化异常 语句 结构化的 动态类型 动态执行 动态作用域 多语言范型 函数式的 生成器 迭代器 函数是第一类的 可运行/求值的 for then() Promise() class x extends ... async/await then.call(p) pure promise instance 结构化 函数式 ⾯面向对象 并⾏行行 动态 thenabled object async* top level - await import() asyncIterator 任务队列列 执⾏行行栈 runnning function(taskResult) { ... } } https://github.com/aimingoo/redpoll Promise并⾏行行⽅方法的实现 在ES2017及其之后的扩展 多线程环境下的并⾏行行与并发 分布式环境下的应⽤用 End.

JavaScript 实现基础。 JavaScript 简史 4 VCG JavaScript 2020/4/28 5 2. JavaScript 和脚本语言 JavaScript 一种高级的，面向对象的脚本语言。 JavaScript 代码可直接嵌入 HTML 文件或使用外部文件，随网页一起传送到客户端浏览器，然 后通过浏览器的解释器来解释执行。 JavaScript 不支持 I/O（如 页面添加交互行为  读写 HTML 元素  在数据被提交到服务器之前验证数据  检测访客的浏览器信息  控制 cookies 和本地存储 JavaScript 功能、脚本语言 JavaScript 特点 • 脚本编写语言 • 基于对象的语言 • 简单性 • 安全性 • 动态性 • 跨平台 6 VCG JavaScript 2020/4/28 7  主要功能  向 HTML HTML 页面添加交互行为  读写 HTML 元素  在数据被提交到服务器之前验证数据  检测访客的浏览器信息  控制 cookies 和本地存储 VCG JavaScript 2020/4/28 8 2. JavaScript 功能  其他功能，如  网络服务器（Node.js）  处理 Web 应用的 HTTP 请求  机器学习（TensorFlow.js）

Java, C++, Python, Go, JS, TS, C#, Swift, Zig 等语言； ‧ 鼓励读者在章节讨论区互帮互助、共同进步，提问与评论一般能在两日内得到回复； 0.1.1. 读者对象 如果您是「算法初学者」，完全没有接触过算法，或者已经有少量刷题，对数据结构与算法有朦胧的理解，在 会与不会之间反复横跳，那么这本书就是为你而写！ 如果您是「算法老手」，已经积累一定刷题量，接 Figure 0‑4. 运行代码示例 第一步：安装本地编程环境。参照附录教程，如果已有可直接跳过。 第二步：下载代码仓。如果已经安装 Git ，可以通过命令行来克隆代码仓。 git clone https://github.com/krahets/hello-algo.git 当然，你也可以点击“Download ZIP”直接下载代码压缩包，本地解压即可。 Figure 0‑5. 克隆仓库与下载代码 ： ‧「输入空间」用于存储算法的输入数据； ‧「暂存空间」用于存储算法运行中的变量、对象、函数上下文等数据； ‧「输出空间」用于存储算法的输出数据； � 通常情况下，空间复杂度统计范围是「暂存空间」+「输出空间」。 暂存空间可分为三个部分： ‧「暂存数据」用于保存算法运行中的各种 常量、变量、对象 等。 ‧「栈帧空间」用于保存调用函数的上下文数据。系统每次调用函数都会在栈的顶部创建一个栈帧，函数返

2.1 1.6.3 1.6.4 1.7 1.7.1 1.7.2 1.7.3 1.7.4 学习可访问性相关知识 学习 web／浏览器 API 学习 JSON (JavaScript 对象表示法) 学习 JS 模板 学习静态网页生成器 通过JS学习计算机科学 学习前端应用架构 学习数据（例如，JSON）API 的设计 学习 React & Redux 学习渐进式 Web JavaScript 学习 Web 动画 学习 DOM、BOM 和 jQuery 学习网页字体 & 图标 学习可访问性相关知识 学习 web／浏览器 API 学习 JSON (JavaScript 对象表示法) 学习 JS 模板 学习静态网页生成器 通过JS学习计算机科学 学习前端应用架构 学习数据（例如，JSON）API 的设计 学习 React & Redux 学习渐进式 Web 们远去。 2016 前端开发回顾 14 几乎人人都意识到开发网页的时候必须考虑多设备适配策略。 使用其他语言的开发者持续涌入 JS 领域，他们也带来了一些东西：例如类型检测，和对 类语法以及面向对象思想的执念。 前端开发引入了热模块替换技术和时间旅行调试。 原生 JS 浏览器模块加载器更受期待了。 Enforcing CSS 和 JS 格式规范变得更受重视（就 ES3 到 ES6 编码以及