Vue声明式编程 摘要 • 声明式与图灵完备性 • 声明式与UI编程的演进 • 声明式与UI架构 • 声明式与交互 声明式与图灵完备性 声明式 • 我们对语⾔言有很多划分的维度 • 声明式 vs 命令式 • 声明式语⾔言：HTML XML CSS SQL • 命令式语⾔言：C++ Java JavaScript 图灵完备性 • 图灵完备：“可计算性” • 命令式的图灵完备性：if/for， 声明式的图灵完备性：if/递归 Vue的Template的图灵完备性 • 实际上Vue的组件系统具有图灵完备性 • 使⽤用Vue计算阶乘 • 使⽤用Vue计算斐波那契数列列 声明式与UI编程 UI编程 • 70年年代 MVC诞⽣生 ⼈人们意识到视图应该被独⽴立抽象 • 80年年代 标记语⾔言⼤大热 最初更更与⽂文本相关 • 90年年代 可视化编辑器器出现 “独⽴立的UI代码⽂文件” Recycle Pool Visible Area 声明式与UI架构 MVVM • MVC => MVP => MVVM ⼀一脉相承的演化 • MVVM是为声明式/多语⾔言量量身定做的编程模型 MVVM的数据绑定 • 数据绑定是声明式的数据与UI通讯 • ⼀一些逻辑中数据绑定不不需要命令式代码 声明式数据交换 交互的抽象 ⼿手势 时间 陀螺仪 …… 位置 透明度

Web 开发经典丛书 Angular 5 高级编程 (第 2 版) [美] Adam Freeman 著 杨明军 颜炯 等译 北 京 Pro Angular, Second Edition Adam Freeman EISBN：978-1-4842-2306-2 本书封面贴有清华大学出版社防伪标签，无标签者不得销售。 版权所有，侵权必究。侵权举报电话：010-62782989 13701121933 图书在版编目(CIP)数据 Angular 5高级编程：第2版 / (美)亚当 • 弗里曼(Adam Freeman) 著；杨明军 等译. —北京：清华大学出 版社，2018 (Web 开发经典丛书) 书名原文：Pro Angular, Second Angular 5 是构建动态 JavaScript 应用程序的领先框架，而想讲清楚这个包罗万象的一 站式框架的各项强大功能是一项很大的挑战。Adam Freeman 撰著的《Angular 5 高级编程(第 2 版)》详细描述如何在项目中使用 Angular，从最基本的构造块开始，到最终构建最先进 和复杂的功能，深入讲解开发者所需要掌握的所有知识。本书讲解 Angular 框架的面面俱 到，同时

中文书名：Angular 应用安全编程 Book Title: Securing Angular Applications Google Angular Team 编著 北京 • BEIJING 序 Angular 是一个开发平台。它能帮你更轻松的构建 Web 应用。Angular 集声明式模板、依赖注入、端到 端工具和一些最佳实践于一身，为你解决开发方面的各种挑战。Angular 为开发者提升构建 服务也可以依赖其它服务。比如，这里的 HeroService 就依赖于 Logger 服务，它还用 BackendService 来获取英雄数据。BackendService 还可能再转而依赖 HttpClient 服务来从服务器异步获取英雄列 表。 2.2 依赖注入（dependency injection） 组件是服务的消费者，也就是说，你可以把一个服务注入到组件中，让组件类得以访问该服务类。 在 Angular 中，要把一个类定义为服务，就要用

Promise 对象 Iterator 和 for...of 循环 Generator 函数的语法 Generator 函数的异步应用 async 函数 Class 的基本语法 Class 的继承 Decorator Module 的语法 Module 的加载实现 编程风格 读懂规格 ArrayBuffer 2 1.28 2.1 2.2 2.3 参考链接 其他 源码 修订历史 require('babel-core'); // 字符串转码 babel.transform('code();', options); // => { code, map, ast } // 文件转码（异步） babel.transformFile('filename.js', options, function(err, result ) { result; // => { code, map 是一个不存在的变量名，结果返 回“undefined”。所以，在没有 let 之前， typeof 运算符是百分之百安全的，永 远不会报错。现在这一点不成立了。这样的设计是为了让大家养成良好的编程习 惯，变量一定要在声明之后使用，否则就报错。 有些“死区”比较隐蔽，不太容易发现。 function bar(x = y, y = 2) { return [x, y]; } bar();

数据类型的转换 错误处理机制 编程风格 console 对象与控制台 标准库 Object 对象 属性描述对象 Array 对象 包装对象 Boolean 对象 - 1 - 本文档使用 书栈(BookStack.CN) 构建 Number 对象 String 对象 Math 对象 Date 对象 RegExp 对象 JSON 对象 面向对象编程 实例对象与 new 命令 命令 this 关键字 对象的继承 Object 对象的相关方法 严格模式 异步操作 概述 定时器 Promise 对象 DOM 概述 - 2 - 本文档使用 书栈(BookStack.CN) 构建 致谢 当前文档 《阮一峰 JavaScript 教程》 由 进击的皇虫 使用 书栈(BookStack.CN) 进行构建，生成于 2018-02-26。 书栈(BookStack JavaScript 语言的入门教程，也适合当作日 常使用的参考手册。 介绍 - 5 - 本文档使用 书栈(BookStack.CN) 构建 前言 前言 我写这本教程，主要原因是自己需要。 编程时，往往需要查阅资料，确定准确用法。理想的 JavaScript 参 考书，应该简明易懂，一目了然，告诉我有哪些注意点，提供代码范 例。如果涉及重要概念，还应该适当讲解。可是大多数时候，现实都不

陶召胜 next: 异步编程的问题 变量量读写冲突 异步任务1 异步任务2 共享变量量 读、写 读、写 IO阻塞 回调地狱 Future也有不不⾜足 • get 很容易易导致另⼀一个对象阻塞 • 不不⽀支持多值、⾼高级错误处理理 next: 多任务求解1-10,000,000的和 序号 语⾔言 关键点 1 JavaScript 不不再有回调地狱，变异步为顺序化思维，程序更更加可读 加可读 2 Go ⾼高并发调度，通道让异步编程更更简单 3 Scala （1）简洁的异步编程 （2）AKKA：分布式计算框架 4 Java （1）fork/join （2）CompletableFuture （3）反应式编程（Reactive Programming ) next: JavaScript 关键点：不不再有回调地狱，变异步为顺序化思维，程序更更加可读 2010年年 ECMAScript 2017 单线程事件循环 异步，callback 例例⼦子JavaScript实现(Promise) 例例⼦子JavaScript实现(Generator) 例例⼦子JavaScript实现(async/await) 多进程，利利⽤用多核 输出： next: Go 关键点：⾼高并发调度，通道让异步编程更更简单 2015年年 Go 1.5 2016年年

filter 3.4.3 sort 3.5 闭包 3.6 箭头函数 3.7 generator 4 标准对象 4.1 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 网页，以及无数 基于HTML5的手机App，交互逻辑都是由JavaScript驱动的。 简单地说，JavaScript是一种运行在浏览器中的解释型的编程语言。 那么问题来了，为什么我们要学JavaScript？尤其是当你已经掌握了某些其他编程语言如Java、 C++的情况下。 简单粗暴的回答就是：因为你没有选择。在Web世界里，只有JavaScript能跨平台、跨浏览器驱动网 页，与用户交互。 JavaScript一度被认为是一种玩具编程语言，它有很多缺陷，所以不被大多数后端开发人员所重视。 很多人认为，写JavaScript代码很简单，并且JavaScript只是为了在网页上添加一点交互和动画效 果。 但这是完全错误的理解。JavaScript确实很容易上手，但其精髓却不为大多数开发人员所熟知。编写 高质量的JavaScript代码更是难上加难。 一个合格的开发人员应该精通JavaScript和其他编程语言。如果你已经掌握了其他编程语言，或者你

............................................................................... 17 专栏: Promise只能进行异步操作？ .............................................................................. 17 Promise#then Promise是抽象异步处理对象以及对其进行各种操作的组件。 其详细内容在接下来我们 还会进行介绍，Promise并不是从JavaScript中发祥的概念。 Promise最初被提出是在 E语言12中， 它是基于并列/并行处理设计的一种编程语言。 现在JavaScript也拥有了这种特性，这就是本书所介绍的JavaScript Promise。 另外，如果说到基于JavaScript的异步处理，我想大多数都会想到利用回调函数。 多数都会想到利用回调函数。 使用了回调函数的异步处理 ---- getAsync("fileA.txt", function(error, result){ if(error){// 取得失败时的处理 throw error; } 8 https://github.com/azu/promises-book/issues?state=open 9 https://github

webpack 对象，然后执行构建流程 webpack-cli对配置文件和命令行参数进行转换最终生成配置选项参数 options Webpack 的本质 Webpack可以将其理解是一种基于事件流的编程范例，一系列的插件运行。 先看一段代码 class Compiler extends Tapable { // ... } class Compilation extends Tapable //异步并发钩子 AsyncParallelBailHook, //异步并发熔断钩子 AsyncSeriesHook, //异步串行钩子 AsyncSeriesBailHook AsyncSeriesBailHook, //异步串行熔断钩子 AsyncSeriesWaterfallHook //异步串行流水钩子 } = require("tapable"); Tapable 是一个类似于 Node.js 的 EventEmitter

Edge，数据参考自 IE 9 至 IE 11） 火狐 Safari 无头浏览器（Headless Browsers） 无头浏览器是一种没有用户图形界面的 WEB 浏览器，我们可以用命令行界面编程控制该浏览 器，达到自动化运行 Web 页面（比如功能测试、网站检索、单元测试等）的目的。可将无头 浏览器看作网页浏览器，不过你用命令行来检索、遍历网页。 最常见的无头浏览器： PhantomJS Code 编辑器，这成为一种趋势。 jQuery 仍有热度，但使用率和关注度都在下滑。jQuery 3 已然发布 ，却无人问津。 Vue.js 理所应当地吸收更多追随者。 JavaScript 函数式编程和模式备受关注。 离线开发和渐进式 WEB 应用（PWA）步入主流。 微软发力。 基于 web 技术，使用 NW.js 和 Electron 开发 windows，OSX 和 linux 原生应用的方式逐 中使用 import 进行模块懒加载。详情见这里 JavaScript 同构解决方案持续增长，致敬服务器端输出前端内容的时代（即：页面直出 到浏览器）。参见 NextJS 响应式编程继续茁壮成长。（参见 MobX and RxJS） React，尤其是它倡导的概念继续占有支配地位。而 React 本身会被彻底重写（React Fiber）或者进化（Inferno） Angular