1.概述 Web 开发技术-JavaScript VCG JavaScript 2020/4/28 2 内容提要 1 JavaScript 简史 2 JavaScript 功能、脚本语言 3 JavaScript 实现 ECMAScript DOM BOM 4 在 HTML 中使用 JavaScript 直接嵌入 外部引入 JS 代码压缩 2 VCG Explorer 3 中加入名为 JScript 的 JavaScript 实现. 1997：JavaScript 标准化 – ECMAScript 欧洲计算机制造商协会（ECMA） 39 号技术委员会（TC39）负责“标准化一种通用、跨平台、 供应商中立的脚本语言的语法和语义”。 定义一种名为 ECMAScript 的新脚本语言标准。 1998：ISO/IEC 采用 ECMAScript

2019-2021美团技术年货 CODE A BETTER LIFE 【前端篇】 前端 | 2021 1 让 Flutter 在鸿蒙系统上跑起来 1 FlutterWeb 在美团外卖的实践 14 FlutterWeb 性能优化探索与实践 36 设计稿（UI 视图）自动生成代码方案的探索 56 美团外卖终端容器无关化研发框架 74 一款可以让大型 iOS 工程编译速度提升 工程编译速度提升 50% 的工具 96 从预编译的角度理解 Swift 与 Objective-C 及混编机制 108 美团民宿跨端复用框架设计与实践 165 美团跨端一体化富文本管理技术实践 186 前端 | 2020 202 移动端 UI 一致性解决方案 202 美团外卖 Flutter 动态化实践 227 美团开源 Logan Web：前端日志在 Web 端的实现 255 外卖客户端容器化架构的演进 326 微前端在美团外卖的实践 352 积木 Sketch 插件进阶开发指南 372 积木 Sketch Plugin：设计同学的贴心搭档 400 Native 地图与 Web 融合技术的应用与实践 431 目录 前端 | 2019 446 MTFlexbox 自动化埋点探索 447 Litho 在美团动态化方案 MTFlexbox 中的实践 459 开源 React

1.6.1.12 1.6.1.13 目录 Introduction 前端开发者是什么？ 2016 前端开发回顾 展望 2017 第一部分. 前端实践 前端职称 前端开发者所使用的技术 前端开发技能 前端开发者为 ... 而开发 团队里的前端 全能型人才/全栈神话 前端面试 前端开发职位公示 前端开发薪资 前端开发者是如何诞生的 第二部分：学习前端开发 自学 学习设计 JS API 学习web开发工具 学习命令行的使用 学习 Node.js 学习 JS 模块系统 学习模块加载和打包工具 学习包管理工具 学习版本控制 学习构建及任务自动化技术 学习网站性能优化 学习测试 学习无头浏览器 学习离线开发 学习网络／浏览器／应用的安全 多平台开发学习 导向学习 前端课程 前端开发学习的起点 前端资讯、新闻站和播客 第三部分：前端开发工具 笔者有意将本书打造为一份专业资料，为想要或正在实践的前端开发者们提供学习材料和开 发工具。其次，它同样可供主管、CTO、讲师和猎头们深入探索前端开发实践。 本书内容偏向于 WEB 技术（HTML、CSS、DOM、JavaScript）和以这些技术为根基直接构 建而成的开源技术。书中引用和讨论的材料要么就是同类翘楚，要么就是解决问题的流行方 案。 本书不是一本囊括所有前端可用资源的综合纲领。其价值在于为恰好够用的分类信息搜罗简

Promise 迷你书（中文版） 3 前言 写作初衷 本书的目的是以目前还在制定中的ECMAScript 6 Promises规范为中心，着重向各位读 者介绍JavaScript中对Promise相关技术的支持情况。 通过阅读本书，我们希望各位读者能在下面三个目标上有所收获。 • 学习Promise相关内容，能熟练使用Promise模式并进行测试 • 学习Promise适合什么、不适合什么，知 在Firefox和Chrome这样技术比较超前的浏览器上，不需要安装额外的插件就能使用 Promise功能，此外ES6 Promises的规范来源于Promises/A+社区，它有很多版本的实 现。 我们将会从基础API开始介绍可以在浏览器的原生支持或者通过插件支持的Promise功 能。 也希望各位读者能了解这其中Promise适合干什么，不适合干什么，能根据实际需 求选择合适的技术实现方案。 开始阅读之前 -only46 以作为ES6 Promises的polyfill为目的的类库 它严格按照ES6 Promises的规范设计，没 有添加在规范中没有定义的功能。 如果运行环境有原生的Promise支持的话，则优 先使用原生的Promise支持。 Promise扩展类库 Promise扩展类库除了实现了Promise中定义的规范之外，还增加了自己独自定义的功 能。 Promise扩展类库数量非

JavaScript 和 HTML5 打包在一个容器之 中，使得它能同时在 iOS 和安卓上运行。Facebook 公司的 React Native 项目则是将 JavaScript 写的组件，编译成原生组件，从 而使它们具备优秀的性能。 Mozilla 基金会的手机操作系统 Firefox OS，更是直接将 JavaScript 作为操作系统的平台语言，但是很可惜这个项目没有成 导论 - 13 - 本文档使用 书栈(BookStack.CN) 构建 只要有浏览器，就能运行 JavaScript 程序；只要有文本编辑器，就 能编写 JavaScript 程序。这意味着，几乎所有电脑都原生提供 JavaScript 学习环境，不用另行安装复杂的 IDE（集成开发环境） 和编译器。 （2）简单性 相比其他脚本语言（比如 Python 或 Ruby），JavaScript 的语 格式，它是 JavaScript 引擎的中 间码格式，全部都是二进制代码。由于跳过了编译步骤，可以达到接近 强大的性能 导论 - 15 - 本文档使用 书栈(BookStack.CN) 构建 原生二进制代码的运行速度。各种语言（主要是 C 和 C++）通过编译 成 WebAssembly，就可以在浏览器里面运行。 （3）事件驱动和非阻塞式设计。 JavaScript 程序可以采用事件驱

ES6 继承了。因此，ES6 制定的起点其实是2000年。 为什么 ES4 没有通过呢？因为这个版本太激进了，对 ES3 做了彻底升级，导致标 准委员会的一些成员不愿意接受。ECMA 的第39号技术专家委员会（Technical Committee 39，简称TC39）负责制订 ECMAScript 标准，成员包括 Microsoft、 Mozilla、Google 等大公司。 2007年10月，ECMAScript foo = config.foo || 'default foo'; 这样的语句。 （6）遍历Map结构 任何部署了Iterator接口的对象，都可以用 for...of 循环遍历。Map结构原生支 持Iterator接口，配合变量的解构赋值，获取键名和键值就非常方便。 变量的解构赋值 61 var map = new Map(); map.set('first', 'hello'); 比如，strings.raw数组会将 \n 视为 \\ 和 n 两个字符，而不是换行符。这是为 了方便取得转义之前的原始模板而设计的。 String.raw() 字符串的扩展 87 ES6还为原生的String对象，提供了一个 raw 方法。 String.raw 方法，往往用来充当模板字符串的处理函数，返回一个斜杠都被转 义（即斜杠前面再加一个斜杠）的字符串，对应于替换变量后的模板字符串。

...........................................................................58 简史 本 ECMA 标准基于一系列原创技术，其中最著名的是 Netscape 公司的 JavaScript 和 Microsoft 公司的 JScript。该语言由 Netscape 公司的 Brendan Eich 发明并首先出现在该公司 处理， 新的流程控制语句，try/catch 异常处理，更严密的出错定义，数字式输出格式以及一些次要变 更，为即将到来的国际化语言设施和语言未来发展的作提前准备。 关于这个语言的工作并没有结束。技术委员会正在致力于作出意义重大的优化，这包括脚 本在互联网上创建和使用的机制，以及与其它标准实 体（如万维网联盟(W3C)及无线应用协议 论坛的等团体）间更紧密的配合。 1 作用范围 此标准定义了 Electronic Engineers, NewYork(1985). 4 概述 这一节包含一个 ECMAScript 语言的非正式概述。 ECMAScript 是面向对象的编程语言，被用来演示计算技术和操控宿主环境下的计算机对象。 这里定义的 ECMAScript 没有被设计成计算性自足的语言；事实上，在这篇规范中，没有为输 入外部数据或输出计算结果给出任何条款。取而代之的是，我们期望 ECMAScript

GB2312 的基础上扩展得到的，它共收录了 21886 个汉字。在 GBK 的编码方案中，ASCII 字符使用一个字节表示，汉字使用两个字节表示。 3.4.3 Unicode 字符集 随着计算机技术的蓬勃发展，字符集与编码标准百花齐放，而这带来了许多问题。一方面，这些字符集一般 只定义了特定语言的字符，无法在多语言环境下正常工作。另一方面，同一种语言存在多种字符集标准，如 果两台计算机使用 还处于发展早期，那时候使用 16 位的编码就足以表示所有的 Unicode 字符了。 ‧ C# 使用 UTF‑16 编码，主要是因为.NET 平台是由 Microsoft 设计的，而 Microsoft 的很多技术（包 括 Windows 操作系统）都广泛使用 UTF‑16 编码。 由于以上编程语言对字符数量的低估，它们不得不采取“代理对”的方式来表示超过 16 位长度的 Unicode 字符。这是一个 场普及。 ‧ 缓存的大容量和高速度难以兼得。随着 L1、L2、L3 缓存的容量逐步增大，其物理尺寸会变大，与 CPU 核心之间的物理距离会变远，从而导致数据传输时间增加，元素访问延迟变高。在当前技术下，多层级 的缓存结构是容量、速度和成本之间的最佳平衡点。 图 4‑9 计算机存储系统 第 4 章 数组与链表 hello‑algo.com 85 Note 计算机的存储层次结构体现了速度

GB2312 的基础上扩展得到的，它共收录了 21886 个汉字。在 GBK 的编码方案中，ASCII 字符使用一个字节表示，汉字使用两个字节表示。 3.4.3 Unicode 字符集 随着计算机技术的蓬勃发展，字符集与编码标准百花齐放，而这带来了许多问题。一方面，这些字符集一般 只定义了特定语言的字符，无法在多语言环境下正常工作。另一方面，同一种语言存在多种字符集标准，如 果两台计算机使用 还处于发展早期，那时候使用 16 位的编码就足以表示所有的 Unicode 字符了。 ‧ C# 使用 UTF‑16 编码，主要是因为.NET 平台是由 Microsoft 设计的，而 Microsoft 的很多技术（包 括 Windows 操作系统）都广泛使用 UTF‑16 编码。 由于以上编程语言对字符数量的低估，它们不得不采取“代理对”的方式来表示超过 16 位长度的 Unicode 字符。这是一个 场普及。 ‧ 缓存的大容量和高速度难以兼得。随着 L1、L2、L3 缓存的容量逐步增大，其物理尺寸会变大，与 CPU 核心之间的物理距离会变远，从而导致数据传输时间增加，元素访问延迟变高。在当前技术下，多层级 的缓存结构是容量、速度和成本之间的最佳平衡点。 图 4‑9 计算机存储系统 第 4 章 数组与链表 www.hello‑algo.com 85 Tip 计算机的存储层次结构体现

GB2312 的基础上扩展得到的，它共收录 了 21886 个汉字。在 GBK 的编码方案中，ASCII 字符使用一个字节表示，汉字使用两个字节表示。 3.4.3 Unicode 字符集 随着计算机技术的蓬勃发展，字符集与编码标准百花齐放，而这带来了许多问题。一方面，这些字符集一般 只定义了特定语言的字符，无法在多语言环境下正常工作。另一方面，同一种语言存在多种字符集标准，如 果两台计算机使用 还处于发展早期，那时候使用 16 位的编码就足以表示所有的 Unicode 字符了。 ‧ C# 使用 UTF‑16 编码，主要是因为.NET 平台是由 Microsoft 设计的，而 Microsoft 的很多技术（包 括 Windows 操作系统）都广泛使用 UTF‑16 编码。 由于以上编程语言对字符数量的低估，它们不得不采取“代理对”的方式来表示超过 16 位长度的 Unicode 字符。这是一个 场普及。 ‧ 缓存的大容量和高速度难以兼得。随着 L1、L2、L3 缓存的容量逐步增大，其物理尺寸会变大，与 CPU 核心之间的物理距离会变远，从而导致数据传输时间增加，元素访问延迟变高。在当前技术下，多层级 的缓存结构是容量、速度和成本之间的最佳平衡点。 图 4‑9 计算机存储系统 第 4 章 数组与链表 hello‑algo.com 84 � 计算机的存储层次结构体现了速度、容量