Skip to content

Commit 52975b9

Browse files
committed
i18n
1 parent 51b5823 commit 52975b9

File tree

40 files changed

+260
-186
lines changed

40 files changed

+260
-186
lines changed

questions/describe-event-bubbling/en-US.langnostic.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222
"a517a702",
2323
"9e538dcd",
2424
"3818abba",
25-
"47a90b06",
25+
"cd29d4cf",
2626
"10d6cb7a",
2727
"1f177e65",
2828
"d7a0aa2",
@@ -66,7 +66,7 @@
6666
"a517a702",
6767
"9e538dcd",
6868
"3818abba",
69-
"47a90b06",
69+
"cd29d4cf",
7070
"10d6cb7a",
7171
"1f177e65",
7272
"d7a0aa2",

questions/describe-event-bubbling/zh-CN.mdx

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ title: 描述 JavaScript 和浏览器的事件冒泡
88

99
事件冒泡对于事件委托至关重要,其中单个事件处理程序管理多个子元素的事件,从而提高性能和代码简洁性。虽然方便,但未能正确管理事件传播可能导致意外行为,例如多个处理程序为单个事件触发。
1010

11-
---
11+
***
1212

1313
## 什么是事件冒泡?
1414

@@ -85,7 +85,7 @@ child.click();
8585

8686
## 事件委托
8787

88-
事件冒泡是称为 [事件委托](/questions/quiz/describe-event-delegation) 的技术的基础,您将单个事件处理程序附加到多个元素的公共祖先,并使用事件委托来有效地处理这些元素的事件。当您有大量相似的元素(如项目列表)并且希望避免将单独的事件处理程序附加到每个项目时,这特别有用。
88+
事件冒泡是[事件委托](/questions/quiz/explain-event-delegation)技术的基础,您可以在多个元素的公共祖先上附加单个事件处理程序,并使用事件委托来有效地处理这些元素的事件。当您有大量相似的元素(如项目列表)并且希望避免将单独的事件处理程序附加到每个项目时,这特别有用。
8989

9090
```js
9191
parent.addEventListener('click', (event) => {
@@ -97,15 +97,15 @@ parent.addEventListener('click', (event) => {
9797

9898
## 优点
9999

100-
- **更简洁的代码:** 减少事件监听器的数量,提高代码可读性和可维护性。
101-
- **高效的事件处理:** 通过附加更少的监听器,最大限度地减少性能开销。
102-
- **灵活性:** 允许处理子元素上发生的事件,而无需直接将监听器附加到它们。
100+
* **更简洁的代码:** 减少事件监听器的数量,提高代码可读性和可维护性。
101+
* **高效的事件处理:** 通过附加更少的监听器,最大限度地减少性能开销。
102+
* **灵活性:** 允许处理子元素上发生的事件,而无需直接将监听器附加到它们。
103103

104104
## 陷阱
105105

106-
- **意外的事件处理:** 请注意,父元素可能会无意中捕获子元素发生的事件。使用 `event.target` 来识别触发事件的特定元素。
107-
- **事件顺序:** 事件以特定顺序冒泡。如果多个父元素有事件监听器,它们的执行顺序取决于 DOM 层次结构。
108-
- **过度委托:** 虽然将事件委托给公共祖先是有效的,但在 DOM 树中附加一个过高的监听器可能会捕获意外的事件。
106+
* **意外的事件处理:** 请注意,父元素可能会无意中捕获子元素发生的事件。使用 `event.target` 来识别触发事件的特定元素。
107+
* **事件顺序:** 事件以特定顺序冒泡。如果多个父元素有事件监听器,它们的执行顺序取决于 DOM 层次结构。
108+
* **过度委托:** 虽然将事件委托给公共祖先是有效的,但在 DOM 树中附加一个过高的监听器可能会捕获意外的事件。
109109

110110
## 用例
111111

@@ -217,6 +217,6 @@ function handleAccordionClick(event) {
217217

218218
## 延伸阅读
219219

220-
- [MDN Web Docs on Event Bubbling](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events#event_bubbling)
221-
- [JavaScript.info - Bubbling and Capturing](https://javascript.info/bubbling-and-capturing)
222-
- [W3C DOM Level 3 Events Specification](https://www.w3.org/TR/DOM-Level-3-Events/#event-flow)
220+
* [MDN Web Docs on Event Bubbling](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events#event_bubbling)
221+
* [JavaScript.info - Bubbling and Capturing](https://javascript.info/bubbling-and-capturing)
222+
* [W3C DOM Level 3 Events Specification](https://www.w3.org/TR/DOM-Level-3-Events/#event-flow)

questions/explain-event-delegation/en-US.langnostic.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@
3030
"d97425a1",
3131
"b5905a85",
3232
"4688282c",
33-
"1c737627",
33+
"5afea3bd",
3434
"68b07c90",
3535
"cd5dd65b",
3636
"b8ab38ac",
@@ -39,7 +39,7 @@
3939
"2670c799",
4040
"c7a88171",
4141
"1f4770e5",
42-
"fb9ea696"
42+
"b4e3453b"
4343
]
4444
},
4545
"targets": {
@@ -68,7 +68,7 @@
6868
"d97425a1",
6969
"b5905a85",
7070
"4688282c",
71-
"1c737627",
71+
"5afea3bd",
7272
"68b07c90",
7373
"cd5dd65b",
7474
"b8ab38ac",
@@ -77,7 +77,7 @@
7777
"2670c799",
7878
"c7a88171",
7979
"1f4770e5",
80-
"fb9ea696"
80+
"b4e3453b"
8181
]
8282
}
8383
}

questions/explain-event-delegation/zh-CN.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -108,7 +108,7 @@ userForm.addEventListener('input', (event) => {
108108
});
109109
```
110110

111-
在此示例中,单个 input 事件侦听器附加到表单元素。 它可以响应所有子输入元素的输入更改,从而简化代码,每个 `<input>` 元素使用一个事件侦听器
111+
在这个例子中,单个输入事件监听器附加到表单元素。它可以响应所有子输入元素的输入更改,通过消除对每个`<input>`元素上单独监听器的需求来简化代码
112112

113113
## 陷阱
114114

questions/explain-hoisting/en-US.langnostic.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,7 @@
4848
"b9a03b4e",
4949
"c314f8b",
5050
"1f4770e5",
51-
"276e19b3"
51+
"8d801c81"
5252
]
5353
},
5454
"targets": {
@@ -95,7 +95,7 @@
9595
"b9a03b4e",
9696
"c314f8b",
9797
"1f4770e5",
98-
"276e19b3"
98+
"8d801c81"
9999
]
100100
}
101101
}

questions/explain-hoisting/zh-CN.mdx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -139,5 +139,5 @@ ESLint 是一个静态代码分析器,可以发现违反此类情况,使用
139139

140140
## 延伸阅读
141141

142-
* [Hoisting | MDN](https://developer.mozilla.org/zh-CN/docs/Glossary/Hoisting)
143-
* [JavaScript Visualized: Hoisting](https://dev.to/lydiahallie/javascript-visualized-hoisting-478h)
142+
* [Hoisting | MDN](https://developer.mozilla.org/en-US/docs/Glossary/Hoisting)
143+
* [What is Hoisting in JavaScript?](https://www.freecodecamp.org/news/what-is-hoisting-in-javascript)

questions/explain-how-prototypal-inheritance-works/en-US.langnostic.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,8 @@
2121
"be2d34c4",
2222
"b52ddf94",
2323
"1dc60677",
24-
"11a400e1",
25-
"3d40f5c3",
24+
"6b3b6f34",
25+
"92a0271d",
2626
"3b5a819f",
2727
"dae7e089",
2828
"2b6d6fd1"
@@ -45,8 +45,8 @@
4545
"be2d34c4",
4646
"b52ddf94",
4747
"1dc60677",
48-
"11a400e1",
49-
"3d40f5c3",
48+
"6b3b6f34",
49+
"92a0271d",
5050
"3b5a819f",
5151
"dae7e089",
5252
"2b6d6fd1"

questions/explain-how-prototypal-inheritance-works/zh-CN.mdx

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -47,8 +47,8 @@ bolt.bark(); // "Woof!"
4747

4848
需要注意的是:
4949

50-
* `.makeSound` 未在 `Dog` 上定义,因此 JavaScript 引擎会向上查找原型链,并在继承的 `Animal` 上找到 `.makeSound`
51-
* 不再推荐使用 `Object.create()` 来构建继承链。请改用 `Object.setPrototypeOf()`
50+
* `.makeSound` 未在 `Dog` 上定义,因此 JavaScript 引擎会向上查找原型链,并在继承的 `Animal` 上找到 `.makeSound`
51+
* 不再推荐使用 `Object.create()` 来构建继承链。请改用 `Object.setPrototypeOf()`
5252

5353
***
5454

@@ -105,42 +105,42 @@ console.log(john.sayHello); // undefined
105105
3. **构造函数**:JavaScript 提供了构造函数来创建对象。当一个函数与 new 关键字一起用作构造函数时,新对象的原型 (`[[Prototype]]`) 将设置为构造函数 的原型属性。
106106

107107
```js live
108-
// Define a constructor function
108+
// 定义一个构造函数
109109
function Animal(name) {
110110
this.name = name;
111111
}
112112

113-
// Add a method to the prototype
113+
// 将一个方法添加到原型上
114114
Animal.prototype.sayName = function () {
115-
console.log(`My name is ${this.name}`);
115+
console.log(`我的名字是 ${this.name}`);
116116
};
117117

118-
// Define a new constructor function
118+
// 定义一个新的构造函数
119119
function Dog(name, breed) {
120120
Animal.call(this, name);
121121
this.breed = breed;
122122
}
123123

124-
// Set the prototype of Dog to be a new instance of Animal
125-
Dog.prototype = Object.create(Animal.prototype);
124+
// 设置 Dog 的原型以继承自 Animal 的原型
125+
Object.setPrototypeOf(Dog.prototype, Animal.prototype);
126126

127-
// Add a method to the Dog prototype
127+
// 将一个方法添加到 Dog 的原型上
128128
Dog.prototype.bark = function () {
129-
console.log('Woof!');
129+
console.log('汪!');
130130
};
131131

132-
// Create a new object using the Dog constructor function
132+
// 使用 Dog 构造函数创建一个新对象
133133
let fido = new Dog('Fido', 'Labrador');
134134

135-
// The new object has access to the methods defined on its own prototype and the Animal prototype
136-
fido.bark(); // "Woof!"
137-
fido.sayName(); // "My name is Fido"
135+
// 新对象可以访问在其自身原型和 Animal 原型上定义的方法
136+
fido.bark(); // "汪!"
137+
fido.sayName(); // "我的名字是 Fido"
138138

139-
// If we try to access a method that doesn't exist on the Dog prototype or the Animal prototype, JavaScript will return undefined
139+
// 如果我们尝试访问 Dog 原型或 Animal 原型上不存在的方法,JavaScript 将返回 undefined
140140
console.log(fido.fly); // undefined
141141
```
142142

143-
4. **`Object.create()`**:此方法使用指定原型对象和属性创建一个新对象。这是设置原型继承的一种直接方法。如果您通过 `Object.create(null)` 创建一个对象,它将不会从 `Object.prototype` 继承任何属性。这意味着该对象将没有任何内置属性或方法,例如 `toString()``hasOwnProperty()`
143+
4. **`Object.create()`**: 此方法创建一个新对象,其内部 `[[Prototype]]` 直接链接到指定的原型对象。这是创建从另一个特定对象继承的对象的最直接方法,无需涉及构造函数。如果通过 `Object.create(null)` 创建一个对象,它将不会从 `Object.prototype` 继承任何属性。这意味着该对象将没有任何内置属性或方法, `toString()``hasOwnProperty()`,
144144

145145
```js live
146146
// Define a prototype object

questions/explain-the-concept-of-a-callback-function-in-asynchronous-operations/en-US.langnostic.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
"5de61f04",
2525
"cac9a1fb",
2626
"1f4770e5",
27-
"c2276b55"
27+
"8e223077"
2828
]
2929
},
3030
"targets": {
@@ -47,7 +47,7 @@
4747
"5de61f04",
4848
"cac9a1fb",
4949
"1f4770e5",
50-
"c2276b55"
50+
"8e223077"
5151
]
5252
}
5353
}

questions/explain-the-concept-of-a-callback-function-in-asynchronous-operations/zh-CN.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -96,4 +96,4 @@ fetchData((error, data) => {
9696

9797
* [MDN Web Docs: Callback function](https://developer.mozilla.org/en-US/docs/Glossary/Callback_function)
9898
* [JavaScript.info: Callbacks](https://javascript.info/callbacks)
99-
* [Node.js: Asynchronous programming and callbacks](https://nodejs.org/en/knowledge/getting-started/control-flow/what-are-callbacks/)
99+
* [Node.js: Asynchronous programming and callbacks](https://nodejs.org/en/learn/asynchronous-work/javascript-asynchronous-programming-and-callbacks)

0 commit comments

Comments
 (0)