赵迪的博客

let 和 const 命令let 命令块级作用域const 命令顶层对象的属性global 对象总结1.let 命令基本用法ES6 新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。{ let a = 10; var b = 1;}a // ReferenceError: a is not defin...

Promise 对象Promise 的含义基本用法Promise.prototype.then()Promise.prototype.catch()Promise.prototype.finally()Promise.all()Promise.race()Promise.resolve()Promise.reject()应用Promise.try()1.Promise...

Iterator 和 for…of 循环Iterator（遍历器）的概念默认 Iterator 接口调用 Iterator 接口的场合字符串的 Iterator 接口Iterator 接口与 Generator 函数遍历器对象的 return()，throw()for…of 循环1.Iterator（遍历器）的概念JavaScript 原有的表示“集合”的数据结构，主要是数...

Generator 函数的语法(2)next()、throw()、return() 的共同点yield* 表达式作为对象属性的 Generator 函数Generator 函数的this含义应用1.next()、throw()、return() 的共同点next()、throw()、return()这三个方法本质上是同一件事，可以放在一起理解。它们的作用都是让 Generat...

Generator 函数的语法(1)简介next 方法的参数for…of 循环Generator.prototype.throw()Generator.prototype.return()1.简介基本概念Generator 函数是 ES6 提供的一种异步编程解决方案，语法行为与传统函数完全不同。本章详细介绍 Generator 函数的语法和 API，它的异步编程应用请看《Ge...

Reflect概述静态方法实例：使用 Proxy 实现观察者模式1.概述Reflect对象与Proxy对象一样，也是 ES6 为了操作对象而提供的新 API。Reflect对象的设计目的有这样几个。（1） 将Object对象的一些明显属于语言内部的方法（比如Object.defineProperty），放到Reflect对象上。现阶段，某些方法同时在Object和Reflect对...

Generator 函数的异步应用传统方法基本概念Generator 函数Thunk 函数co 模块异步编程对 JavaScript 语言太重要。JavaScript 语言的执行环境是“单线程”的，如果没有异步编程，根本没法用，非卡死不可。本章主要介绍 Generator 函数如何完成异步操作。1.传统方法ES6 诞生以前，异步编程的方法，大概有下面四种。回调函数事件监...

Class 的基本语法简介静态方法实例属性的新写法静态属性私有方法和私有属性new.target 属性1.简介类的由来JavaScript 语言中，生成实例对象的传统方法是通过构造函数。下面是一个例子。function Point(x, y) { this.x = x; this.y = y;}Point.prototype.toString = funct...

Class 的继承简介Object.getPrototypeOf()super 关键字类的 prototype 属性和__proto__属性原生构造函数的继承Mixin 模式的实现1.简介Class 可以通过extends关键字实现继承，这比 ES5 的通过修改原型链实现继承，要清晰和方便很多。class Point {}class ColorPoint extend...

async 函数含义基本用法语法async 函数的实现原理与其他异步处理方法的比较实例：按顺序完成异步操作异步遍历器1.含义ES2017 标准引入了 async 函数，使得异步操作变得更加方便。async 函数是什么？一句话，它就是 Generator 函数的语法糖。前文有一个 Generator 函数，依次读取两个文件。const fs = require('fs'...

Module 的语法概述严格模式export 命令import 命令模块的整体加载export default 命令export 与 import 的复合写法模块的继承跨模块常量import()1.概述历史上，JavaScript 一直没有模块（module）体系，无法将一个大程序拆分成互相依赖的小文件，再用简单的方法拼装起来。其他语言都有这项功能，比如 Ruby 的...

编程风格块级作用域字符串解构赋值对象数组函数Map 结构Class模块ESLint 的使用本章探讨如何将 ES6 的新语法，运用到编码实践之中，与传统的 JavaScript 语法结合在一起，写出合理的、易于阅读和维护的代码。多家公司和组织已经公开了它们的风格规范，下面的内容主要参考了 Airbnb 公司的 JavaScript 风格规范。1.块级作用域（1）le...

Module 的加载实现浏览器加载ES6 模块与 CommonJS 模块的差异Node 加载循环加载ES6 模块的转码上一章介绍了模块的语法，本章介绍如何在浏览器和 Node 之中加载 ES6 模块，以及实际开发中经常遇到的一些问题（比如循环加载）。1.浏览器加载传统方法HTML 网页中，浏览器通过<script>标签加载 JavaScript 脚本。<...

Symbol概述作为属性名的 Symbol实例：消除魔术字符串属性名的遍历Symbol.for()，Symbol.keyFor()实例：模块的 Singleton 模式内置的 Symbol 值1.概述ES5 的对象属性名都是字符串，这容易造成属性名的冲突。比如，你使用了一个他人提供的对象，但又想为这个对象添加新的方法（mixin 模式），新方法的名字就有可能与现有方法产生冲...

Set 和 Map 数据结构MapWeakMap1.Map含义和基本用法JavaScript 的对象（Object），本质上是键值对的集合（Hash 结构），但是传统上只能用字符串当作键。这给它的使用带来了很大的限制。const data = {};const element = document.getElementById('myDiv');data[element] ...

变量的解构赋值数组的解构赋值对象的解构赋值字符串的解构赋值数值和布尔值的解构赋值函数参数的解构赋值圆括号问题用途1.数组的解构赋值基本用法ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构（Destructuring）。以前，为变量赋值，只能直接指定值。let a = 1;let b = 2;let c = 3;ES6 允许写成下面这...

字符串的扩展字符的 Unicode 表示法codePointAt()String.fromCodePoint())字符串的遍历器接口normalize()includes(), startsWith(), endsWith()repeat()padStart()，padEnd()matchAll())ES6 加强了对 Unicode 的支持，并且扩展了字符串对象。1.字...

函数的扩展箭头函数双冒号运算符尾调用优化函数参数的尾逗号1.箭头函数基本用法ES6 允许使用“箭头”（=&gt;）定义函数。var f = v =&gt; v;// 等同于var f = function (v) { return v;};如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分。var f = () =&gt; 5;// 等同于...

字符串的扩展模板字符串实例：模板编译标签模板String.raw()模板字符串的限制1.模板字符串传统的 JavaScript 语言，输出模板通常是这样写的（下面使用了 jQuery 的方法）。$('#result').append( 'There are &lt;b&gt;' + basket.count + '&lt;/b&gt; ' + 'i...

数组的扩展扩展运算符Array.from()Array.of()数组实例的 copyWithin()数组实例的 find() 和 findIndex()数组实例的 fill()数组实例的 entries()，keys() 和 values()数组实例的 includes()数组实例的 flat()，flatMap()数组的空位1.扩展运算符含义扩展运算符（sprea...

正则的扩展RegExp 构造函数字符串的正则方法u 修饰符RegExp.prototype.unicode 属性y 修饰符RegExp.prototype.sticky 属性RegExp.prototype.flags 属性s 修饰符：dotAll 模式后行断言Unicode 属性类具名组匹配String.prototype.matchAll1.RegExp 构造函...

对象的扩展属性的简洁表示法属性名表达式方法的 name 属性属性的可枚举性和遍历super 关键字对象的扩展运算符对象（object）是 JavaScript 最重要的数据结构。ES6 对它进行了重大升级，本章介绍数据结构本身的改变，下一章介绍Object对象的新增方法。1.属性的简洁表示法ES6 允许直接写入变量和函数，作为对象的属性和方法。这样的书写更加简洁。cons...

数值的扩展二进制和八进制表示法Number.isFinite(), Number.isNaN()Number.parseInt(), Number.parseFloat()Number.isInteger()Number.EPSILON安全整数和 Number.isSafeInteger()Math 对象的扩展指数运算符1.二进制和八进制表示法ES6 提供了二进制和八进制...

Set 和 Map 数据结构SetWeakSet1.Set基本用法ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值。Set本身是一个构造函数，用来生成 Set 数据结构。const s = new Set();[2, 3, 5, 4, 5, 2, 2].forEach(x =&gt; s.add(x));for (let i of ...

函数的扩展函数参数的默认值rest 参数严格模式name 属性1.函数参数的默认值基本用法ES6 之前，不能直接为函数的参数指定默认值，只能采用变通的方法。function log(x, y) { y = y || 'World'; console.log(x, y);}log('Hello') // Hello Worldlog('Hello', 'Chin...

Proxy概述Proxy 实例的方法Proxy.revocable()this 问题实例：Web 服务的客户端1.概述Proxy 用于修改某些操作的默认行为，等同于在语言层面做出修改，所以属于一种“元编程”（meta programming），即对编程语言进行编程。Proxy 可以理解成，在目标对象之前架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，因此提供了一种...

读懂 ECMAScript 规格概述术语抽象操作的标准流程相等运算符数组的空位数组的 map 方法1.概述规格文件是计算机语言的官方标准，详细描述语法规则和实现方法。一般来说，没有必要阅读规格，除非你要写编译器。因为规格写得非常抽象和精炼，又缺乏实例，不容易理解，而且对于解决实际的应用问题，帮助不大。但是，如果你遇到疑难的语法问题，实在找不到答案，这时可以去查看规格文件，了...