Merge pull request #1 from wangdoc/master

zf2020 · web-flow · commit 44c2ca24a0e3 · 2020-07-14T12:43:58.000+08:00
merge
diff --git 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/docs/bom/cookie.md b/docs/bom/cookie.md
@@ -36,7 +36,7 @@ document.cookie // "id=foo;key=bar"
 
 不同浏览器对 Cookie 数量和大小的限制，是不一样的。一般来说，单个域名设置的 Cookie 不应超过30个，每个 Cookie 的大小不能超过4KB。超过限制以后，Cookie 将被忽略，不会被设置。
 
-浏览器的同源政策规定，两个网址只要域名相同和端口相同，就可以共享 Cookie（参见《同源政策》一章）。注意，这里不要求协议相同。也就是说，`http://example.com`设置的 Cookie，可以被`https://example.com`读取。
+浏览器的同源政策规定，两个网址只要域名相同，就可以共享 Cookie（参见《同源政策》一章）。注意，这里不要求协议相同。也就是说，`http://example.com`设置的 Cookie，可以被`https://example.com`读取。
 
 ## Cookie 与 HTTP 协议
 
diff --git a/docs/bom/same-origin.md b/docs/bom/same-origin.md
@@ -12,7 +12,7 @@
 
 > - 协议相同
 > - 域名相同
-> - 端口相同
+> - 端口相同（这点可以忽略，详见下文）
 
 举例来说，`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`属性。
 
 虽然这些限制是必要的，但是有时很不方便，合理的用途也受到影响。下面介绍如何规避上面的限制。
 
diff --git a/docs/dom/document.md b/docs/dom/document.md
@@ -496,7 +496,7 @@ document.querySelectorAll('DIV, A, SCRIPT');
 
 ### document.getElementsByTagName()
 
-`document.getElementsByTagName`方法搜索 HTML 标签名，返回符合条件的元素。它的返回值是一个类似数组对象（`HTMLCollection`实例），可以实时反映 HTML 文档的变化。如果没有任何匹配的元素，就返回一个空集。
+`document.getElementsByTagName()`方法搜索 HTML 标签名，返回符合条件的元素。它的返回值是一个类似数组对象（`HTMLCollection`实例），可以实时反映 HTML 文档的变化。如果没有任何匹配的元素，就返回一个空集。
 
 ```javascript
 var paras = document.getElementsByTagName('p');
@@ -505,7 +505,7 @@ paras instanceof HTMLCollection // true
 
 上面代码返回当前文档的所有`p`元素节点。
 
-HTML 标签名是大小写不敏感的，因此`getElementsByTagName`方法也是大小写不敏感的。另外，返回结果中，各个成员的顺序就是它们在文档中出现的顺序。
+HTML 标签名是大小写不敏感的，因此`getElementsByTagName()`方法的参数也是大小写不敏感的。另外，返回结果中，各个成员的顺序就是它们在文档中出现的顺序。
 
 如果传入`*`，就可以返回文档中所有 HTML 元素。
 
@@ -524,7 +524,7 @@ var spans = firstPara.getElementsByTagName('span');
 
 ### document.getElementsByClassName()
 
-`document.getElementsByClassName`方法返回一个类似数组的对象（`HTMLCollection`实例），包括了所有`class`名字符合指定条件的元素，元素的变化实时反映在返回结果中。
+`document.getElementsByClassName()`方法返回一个类似数组的对象（`HTMLCollection`实例），包括了所有`class`名字符合指定条件的元素，元素的变化实时反映在返回结果中。
 
 ```javascript
 var elements = document.getElementsByClassName(names);
@@ -542,7 +542,7 @@ var elements = document.getElementsByClassName('foo bar');
 
 注意，正常模式下，CSS 的`class`是大小写敏感的。（`quirks mode`下，大小写不敏感。）
 
-与`getElementsByTagName`方法一样，`getElementsByClassName`方法不仅可以在`document`对象上调用，也可以在任何元素节点上调用。
+与`getElementsByTagName()`方法一样，`getElementsByClassName()`方法不仅可以在`document`对象上调用，也可以在任何元素节点上调用。
 
 ```javascript
 // 非document对象上调用
@@ -551,7 +551,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>
@@ -561,15 +561,15 @@ forms[0].tagName // "FORM"
 
 ### document.getElementById()
 
-`document.getElementById`方法返回匹配指定`id`属性的元素节点。如果没有发现匹配的节点，则返回`null`。
+`document.getElementById()`方法返回匹配指定`id`属性的元素节点。如果没有发现匹配的节点，则返回`null`。
 
 ```javascript
 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')
@@ -582,7 +582,7 @@ document.querySelector('#myElement')
 
 ### document.elementFromPoint()，document.elementsFromPoint()
 
-`document.elementFromPoint`方法返回位于页面指定位置最上层的元素节点。
+`document.elementFromPoint()`方法返回位于页面指定位置最上层的元素节点。
 
 ```javascript
 var element = document.elementFromPoint(50, 50);
diff --git a/docs/dom/element.md b/docs/dom/element.md
@@ -603,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/events/common.md b/docs/events/common.md
@@ -27,9 +27,9 @@ window.addEventListener('beforeunload', function (e) {
 });
 ```
 
-注意，许多手机浏览器默认忽略这个事件，桌面浏览器也有办法忽略这个事件。所以，它可能根本不会生效，不能依赖它来阻止用户关闭窗口。另外，一旦使用了`beforeunload`事件，浏览器就不会缓存当前网页，使用“回退”按钮将重新向服务器请求网页。这是因为监听这个事件的目的，一般是修改初始状态，这时缓存初始页面就没意义了。
+注意，许多手机浏览器（比如 Safari）默认忽略这个事件，桌面浏览器也有办法忽略这个事件。所以，它可能根本不会生效，不能依赖它来阻止用户关闭浏览器窗口，最好不要使用这个事件。
 
-基本上，只有一种场合可以监听`unload`事件，其他情况都不应该监听：用户修改了表单，还没有保存就要离开。
+另外，一旦使用了`beforeunload`事件，浏览器就不会缓存当前网页，使用“回退”按钮将重新向服务器请求网页。这是因为监听这个事件的目的，一般是为了网页状态，这时缓存页面的初始状态就没意义了。
 
 ### unload 事件
 
@@ -45,6 +45,8 @@ window.addEventListener('unload', function(event) {
 
 手机上，浏览器或系统可能会直接丢弃网页，这时该事件根本不会发生。而且跟`beforeunload`事件一样，一旦使用了`unload`事件，浏览器就不会缓存当前网页，理由同上。因此，任何情况下都不应该依赖这个事件，指定网页卸载时要执行的代码，可以考虑完全不使用这个事件。
 
+该事件可以用`pagehide`代替。
+
 ### load 事件，error 事件
 
 `load`事件在页面或某个资源加载成功时触发。注意，页面或资源从浏览器缓存加载，并不会触发`load`事件。
@@ -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){
diff --git 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>
 ```
 
diff --git a/docs/operators/bit.md b/docs/operators/bit.md
@@ -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
diff --git a/docs/operators/boolean.md b/docs/operators/boolean.md
@@ -96,7 +96,7 @@ true && 'foo' && '' && 4 && 'foo' && true
 // 3
 ```
 
-上面代码中，例一里面，第一个布尔值为`false`的表达式为第三个表达式，所以得到一个空字符串。例二里面，所有表达式的布尔值都是`true`，所有返回最后一个表达式的值`3`。
+上面代码中，例一里面，第一个布尔值为`false`的表达式为第三个表达式，所以得到一个空字符串。例二里面，所有表达式的布尔值都是`true`，所以返回最后一个表达式的值`3`。
 
 ## 或运算符（||）
 
diff --git a/docs/operators/priority.md b/docs/operators/priority.md
@@ -162,34 +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
+// 相当于 2 ** (3 ** 2)
 // 512
 ```
+
diff --git a/docs/stdlib/attributes.md b/docs/stdlib/attributes.md
@@ -445,7 +445,7 @@ obj.p2 // 2
 
 除了直接定义以外，属性还可以用存取器（accessor）定义。其中，存值函数称为`setter`，使用属性描述对象的`set`属性；取值函数称为`getter`，使用属性描述对象的`get`属性。
 
-一旦对目标属性定义了存取器，那么存取的时候，都将执行对应的函数。利用这个功能，可以实现许多高级特性，比如某个属性禁止赋值。
+一旦对目标属性定义了存取器，那么存取的时候，都将执行对应的函数。利用这个功能，可以实现许多高级特性，比如定制属性的读取和赋值行为。
 
 ```javascript
 var obj = Object.defineProperty({}, 'p', {
@@ -466,6 +466,7 @@ obj.p = 123 // "setter: 123"
 JavaScript 还提供了存取器的另一种写法。
 
 ```javascript
+// 写法二
 var obj = {
   get p() {
     return 'getter';
@@ -476,7 +477,7 @@ var obj = {
 };
 ```
 
-上面的写法与定义属性描述对象是等价的，而且使用更广泛。
+上面两种写法，虽然属性`p`的读取和赋值行为是一样的，但是有一些细微的区别。第一种写法，属性`p`的`configurable`和`enumerable`都为`false`，从而导致属性`p`是不可遍历的；第二种写法，属性`p`的`configurable`和`enumerable`都为`true`，因此属性`p`是可遍历的。实际开发中，写法二更常用。
 
 注意，取值函数`get`不能接受参数，存值函数`set`只能接受一个参数（即属性的值）。
 
diff --git a/docs/stdlib/regexp.md b/docs/stdlib/regexp.md
diff --git a/docs/stdlib/string.md b/docs/stdlib/string.md
diff --git a/docs/types/array.md b/docs/types/array.md
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
