New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
对象的键、值、项 #140
对象的键、值、项 #140
Changes from 3 commits
8f9a16a
488b0d9
0ce243a
0466aef
40528d6
8b894f4
481db13
bf92447
8579ca6
58f1bcf
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -2,15 +2,15 @@ importance: 5 | |
|
||
--- | ||
|
||
# Sum the properties | ||
# 属性求和 Sum the properties | ||
|
||
There is a `salaries` object with arbitrary number of salaries. | ||
有一个 `salaries` 对象,包含了薪水的值。 | ||
|
||
Write the function `sumSalaries(salaries)` that returns the sum of all salaries using `Object.values` and the `for..of` loop. | ||
写一个 `sumSalaries(salaries)` 函数,使用 `Object.values` 和 `for..of` 循环语句返回所有薪水的和。 | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『写一个 |
||
|
||
If `salaries` is empty, then the result must be `0`. | ||
如果 `salaries` 是空对象,那么结果必须是 `0`。 | ||
|
||
For instance: | ||
举个例子: | ||
|
||
```js | ||
let salaries = { | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -2,9 +2,9 @@ importance: 5 | |
|
||
--- | ||
|
||
# Count properties | ||
# 计算属性数量 | ||
|
||
Write a function `count(obj)` that returns the number of properties in the object: | ||
写一个 `count(obj)` 函数返回一个对象的属性数量: | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『写一个 |
||
|
||
```js | ||
let user = { | ||
|
@@ -15,7 +15,7 @@ let user = { | |
alert( count(user) ); // 2 | ||
``` | ||
|
||
Try to make the code as short as possible. | ||
试着让代码尽可能简短。 | ||
|
||
P.S. Ignore symbolic properties, count only "regular" ones. | ||
提示:忽略 Symbol 属性,只计算「常规」属性。 | ||
|
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,42 +1,42 @@ | ||
|
||
# Object.keys, values, entries | ||
# 对象的键、值、项 | ||
|
||
Let's step away from the individual data structures and talk about the iterations over them. | ||
单个数据结构告一段落,下面我们让讨论如何迭代它们。 | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『单个数据结构告一段落,下面我们让讨论如何迭代它们。』 => 『让我们结束对单个数据结构的讨论然后谈谈对它们的迭代。』 |
||
|
||
In the previous chapter we saw methods `map.keys()`, `map.values()`, `map.entries()`. | ||
在前面的章节中,我们认识了 `map.keys()`,`map.value()`,`map.entries()`。 | ||
|
||
These methods are generic, there is a common agreement to use them for data structures. If we ever create a data structure of our own, we should implement them too. | ||
这些方法是广义的,对于数据结构,我们约定俗成使用它们。如果我们曾经自己创建过数据结构,我们也应该实现过它们。 | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『这些方法是广义的,对于数据结构,我们约定俗成使用它们。如果我们曾经自己创建过数据结构,我们也应该实现过它们。』 => 『这些方法是通用的,有一个共同的约定来将它们用于各种数据结构。如果我们创建一个我们自己的数据结构,我们也应该实现这些方法。』 |
||
|
||
They are supported for: | ||
它们支持: | ||
|
||
- `Map` | ||
- `Set` | ||
- `Array` (except `arr.values()`) | ||
- `Array` (除了 `arr.values()`) | ||
|
||
Plain objects also support similar methods, but the syntax is a bit different. | ||
纯对象也支持这些方法,但是语法上有一些不同 | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『纯对象也支持这些方法,但是语法上有一些不同』 => 『纯对象也支持类似的方法,但是语法有一些不同。』 |
||
|
||
## Object.keys, values, entries | ||
## Object.keys、values、entries 三个方法 | ||
|
||
For plain objects, the following methods are available: | ||
对于纯对象,下列方法是可用的: | ||
|
||
- [Object.keys(obj)](mdn:js/Object/keys) -- returns an array of keys. | ||
- [Object.values(obj)](mdn:js/Object/values) -- returns an array of values. | ||
- [Object.entries(obj)](mdn:js/Object/entries) -- returns an array of `[key, value]` pairs. | ||
- [Object.keys(obj)](mdn:js/Object/keys) —— 返回包含所有键的数组。 | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『返回包含所有键的数组。』 => 『返回一个包含该对象全部的键的数组。』 “返回包含所有键的数组”这句话中的“所有”一词容易引发歧义。一个解释是“归XXX所拥有”,一个解释是“全部的”。 |
||
- [Object.values(obj)](mdn:js/Object/values) —— 返回包含所有值的数组。 | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『返回包含所有值的数组。』 => 『返回一个包含该对象全部的值的数组。』 |
||
- [Object.entries(obj)](mdn:js/Object/entries) —— 返回包含所有 `[key, value]` 键值对的数组。 | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『返回包含所有 |
||
|
||
...But please note the distinctions (compared to map for example): | ||
... 但是请注意区别(比如说跟 map 的区别): | ||
|
||
| | Map | Object | | ||
|-------------|------------------|--------------| | ||
| Call syntax | `map.keys()` | `Object.keys(obj)`, but not `obj.keys()` | | ||
| Returns | iterable | "real" Array | | ||
| 调用语法 | `map.keys()` | `Object.keys(obj)`,而不是 `obj.keys()` | | ||
| 返回值 | 可迭代项 |「真正的」数组 | ||
|
||
The first difference is that we have to call `Object.keys(obj)`, and not `obj.keys()`. | ||
第一个区别是在对象中我们的调用语法是 `Object.key(obj)`,而不是 `obj.key()`。 | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『 |
||
|
||
Why so? The main reason is flexibility. Remember, objects are a base of all complex structures in JavaScript. So we may have an object of our own like `order` that implements its own `order.values()` method. And we still can call `Object.values(order)` on it. | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『因此我们可能自己创建一个对象,比如 There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『那么,我们依然可以对它调用 “ So..... And.....” 这里原文有点口语化,而且语法不规范。“So”在这里其实并不是接上句,而是有点像要开始说下一句的语气词。“And”这里可以翻译成“同时”,与上一句呼应,从而准确表达作者真正想要阐述的重点:Object.values(order)这种syntax,保证了它可用于所有对象,包括使用者自己创建的对象。 |
||
为什么会这样?主要原因是弹性化。请记住,在 JavaScript 中对象是所有复杂数据结构的基础。因此我们可能自己创建一个对象,比如 `order`,然后实现它自己的方法 `order.values()`。那么,我们依然可以对它调用 `Object.values(order)` 方法。 | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『主要原因是弹性化。』 => 『主要原因是为了保持灵活性。』 |
||
|
||
The second difference is that `Object.*` methods return "real" array objects, not just an iterable. That's mainly for historical reasons. | ||
第二个区别是 `Object.*` 方法返回的是「真正的」数组对象,而不是可迭代项。这主要是历史原因。 | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『第二个区别是 |
||
|
||
For instance: | ||
举个例子: | ||
|
||
```js | ||
let user = { | ||
|
@@ -49,22 +49,22 @@ let user = { | |
- `Object.values(user) = ["John", 30]` | ||
- `Object.entries(user) = [ ["name","John"], ["age",30] ]` | ||
|
||
Here's an example of using `Object.values` to loop over property values: | ||
下面这个例子中,使用了 `Object.values` 在属性值上做循环操作: | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『下面这个例子中,使用了 |
||
|
||
```js run | ||
let user = { | ||
name: "John", | ||
age: 30 | ||
}; | ||
|
||
// loop over values | ||
// 循环所有的值 | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『循环』 => 『遍历』 |
||
for (let value of Object.values(user)) { | ||
alert(value); // John, then 30 | ||
} | ||
``` | ||
|
||
## Object.keys/values/entries ignore symbolic properties | ||
## Object.keys/values/entries 忽略 Symbol 类型的属性 | ||
|
||
Just like a `for..in` loop, these methods ignore properties that use `Symbol(...)` as keys. | ||
就像 `for..in` 循环,这些方法会忽略使用 `Symbol(...)` 作为键的属性。 | ||
|
||
Usually that's convenient. But if we want symbolic keys too, then there's a separate method [Object.getOwnPropertySymbols](mdn:js/Object/getOwnPropertySymbols) that returns an array of only symbolic keys. Also, the method [Reflect.ownKeys(obj)](mdn:js/Reflect/ownKeys) returns *all* keys. | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『它会返回一个只包含 Symbol 类型的键的数组。』 |
||
通常这很方便。但是如果我们也想要获得 Symbol 类型的键,那么有另外不同的方法 [Object.getOwnPropertySymbols](mdn:js/Object/getOwnPropertySymbols) 它会返回一个只包含 Symbol 类型的键的数组。同样,[Reflect.ownKeys(obj)](mdn:js/Reflect/ownKeys) 返回「所有」键。 | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 『同样,Reflect.ownKeys(obj) 返回「所有」键。』 => 『此外,Reflect.ownKeys(obj) 方法会返回「所有的」键。』 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
『有一个
salaries
对象,包含了薪水的值。』 => 『有一个salaries
对象,包含了任意数量的薪水。』