From 77f0fa610d21b4903ef980846592851fa554dead Mon Sep 17 00:00:00 2001 From: Jason Lee Date: Sat, 4 Jun 2022 20:04:31 +0800 Subject: [PATCH] AutoCorrect files/zh-cn/conflicting --- .../objects/classes_in_javascript/index.html | 70 +++++++++---------- .../conflicting/web/api/audionode/index.html | 2 +- .../conflicting/web/api/blob/size/index.html | 4 +- .../conflicting/web/api/caches/index.html | 2 +- .../api/canvasrenderingcontext2d/index.html | 6 +- .../document/createnodeiterator/index.html | 8 +-- .../index.html | 2 +- .../fullscreenchange_event/index.html | 2 +- .../visibilitychange_event/index.html | 2 +- .../conflicting/web/api/file/name/index.html | 4 +- .../file_and_directory_entries_api/index.html | 30 ++++---- .../geolocation/getcurrentposition/index.html | 4 +- .../web/api/headers/get/index.html | 6 +- .../devicechange_event/index.html | 2 +- .../web/api/mouseevent/pagey/index.html | 16 ++--- .../api/mutationobserver/observe/index.html | 10 +-- .../web/api/navigator/getbattery/index.html | 20 +++--- .../web/api/pointer_events/index.html | 6 +- .../icecandidate_event/index.html | 6 +- .../rtcpeerconnection/index.html | 4 +- .../api/storagemanager/estimate/index.html | 10 +-- .../conflicting/web/api/wheelevent/index.html | 18 ++--- .../api/window/afterprint_event/index.html | 4 +- .../api/window/beforeprint_event/index.html | 4 +- .../api/window/beforeunload_event/index.html | 18 ++--- .../api/window/hashchange_event/index.html | 8 +-- .../conflicting/web/api/window/index.html | 2 +- .../window/languagechange_event/index.html | 2 +- .../web/api/window/offline_event/index.html | 2 +- .../web/api/window/unload_event/index.html | 4 +- .../index.html | 4 +- .../web/api/worker/message_event/index.html | 8 +-- .../api/worker/messageerror_event/index.html | 2 +- .../api/xmlhttprequest/error_event/index.html | 2 +- .../api/xmlhttprequest/load_event/index.html | 4 +- .../conflicting/web/css/cursor/index.html | 28 ++++---- files/zh-cn/conflicting/web/css/index.html | 8 +-- .../css/transform-function/skewx/index.html | 2 +- .../web/http/status/404/index.html | 4 +- .../global_objects/error/tostring/index.html | 4 +- .../global_objects/string/index.html | 2 +- .../conflicting/web/web_components/index.html | 6 +- 42 files changed, 176 insertions(+), 176 deletions(-) diff --git a/files/zh-cn/conflicting/learn/javascript/objects/classes_in_javascript/index.html b/files/zh-cn/conflicting/learn/javascript/objects/classes_in_javascript/index.html index 5b6fa5b218101e..6859defdd96823 100644 --- a/files/zh-cn/conflicting/learn/javascript/objects/classes_in_javascript/index.html +++ b/files/zh-cn/conflicting/learn/javascript/objects/classes_in_javascript/index.html @@ -1,5 +1,5 @@ --- -title: 适合初学者的JavaScript面向对象 +title: 适合初学者的 JavaScript 面向对象 slug: conflicting/Learn/JavaScript/Objects/Classes_in_JavaScript translation_of: Learn/JavaScript/Objects/Object-oriented_JS original_slug: Learn/JavaScript/Objects/Object-oriented_JS @@ -8,44 +8,44 @@
{{PreviousMenuNext("Learn/JavaScript/Objects/Basics", "Learn/JavaScript/Objects/Object_prototypes", "Learn/JavaScript/Objects")}}
-

学完基础后, 现在我们集中于面向对象的 JavaScript (OOJS) — 本文首先提出了面向对象编程(OOP) 理论的基本观点,然后探索如何通过构造函数模拟对象类,以及如何创建对象.

+

学完基础后,现在我们集中于面向对象的 JavaScript (OOJS) — 本文首先提出了面向对象编程 (OOP) 理论的基本观点,然后探索如何通过构造函数模拟对象类,以及如何创建对象。

- - + + - - + +
预备知识:计算机基础知识, 了解 HTML 和 CSS, 熟悉 JavaScrpit 基础知识 (查看 First stepsBuilding blocks) 和 OOJS 基础 (查看 Introduction to objects).预备知识:计算机基础知识,了解 HTML 和 CSS, 熟悉 JavaScrpit 基础知识 (查看 First stepsBuilding blocks) 和 OOJS 基础 (查看 Introduction to objects).
目标:掌握面向对象程序的基本理论, 这涉及到 JavaScript  的("万物皆对象"), 以及如何创建构造器和对象.目标:掌握面向对象程序的基本理论,这涉及到 JavaScript  的 ("万物皆对象"), 以及如何创建构造器和对象。

从零开始面向对象的程序设计

-

首先,我们从高维度且简化的角度看看 面向对象的程序(Object-oriented programming ,OOP)是什么。我们将简单描述OOP,因为OOP该概念已变得很复杂,如果完整地描述OOP将使读者难以理解。OOP 的基本思想是:在程序里,我们通过使用对象去构建现实世界的模型,把原本很难(或不可能)被使用的功能,简单化并提供出来,以供访问。

+

首先,我们从高维度且简化的角度看看 面向对象的程序(Object-oriented programming,OOP)是什么。我们将简单描述 OOP,因为 OOP 该概念已变得很复杂,如果完整地描述 OOP 将使读者难以理解。OOP 的基本思想是:在程序里,我们通过使用对象去构建现实世界的模型,把原本很难(或不可能)被使用的功能,简单化并提供出来,以供访问。

对象可以包含相关的数据和代码,这些数据和代码用于表示 你所建造的模型是什么样子,以及拥有什么样的行为或功能。对象包(object package,或者叫命名空间 namespace)存储(官方用语:封装)着对象的数据(常常还包括函数),使数据的组织和访问变得更容易了;对象也常用作 数据存储体(data stores),用于在网络上运输数据,十分便捷。

定义一个对象模板

-

让我们来考虑一个简单的程序,它可以显示一个学校的学生和老师的信息.在这里我们不讨论任何程序语言,我们只讨论 OOP 思想.

+

让我们来考虑一个简单的程序,它可以显示一个学校的学生和老师的信息。在这里我们不讨论任何程序语言,我们只讨论 OOP 思想。

-

首先,我们可以回到上一节拿到定义好属性和方法的Person对象。对于一个人(person)来说,我们能在他们身上获取到很多信息(他们的住址,身高,鞋码,基因图谱,护照信息,显著的性格特征等等),然而,我们仅仅需要他们的名字,年龄,性别,兴趣 这些信息,然后,我们会基于他们的这些信息写一个简短的介绍关于他们自己,在最后我们还需要教会他们打招呼。以上的方式被称为抽象-为了我们编程的目标而利用事物的一些重要特性去把复杂的事物简单化

+

首先,我们可以回到上一节拿到定义好属性和方法的 Person 对象。对于一个人(person)来说,我们能在他们身上获取到很多信息(他们的住址,身高,鞋码,基因图谱,护照信息,显著的性格特征等等),然而,我们仅仅需要他们的名字,年龄,性别,兴趣 这些信息,然后,我们会基于他们的这些信息写一个简短的介绍关于他们自己,在最后我们还需要教会他们打招呼。以上的方式被称为抽象 - 为了我们编程的目标而利用事物的一些重要特性去把复杂的事物简单化

-

在一些面向对象的语言中,我们用类(class)的概念去描述一个对象(您在下面就能看到JavaScript使用了一个完全不同的术语)-类并不完全是一个对象,它更像是一个定义对象特质的模板。

+

在一些面向对象的语言中,我们用类(class)的概念去描述一个对象(您在下面就能看到 JavaScript 使用了一个完全不同的术语)- 类并不完全是一个对象,它更像是一个定义对象特质的模板。

创造一个真正的对象

-

从上面我们创建的class中, 我们能够基于它创建出一些对象 - 一些拥有class中属性及方法的对象。基于我们的Person类,我们可以创建出许许多多的真实的人:

+

从上面我们创建的 class 中,我们能够基于它创建出一些对象 - 一些拥有 class 中属性及方法的对象。基于我们的 Person 类,我们可以创建出许许多多的真实的人:

-

当一个对象需要从类中创建出来时,类的构造函数就会运行来创建这个实例。这种创建对象的过程我们称之为实例化-实例对象被类实例化。

+

当一个对象需要从类中创建出来时,类的构造函数就会运行来创建这个实例。这种创建对象的过程我们称之为实例化 - 实例对象被类实例化。

具体的对象

@@ -65,9 +65,9 @@

具体的对象

构建函数和对象

-

有些人认为 JavaScript 不是真正的面向对象的语言,比如它没有像许多面向对象的语言一样有用于创建class类的声明。JavaScript 用一种称为构建函数的特殊函数来定义对象和它们的特征。构建函数非常有用,因为很多情况下您不知道实际需要多少个对象(实例)。构建函数提供了创建您所需对象(实例)的有效方法,将对象的数据和特征函数按需联结至相应对象。

+

有些人认为 JavaScript 不是真正的面向对象的语言,比如它没有像许多面向对象的语言一样有用于创建 class 类的声明。JavaScript 用一种称为构建函数的特殊函数来定义对象和它们的特征。构建函数非常有用,因为很多情况下您不知道实际需要多少个对象(实例)。构建函数提供了创建您所需对象(实例)的有效方法,将对象的数据和特征函数按需联结至相应对象。

-

不像“经典”的面向对象的语言,从构建函数创建的新实例的特征并非全盘复制,而是通过一个叫做原形链的参考链链接过去的。(参见 Object prototypes),所以这并非真正的实例,严格的讲, JavaScript 在对象间使用和其它语言的共享机制不同。

+

不像“经典”的面向对象的语言,从构建函数创建的新实例的特征并非全盘复制,而是通过一个叫做原形链的参考链链接过去的。(参见 Object prototypes),所以这并非真正的实例,严格的讲,JavaScript 在对象间使用和其它语言的共享机制不同。

注: “经典”的面向对象的语言并非好事,就像上面提到的,OOP 可能很快就变得非常复杂,JavaScript 找到了在不变的特别复杂的情况下利用面向对象的优点的方法。

@@ -78,7 +78,7 @@

构建函数和对象

一个简单的例子

    -
  1. 让我们看看如何通过一个普通的函数定义一个”人“。在您的文件中添加以下代码: +
  2. 让我们看看如何通过一个普通的函数定义一个”人“。在您的文件中添加以下代码:
    function createNewPerson(name) {
       var obj = {};
       obj.name = name;
    @@ -88,7 +88,7 @@ 

    一个简单的例子

    return obj; }
  3. -
  4. 您现在可以通过调用这个函数创建一个新的叫 salva 的人,在您浏览器的JavaScript console 试试 : +
  5. 您现在可以通过调用这个函数创建一个新的叫 salva 的人,在您浏览器的 JavaScript console 试试:
    var salva = createNewPerson('salva');
     salva.name;
     salva.greeting();
    @@ -141,7 +141,7 @@

    一个简单的例子

    } -

    当新的对象被创立, 变量person1person2有效地包含了以下值:

    +

    当新的对象被创立,变量person1person2有效地包含了以下值:

    {
       name : 'Bob',
    @@ -181,7 +181,7 @@ 

    创建我们最终的构造函数

  6. -
  7. 接下来加上这样一行代码, 用来创建它的一个对象: +
  8. 接下来加上这样一行代码,用来创建它的一个对象:
    var person1 = new Person('Bob', 'Smith', 32, 'male', ['music', 'skiing']);
@@ -199,36 +199,36 @@

创建我们最终的构造函数

进一步的练习 -

首先, 尝试着写几行代码创建您自己的对象, 接着,尝试getting与setting对象中的成员。

+

首先, 尝试着写几行代码创建您自己的对象, 接着,尝试 getting 与 setting 对象中的成员。

-

此外, 我们的bio()方法里仍有一些问题 —— 尽管您创建的Person是女性,或者是些别的性别类型,输出里的代词都总是 "He"。 而且, 纵然您有更多的兴趣列举在interests数组中, bio只会展示您的两个兴趣。 您能想出如何在类型定义(构造函数)中解决这个问题吗? 您可以按照您喜欢的方式编写构造函数(您可能需要一些条件判断和循环)。 考虑下语句如何根据性别、兴趣列表中兴趣的数目异构。

+

此外, 我们的bio()方法里仍有一些问题 —— 尽管您创建的 Person 是女性,或者是些别的性别类型,输出里的代词都总是 "He"。 而且,纵然您有更多的兴趣列举在interests数组中,bio 只会展示您的两个兴趣。 您能想出如何在类型定义(构造函数)中解决这个问题吗?您可以按照您喜欢的方式编写构造函数(您可能需要一些条件判断和循环)。 考虑下语句如何根据性别、兴趣列表中兴趣的数目异构。

-

注:如果您觉得困难, 我们在我们的GitHub仓库里作了回答(查看它的实现) ——但首先请您尝试着自己写出来。

+

注:如果您觉得困难, 我们在我们的GitHub 仓库里作了回答 (查看它的实现) ——但首先请您尝试着自己写出来。

创建对象的其他方式

-

到现在为止,我们了解到了两种不同的创建对象的方式 —— 声明一个对象的语法, 与使用构造函数(回顾上面)。

+

到现在为止,我们了解到了两种不同的创建对象的方式 —— 声明一个对象的语法,与使用构造函数 (回顾上面)。

-

这些方法都是很有用的, 但仍有其他的方法 —— 我们希望您能熟悉这些,以免您在Web世界的旅行中碰到它们。

+

这些方法都是很有用的, 但仍有其他的方法 —— 我们希望您能熟悉这些,以免您在 Web 世界的旅行中碰到它们。

-

Object()构造函数

+

Object() 构造函数

-

首先, 您能使用Object()构造函数来创建一个新对象。 是的, 一般对象都有构造函数,它创建了一个空的对象。

+

首先, 您能使用Object()构造函数来创建一个新对象。是的,一般对象都有构造函数,它创建了一个空的对象。

    -
  1. 尝试在您浏览器中的Javascript控制台中输入以下代码: +
  2. 尝试在您浏览器中的 Javascript 控制台中输入以下代码:
    var person1 = new Object();
  3. -
  4. 这样就在person1变量中存储了一个空对象。然后, 可以根据需要, 使用点或括号表示法向此对象添加属性和方法;试试这个例子: +
  5. 这样就在person1变量中存储了一个空对象。然后,可以根据需要,使用点或括号表示法向此对象添加属性和方法;试试这个例子:
    person1.name = 'Chris';
     person1['age'] = 38;
     person1.greeting = function() {
       alert('Hi! I\'m ' + this.name + '.');
     }
  6. -
  7. 还可以将对象文本传递给Object() 构造函数作为参数, 以便用属性/方法填充它。请尝试以下操作: +
  8. 还可以将对象文本传递给 Object() 构造函数作为参数, 以便用属性/方法填充它。请尝试以下操作:
    var person1 = new Object({
       name : 'Chris',
       age : 38,
    @@ -239,9 +239,9 @@ 

    Object()构造函数

-

使用create()方法

+

使用 create() 方法

-

JavaScript有个内嵌的方法create(), 它允许您基于现有对象创建新的对象。

+

JavaScript 有个内嵌的方法create(), 它允许您基于现有对象创建新的对象。

  1. 在 JavaScript 控制台中尝试此操作: @@ -253,16 +253,16 @@

    使用create()方法

-

您可以看到,person2是基于person1创建的, 它们具有相同的属性和方法。这非常有用, 因为它允许您创建新的对象而无需定义构造函数。缺点是比起构造函数,浏览器在更晚的时候才支持create()方法(IE9,  IE8 或甚至以前相比), 加上一些人认为构造函数让您的代码看上去更整洁 —— 您可以在一个地方创建您的构造函数, 然后根据需要创建实例, 这让您能很清楚地知道它们来自哪里。

+

您可以看到,person2是基于person1创建的,它们具有相同的属性和方法。这非常有用, 因为它允许您创建新的对象而无需定义构造函数。缺点是比起构造函数,浏览器在更晚的时候才支持 create() 方法(IE9,  IE8 或甚至以前相比), 加上一些人认为构造函数让您的代码看上去更整洁 —— 您可以在一个地方创建您的构造函数, 然后根据需要创建实例,这让您能很清楚地知道它们来自哪里。

-

但是, 如果您不太担心对旧浏览器的支持, 并且您只需要一个对象的一些副本, 那么创建一个构造函数可能会让您的代码显得过度繁杂。这取决于您的个人爱好。有些人发现create() 更容易理解和使用。

+

但是,如果您不太担心对旧浏览器的支持, 并且您只需要一个对象的一些副本, 那么创建一个构造函数可能会让您的代码显得过度繁杂。这取决于您的个人爱好。有些人发现 create() 更容易理解和使用。

-

稍后我们将更详细地探讨create() 的效果。

+

稍后我们将更详细地探讨 create() 的效果。

总结

-

这篇文章简单地介绍了一些面向对象原理 —— 这些描述还不够完整, 但它让您知道我们在这里处理什么。此外, 我们已经开始研究 javascript与 "经典 OOP"的关联与区别, 如何使用构造函数实现 javascript 中的类, 以及生成对象的不同方法。

+

这篇文章简单地介绍了一些面向对象原理 —— 这些描述还不够完整, 但它让您知道我们在这里处理什么。此外, 我们已经开始研究 javascript 与 "经典 OOP"的关联与区别, 如何使用构造函数实现 javascript 中的类, 以及生成对象的不同方法。

-

在下一篇文章中, 我们将探讨 JavaScript 对象原型。

+

在下一篇文章中,我们将探讨 JavaScript 对象原型。

{{PreviousMenuNext("Learn/JavaScript/Objects/Basics", "Learn/JavaScript/Objects/Object_prototypes", "Learn/JavaScript/Objects")}}

diff --git a/files/zh-cn/conflicting/web/api/audionode/index.html b/files/zh-cn/conflicting/web/api/audionode/index.html index fb6b1b2b4d1c05..6d77042753d036 100644 --- a/files/zh-cn/conflicting/web/api/audionode/index.html +++ b/files/zh-cn/conflicting/web/api/audionode/index.html @@ -6,7 +6,7 @@ ---

{{APIRef("'Web Audio API'")}}

-

Web Audio API 的 AudioNodeOptions 字典指定了创建新 {{domxref("AudioNode")}} 对象时可使用的选项.

+

Web Audio API 的 AudioNodeOptions 字典指定了创建新 {{domxref("AudioNode")}} 对象时可使用的选项。

AudioNodeOptions 继承自不同类型的音频节点构造函数的选项对象. 例如 {{domxref("AnalyserNode.AnalyserNode")}} 或 {{domxref("GainNode.GainNode")}}.

diff --git a/files/zh-cn/conflicting/web/api/blob/size/index.html b/files/zh-cn/conflicting/web/api/blob/size/index.html index 1975c7c0b29e2e..64ca082afb6472 100644 --- a/files/zh-cn/conflicting/web/api/blob/size/index.html +++ b/files/zh-cn/conflicting/web/api/blob/size/index.html @@ -12,6 +12,6 @@

概述

-

返回文件的大小,单位为字节.

+

返回文件的大小,单位为字节。

-
该属性已经废弃,请使用{{domxref("File.size")}}来代替.
+
该属性已经废弃,请使用{{domxref("File.size")}}来代替。
diff --git a/files/zh-cn/conflicting/web/api/caches/index.html b/files/zh-cn/conflicting/web/api/caches/index.html index 0da1e450bc8668..6c875df47aea68 100644 --- a/files/zh-cn/conflicting/web/api/caches/index.html +++ b/files/zh-cn/conflicting/web/api/caches/index.html @@ -6,7 +6,7 @@ ---

{{APIRef("Service Workers API")}}

-

caches 是一个 {{domxref("ServiceWorkerGlobalScope")}} 接口的只读属性,返回与当前service worker相关联的{{domxref("CacheStorage")}}对象。

+

caches 是一个 {{domxref("ServiceWorkerGlobalScope")}} 接口的只读属性,返回与当前 service worker 相关联的{{domxref("CacheStorage")}}对象。

语法

diff --git a/files/zh-cn/conflicting/web/api/canvasrenderingcontext2d/index.html b/files/zh-cn/conflicting/web/api/canvasrenderingcontext2d/index.html index 5d70ed7ec93302..2f71fa58e2de2d 100644 --- a/files/zh-cn/conflicting/web/api/canvasrenderingcontext2d/index.html +++ b/files/zh-cn/conflicting/web/api/canvasrenderingcontext2d/index.html @@ -6,7 +6,7 @@ ---
{{APIRef()}} {{SeeCompatTable}}
-

CanvasRenderingContext2D.currentTransform 属性,表示当前变换的矩阵。可以通过Canvas2D API 返回或者赋值为{{domxref("SVGMatrix")}}对象。

+

CanvasRenderingContext2D.currentTransform 属性,表示当前变换的矩阵。可以通过 Canvas2D API 返回或者赋值为{{domxref("SVGMatrix")}}对象。

语法

@@ -22,7 +22,7 @@

示例

使用currentTransform 的方式

-

这是一段简单的代码片段,使用currentTransform属性设置变换矩阵。

+

这是一段简单的代码片段,使用currentTransform 属性设置变换矩阵。

HTML

@@ -45,7 +45,7 @@

JavaScript

ctx.fillRect(0,0,100,100); -

修改下面的代码并在线查看canvas的变化(确定使用支持这段代码特征的浏览器,可以查看兼容性列表):

+

修改下面的代码并在线查看 canvas 的变化(确定使用支持这段代码特征的浏览器,可以查看兼容性列表):