From 83aea13cd3626db7ca14f65e42224b5cca3cfa02 Mon Sep 17 00:00:00 2001 From: cogic <72649343+cogic@users.noreply.github.com> Date: Mon, 22 Apr 2024 23:25:03 +0800 Subject: [PATCH 01/14] docs(dom): fix text (#271) --- docs/dom/document.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/dom/document.md b/docs/dom/document.md index 3eb1d02..c3be770 100644 --- a/docs/dom/document.md +++ b/docs/dom/document.md @@ -363,7 +363,7 @@ document.replaceChild( ); ``` -上面代码中，第一步生成一个新的 HTML 文档`doc`，然后用它的根元素`document.documentElement`替换掉`document.documentElement`。这会使得当前文档的内容全部消失，变成`hello world`。 +上面代码中，第一步生成一个新的 HTML 文档`doc`，然后用它的根元素`doc.documentElement`替换掉`document.documentElement`。这会使得当前文档的内容全部消失，变成`hello world`。 ## 方法 @@ -716,7 +716,7 @@ var element = document.getElementById('ul'); element.appendChild(docfrag); ``` -上面代码中，文档片断`docfrag`包含四个`
  • `节点，这些子节点被一次性插入了当前文档。 +上面代码中，文档片段`docfrag`包含四个`
  • `节点，这些子节点被一次性插入了当前文档。 ### document.createEvent() From 2092d3b237de79db450718dc985222642b91bee2 Mon Sep 17 00:00:00 2001 From: ruanyf Date: Wed, 24 Apr 2024 16:59:12 +0800 Subject: [PATCH 02/14] docs(dom/css): fixed #272 --- docs/dom/css.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/dom/css.md b/docs/dom/css.md index 5a1d39a..b8ac695 100644 --- a/docs/dom/css.md +++ b/docs/dom/css.md @@ -292,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'); @@ -328,7 +328,7 @@ var height = styleObj.getPropertyValue('height'); - 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 伪元素 From eefffcf3ce979fe6a0cd9c94ad84425a48022b8e Mon Sep 17 00:00:00 2001 From: cogic <72649343+cogic@users.noreply.github.com> Date: Thu, 25 Apr 2024 15:02:47 +0800 Subject: [PATCH 03/14] docs(dom/css): fix text (#273) --- docs/dom/css.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/dom/css.md b/docs/dom/css.md index b8ac695..b4f1a2d 100644 --- a/docs/dom/css.md +++ b/docs/dom/css.md @@ -401,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 From 2f55be82dc7f810ca220c44b02606656868c4d39 Mon Sep 17 00:00:00 2001 From: ruanyf Date: Sat, 4 May 2024 12:03:27 +0800 Subject: [PATCH 04/14] docs(dom/document): fixed #274 --- docs/dom/document.md | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/docs/dom/document.md b/docs/dom/document.md index c3be770..7af7f3a 100644 --- a/docs/dom/document.md +++ b/docs/dom/document.md @@ -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('全屏播放视频'); } ``` From 370bb5f9ea17a168fdcc9dc6da230e07e5584aed Mon Sep 17 00:00:00 2001 From: ruanyf Date: Sun, 9 Jun 2024 16:40:57 +0800 Subject: [PATCH 05/14] refactor: update dependencies --- package.json | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/package.json b/package.json index f9e429a..6f29bac 100644 --- a/package.json +++ b/package.json @@ -14,11 +14,6 @@ "server": "loppo server", "test": "echo \"Error: no test specified\" && exit 1" }, - "husky": { - "hooks": { - "pre-push": "npm update" - } - }, "repository": { "type": "git", "url": "git+https://github.com/wangdoc/javascript-tutorial.git" @@ -35,9 +30,8 @@ }, "homepage": "https://github.com/wangdoc/javascript-tutorial", "dependencies": { - "gh-pages": "5.x", - "husky": "^4.3.8", + "gh-pages": "6.x", "loppo": "^0.6.24", - "loppo-theme-wangdoc": "^0.6.1" + "loppo-theme-wangdoc": "^0.7.1" } } From 56a50937db811cbfda8c3a4725e59cc6a5e4f782 Mon Sep 17 00:00:00 2001 From: ruanyf Date: Sun, 9 Jun 2024 16:45:42 +0800 Subject: [PATCH 06/14] refactor: update github action script --- .github/workflows/wangdoc.yml | 27 +++++++++++++-------------- 1 file changed, 13 insertions(+), 14 deletions(-) diff --git a/.github/workflows/wangdoc.yml b/.github/workflows/wangdoc.yml index 80f8bfe..c3e5cbe 100644 --- a/.github/workflows/wangdoc.yml +++ b/.github/workflows/wangdoc.yml @@ -10,28 +10,27 @@ jobs: runs-on: ubuntu-latest steps: - name: Checkout - uses: actions/checkout@v2 + uses: actions/checkout@v4 with: persist-credentials: false - name: Setup Node.js - uses: actions/setup-node@main + uses: actions/setup-node@v4 with: - node-version: '14' + 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@3.7.1 + uses: JamesIves/github-pages-deploy-action@v4 with: - GIT_CONFIG_NAME: wangdoc-bot - GIT_CONFIG_EMAIL: yifeng.ruan@gmail.com - REPOSITORY_NAME: wangdoc/website - ACCESS_TOKEN: ${{ secrets.WANGDOC_BOT_TOKEN }} - BASE_BRANCH: master - 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 + 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 From 5aa689b301aae830a6315123334b66763a12f50c Mon Sep 17 00:00:00 2001 From: ruanyf Date: Mon, 24 Jun 2024 14:04:54 +0800 Subject: [PATCH 07/14] docs(bom/window): fixed #277 --- docs/bom/window.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/bom/window.md b/docs/bom/window.md index a012d61..a873fae 100644 --- a/docs/bom/window.md +++ b/docs/bom/window.md @@ -579,7 +579,7 @@ var start = null; function step(timestamp) { if (!start) start = timestamp; var progress = timestamp - start; - // 元素不断向左移，最大不超过200像素 + // 元素不断向右移，最大不超过200像素 element.style.left = Math.min(progress / 10, 200) + 'px'; // 如果距离第一次执行不超过 2000 毫秒， // 就继续执行动画 From 200b44e6d98e73e71595452d72b24a7d201ee50b Mon Sep 17 00:00:00 2001 From: ruanyf Date: Thu, 4 Jul 2024 19:30:11 +0800 Subject: [PATCH 08/14] docs(oop/this): fixed #279 --- docs/oop/this.md | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/docs/oop/this.md b/docs/oop/this.md index 6668047..1913fe3 100644 --- a/docs/oop/this.md +++ b/docs/oop/this.md @@ -679,19 +679,19 @@ 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); + // 或者 f.call(obj); }; // jQuery 的写法 -$('#button').on('click', f); +$('#button').on('click', handler); ``` 上面代码中，点击按钮以后，控制台将会显示`true`。由于`apply()`方法（或者`call()`方法）不仅绑定函数执行时所在的对象，还会立即执行函数，因此不得不把绑定语句写在一个函数体内。更简洁的写法是采用下面介绍的`bind()`方法。 From 1df4272d579f407add746ecf73ff6a664e500364 Mon Sep 17 00:00:00 2001 From: Linho Date: Tue, 24 Sep 2024 17:22:49 +0800 Subject: [PATCH 09/14] =?UTF-8?q?=E7=BB=9F=E4=B8=80=E5=BC=95=E5=8F=B7=20(#?= =?UTF-8?q?282)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * 统一引号 * 统一引号 --- docs/types/null-undefined-boolean.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/types/null-undefined-boolean.md b/docs/types/null-undefined-boolean.md index 9a76679..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 From 5f4a988c6087dcfd0785f9443d0a8e2db54c9f65 Mon Sep 17 00:00:00 2001 From: Linho Date: Tue, 24 Sep 2024 22:04:45 +0800 Subject: [PATCH 10/14] =?UTF-8?q?=E8=A1=A5=E5=85=85=20NaN=20=E8=BF=90?= =?UTF-8?q?=E7=AE=97=E8=A7=84=E5=88=99=20(#283)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/types/number.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/docs/types/number.md b/docs/types/number.md index bb9c1b0..53ebfb5 100644 --- a/docs/types/number.md +++ b/docs/types/number.md @@ -280,6 +280,12 @@ NaN * 32 // NaN NaN / 32 // NaN ``` +但是，ES6 引入指数运算符（`**`）后，出现了一个例外。 + +```javascript +NaN ** 0 // 1 +``` + ### Infinity **（1）含义** From 79dcc9bc1799e3a432b0251e12ee07a4ef9727d6 Mon Sep 17 00:00:00 2001 From: ruanyf Date: Wed, 25 Sep 2024 17:08:58 +0800 Subject: [PATCH 11/14] style: force update theme --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 6f29bac..479b7bb 100644 --- a/package.json +++ b/package.json @@ -32,6 +32,6 @@ "dependencies": { "gh-pages": "6.x", "loppo": "^0.6.24", - "loppo-theme-wangdoc": "^0.7.1" + "loppo-theme-wangdoc": "^0.7.3" } } From 2500a083ca4b38d0db357cebd8effe3090208bf0 Mon Sep 17 00:00:00 2001 From: Enoch Gao Date: Tue, 10 Dec 2024 07:21:34 +0800 Subject: [PATCH 12/14] =?UTF-8?q?fix(docs):=206.2=E6=B3=A8=E9=87=8A?= =?UTF-8?q?=E9=94=99=E8=AF=AF=20(#287)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/oop/this.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/oop/this.md b/docs/oop/this.md index 1913fe3..6792c30 100644 --- a/docs/oop/this.md +++ b/docs/oop/this.md @@ -687,7 +687,7 @@ var func = function () { var handler = function (){ func.apply(obj); - // 或者 f.call(obj); + // 或者 func.call(obj); }; // jQuery 的写法 From e4622c26cc36dea67db450f7af2705aee63c5c4a Mon Sep 17 00:00:00 2001 From: ruanyf Date: Wed, 25 Dec 2024 10:09:38 +0800 Subject: [PATCH 13/14] docs(oop/strict): fixed typo --- docs/oop/strict.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/oop/strict.md b/docs/oop/strict.md index 341f757..cc339c8 100644 --- a/docs/oop/strict.md +++ b/docs/oop/strict.md @@ -108,7 +108,7 @@ function notStrict() { ```javascript // 对只读属性赋值会报错 'use strict'; -Object.defineProperty({}, 'a', { +var obj = Object.defineProperty({}, 'a', { value: 37, writable: false }); From a428ce98018c97fc5880c8b553e9218f1936f14a Mon Sep 17 00:00:00 2001 From: Enoch Gao Date: Tue, 30 Sep 2025 12:52:05 +0800 Subject: [PATCH 14/14] =?UTF-8?q?fix(docs):=20=E4=BF=AE=E5=A4=8D=E5=BC=95?= =?UTF-8?q?=E7=94=A8=E7=AB=A0=E8=8A=82=E5=90=8D=E7=A7=B0=E9=94=99=E8=AF=AF?= =?UTF-8?q?=EF=BC=8C=E9=81=BF=E5=85=8D=E9=98=85=E8=AF=BB=E6=A8=A1=E7=B3=8A?= =?UTF-8?q?=E4=B8=8D=E6=B8=85=20(#291)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/stdlib/object.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/stdlib/object.md b/docs/stdlib/object.md index 24b44ca..783175c 100644 --- a/docs/stdlib/object.md +++ b/docs/stdlib/object.md @@ -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']; @@ -231,7 +231,7 @@ obj.valueOf() === obj // true 上面代码比较`obj.valueOf()`与`obj`本身，两者是一样的。 -`valueOf`方法的主要用途是，JavaScript 自动类型转换时会默认调用这个方法（详见《数据类型转换》一章）。 +`valueOf`方法的主要用途是，JavaScript 自动类型转换时会默认调用这个方法（详见《数据类型的转换》一章）。 ```javascript var obj = new Object();