From 7559e69782255bba3bf99b0b58416d5b775e6de9 Mon Sep 17 00:00:00 2001 From: L9m Date: Thu, 19 Apr 2018 11:41:37 +0800 Subject: [PATCH 01/32] article draft 1 1-js/04-object-basics/04-object-methods article.md draft 1 --- .../04-object-methods/article.md | 161 +++++++++--------- 1 file changed, 80 insertions(+), 81 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/article.md b/1-js/04-object-basics/04-object-methods/article.md index 4ce5e7c237..cb168e5b94 100644 --- a/1-js/04-object-basics/04-object-methods/article.md +++ b/1-js/04-object-basics/04-object-methods/article.md @@ -1,6 +1,6 @@ -# Object methods, "this" +# 对象方法与“this” -Objects are usually created to represent entities of the real world, like users, orders and so on: +对象通常被用来表示真实世界中的实体,比如用户、订单等等: ```js let user = { @@ -9,13 +9,13 @@ let user = { }; ``` -And, in the real world, a user can *act*: select something from the shopping cart, login, logout etc. +另外,在现实世界中,用户可以**操作**:从购物车中挑选某物、登录、注销等。 -Actions are represented in JavaScript by functions in properties. +在 JavaScript 中,操作通过属性中的函数来表示。 -## Method examples +## 方法示例 -For the start, let's teach the `user` to say hello: +刚开始,我们来让 `user` 说 hello: ```js run let user = { @@ -32,15 +32,15 @@ user.sayHi = function() { user.sayHi(); // Hello! ``` -Here we've just used a Function Expression to create the function and assign it to the property `user.sayHi` of the object. +这里我们使用函数表达式创建了函数,并将其指定给对象的 `user.sayHi` 属性。 -Then we can call it. The user can now speak! +随后我们调用它。用户现在可以说话了! -A function that is the property of an object is called its *method*. +作为对象属性的函数称之为**方法**。 -So, here we've got a method `sayHi` of the object `user`. +那么,现在 `user` 对象有了一个 `sayHi` 方法。 -Of course, we could use a pre-declared function as a method, like this: +当然我们也可以使用预先定义的函数作为方法,就像这样: ```js run let user = { @@ -61,13 +61,13 @@ user.sayHi(); // Hello! ``` ```smart header="Object-oriented programming" -When we write our code using objects to represent entities, that's called an [object-oriented programming](https://en.wikipedia.org/wiki/Object-oriented_programming), in short: "OOP". +当我们在代码中用对象表示实体时,这就是所谓的[面向对象编程](https://en.wikipedia.org/wiki/Object-oriented_programming),简称为“OOP”。 -OOP is a big thing, an interesting science of its own. How to choose the right entities? How to organize the interaction between them? That's architecture, and there are great books on that topic, like "Design Patterns: Elements of Reusable Object-Oriented Software" by E.Gamma, R.Helm, R.Johnson, J.Vissides or "Object-Oriented Analysis and Design with Applications" by G.Booch, and more. We'll scratch the surface of that topic later in the chapter . +OOP 是一门很大的学问,也是一门有其本身乐趣的学问。怎样选择合适的实体?如何组织它们之间的交互?这就是架构,有很多关于此方面的书,例如 E.Gamma、R.Helm、R.Johnson 和 J.Vissides 所著的《设计模式:可复用面向对象软件的基础》、 G.Booch 所著的《面向对象分析与设计》 等等。在后面的 一章中,我们将会触及这个主题的浅层内容。 ``` -### Method shorthand +### 方法简写 -There exists a shorter syntax for methods in an object literal: +在对象字面量中,有一种更短的(声明)方法的语法: ```js // these objects do the same @@ -88,21 +88,21 @@ let user = { }; ``` -As demonstrated, we can omit `"function"` and just write `sayHi()`. +如所示,我们可以省略 `function` 只写了 `sayHi()`。 -To tell the truth, the notations are not fully identical. There are subtle differences related to object inheritance (to be covered later), but for now they do not matter. In almost all cases the shorter syntax is preferred. +说实话,这种表示法还是有些不同。与对象集成有关的细微差别(稍后将会介绍),但现在它们无关紧要。在几乎所有的情况下,较短的语法是最好的。 -## "this" in methods +## 方法中的 “this” -It's common that an object method needs to access the information stored in the object to do its job. +对象方法需要访问对象中的存储的信息完成其工作是很常见的。 -For instance, the code inside `user.sayHi()` may need the name of the `user`. +举个例子,`user.sayHi()` 中的代码可能需要用到 `user` 的 name 属性。 -**To access the object, a method can use the `this` keyword.** +**为了访问该对象,方法中可以使用 `this` 关键字。** -The value of `this` is the object "before dot", the one used to call the method. +`this` 的值就是在点之前的这个对象,即调用该方法的对象。 -For instance: +举个例子: ```js run let user = { @@ -119,10 +119,9 @@ let user = { user.sayHi(); // John ``` +在这里 `user.sayHi()` 执行过程中,`this` 的值是 `user`。 -Here during the execution of `user.sayHi()`, the value of `this` will be `user`. - -Technically, it's also possible to access the object without `this`, by referencing it via the outer variable: +技术上讲,也可以在不使用 `this` 的情况下,通过外部变量名来引用它: ```js let user = { @@ -138,9 +137,9 @@ let user = { }; ``` -...But such code is unreliable. If we decide to copy `user` to another variable, e.g. `admin = user` and overwrite `user` with something else, then it will access the wrong object. +但这样的代码是不可靠的。如果我们将 `user` 复制给另一个变量。例如 `admin = user`,并赋另外的值给 `user`,那么它将访问到错误的对象。 -That's demonstrated below: +如下所示: ```js run let user = { @@ -162,13 +161,13 @@ user = null; // overwrite to make things obvious admin.sayHi(); // Whoops! inside sayHi(), the old name is used! error! ``` -If we used `this.name` instead of `user.name` inside the `alert`, then the code would work. +如果在 `alert` 中以 `this.name` 替换 `user.name`,那么代码就会正常运行。 -## "this" is not bound +## “this” 不受限制 -In JavaScript, "this" keyword behaves unlike most other programming languages. First, it can be used in any function. +在 JavaScript 中,“this”关键字与大多数其他编程语言中的不同。首先,它可以用于任何函数。 -There's no syntax error in the code like that: +这样的代码没有语法错误: ```js function sayHi() { @@ -176,9 +175,9 @@ function sayHi() { } ``` -The value of `this` is evaluated during the run-time. And it can be anything. +`this` 是在运行时求值的。它可以是任何值。 -For instance, the same function may have different "this" when called from different objects: +例如,从不同的对象中调用同一个函数可能会有不同的“this”值: ```js run let user = { name: "John" }; @@ -202,7 +201,7 @@ admin.f(); // Admin (this == admin) admin['f'](); // Admin (dot or square brackets access the method – doesn't matter) ``` -Actually, we can call the function without an object at all: +实际上,我们可以在没有任何对象的情况下调用函数: ```js run function sayHi() { @@ -212,31 +211,31 @@ function sayHi() { sayHi(); // undefined ``` -In this case `this` is `undefined` in strict mode. If we try to access `this.name`, there will be an error. +在这种情况下,严格模式下的 `this` 值为 `undefined`。如果我们尝试访问 `this.name`,将会出现错误。 -In non-strict mode (if one forgets `use strict`) the value of `this` in such case will be the *global object* (`window` in a browser, we'll get to it later). This is a historical behavior that `"use strict"` fixes. +在非严格模式(没有使用 `use strict`)的情况下,`this` 将会是**全局对象**(浏览器中的 `window`,我们稍后会进行讨论)。`"use strict"` 可以修复这个历史行为。 -Please note that usually a call of a function that uses `this` without an object is not normal, but rather a programming mistake. If a function has `this`, then it is usually meant to be called in the context of an object. +请注意,通常在没有对象的情况下使用 `this` 的函数调用是不常见的,会(导致)编程错误。如果函数中有 `this`,那么通常意味着它是在对象上下文环境中被调用的。 ```smart header="The consequences of unbound `this`" -If you come from another programming language, then you are probably used to the idea of a "bound `this`", where methods defined in an object always have `this` referencing that object. +如果你来自其他的编程语言,那么你可能熟悉『绑定 `this`』的概念。在对象定义的方法中,`this` 总是指向该对象。 -In JavaScript `this` is "free", its value is evaluated at call-time and does not depend on where the method was declared, but rather on what's the object "before the dot". +在 JavaScript 中,`this` 是『自由』的,它的值是在调用时进行求值的,它的值并不取决于方法声明的位置,而是(取决)于在『点之前』的是什么对象。 -The concept of run-time evaluated `this` has both pluses and minuses. On the one hand, a function can be reused for different objects. On the other hand, greater flexibility opens a place for mistakes. +在运行时对 `this` 求值的这个想法有其优缺点。一方面,函数可以被重用于不同的对象。另一方面,更大的灵活性给错误留下了余地。 -Here our position is not to judge whether this language design decision is good or bad. We'll understand how to work with it, how to get benefits and evade problems. +这里我们的立场并不是要评判编程语言的这个想法的好坏。而是我们要了解怎样使用它,如何趋利避害。 ``` -## Internals: Reference Type +## 内部:引用类型 ```warn header="In-depth language feature" -This section covers an advanced topic, to understand certain edge-cases better. +本文介绍一个进阶的主题,来更好地理解一些特殊情况。 -If you want to go on faster, it can be skipped or postponed. +如果你想学得更快,这部分你可以跳过或过后来读。 ``` -An intricate method call can lose `this`, for instance: +『复杂』的方法调用可能会失去 `this`,如例: ```js run let user = { @@ -253,32 +252,32 @@ user.hi(); // John (the simple call works) */!* ``` -On the last line there is a ternary operator that chooses either `user.hi` or `user.bye`. In this case the result is `user.hi`. +最后一行中有一个三元运算符,它要判断是 `user.hi` 或 `user.bye`。在这种情况下,结果会是 `user.hi`。 -The method is immediately called with parentheses `()`. But it doesn't work right! +该方法立即被括号 `()` 调用。但它无效。 -You can see that the call results in an error, cause the value of `"this"` inside the call becomes `undefined`. +你可以看到该调用导致了错误,因为调用中的 `"this"` 为 `undefined`。 -This works (object dot method): +这样是正确的(对象点方法): ```js user.hi(); ``` -This doesn't (evaluated method): +这样没有效果(对方法求值): ```js (user.name == "John" ? user.hi : user.bye)(); // Error! ``` -Why? If we want to understand why it happens, let's get under the hood of how `obj.method()` call works. +原因是什么?如果我们想了解为什么会这样,那么我们要深入理解 `obj.method()` 调用的原理。 -Looking closely, we may notice two operations in `obj.method()` statement: +仔细看,我们可能注意到 `obj.method()` 语句中有两个操作符。 -1. First, the dot `'.'` retrieves the property `obj.method`. -2. Then parentheses `()` execute it. +1. 首先,点 `'.'` 取得这个 `obj.method` 属性。 +2. 其后的括号 `()` 调用它。 -So, how does the information about `this` gets passed from the first part to the second one? +那么,`this` 是如何从第一部分传递到第二部分的呢? -If we put these operations on separate lines, then `this` will be lost for sure: +如果把这些操作分离开,那么 `this` 肯定会丢失: ```js run let user = { @@ -293,36 +292,36 @@ hi(); // Error, because this is undefined */!* ``` -Here `hi = user.hi` puts the function into the variable, and then on the last line it is completely standalone, and so there's no `this`. +这里 `hi = user.hi` 把函数赋值给变量,其后的最后一行是完全独立的,所以它没有 `this`。 -**To make `user.hi()` calls work, JavaScript uses a trick -- the dot `'.'` returns not a function, but a value of the special [Reference Type](https://tc39.github.io/ecma262/#sec-reference-specification-type).** +**为了让 `user.hi()` 有效,JavaScript 用一个技巧 —— 这个 `'.'` 点返回的不是一个函数, 而是一种特殊的[引用类型]的值(https://tc39.github.io/ecma262/#sec-reference-specification-type).** -The Reference Type is a "specification type". We can't explicitly use it, but it is used internally by the language. +引用类型是一种『规范中有的类型』。我们不能明确地指定它,但是可以在语言内部使用。 -The value of Reference Type is a three-value combination `(base, name, strict)`, where: +引用类型的值是三点的结合 `(base, name, strict)` ,如下: -- `base` is the object. -- `name` is the property. -- `strict` is true if `use strict` is in effect. +- `base` 是对象。 +- `name` 是属性。 +- 当 `use strict` 生效,`strict` 为真。 -The result of a property access `user.hi` is not a function, but a value of Reference Type. For `user.hi` in strict mode it is: +`user.hi` 属性访问的值不是函数,而是引用类型的值。在严格模式下,`user.hi` 是: ```js // Reference Type value (user, "hi", true) ``` -When parentheses `()` are called on the Reference Type, they receive the full information about the object and it's method, and can set the right `this` (`=user` in this case). +当在引用类型上用 `()` 调用时,它们接收到这个对象和它的方法的所有信息,并且设定正确的 `this` 值(这里等于 `user`)。 -Any other operation like assignment `hi = user.hi` discards the reference type as a whole, takes the value of `user.hi` (a function) and passes it on. So any further operation "loses" `this`. +`hi = user.hi` 赋值等其他的操作,将引用类型作为一个整体丢弃,只获取 `user.hi`(一个函数)的值进行传递。因此,进一步操作『失去』了 `this`(值)。 -So, as the result, the value of `this` is only passed the right way if the function is called directly using a dot `obj.method()` or square brackets `obj[method]()` syntax (they do the same here). +所以如果直接使用点 `obj.method()` 或方括号语法 `obj[method]()`(它们在这里并无差别)调用函数,那么作为结果,`this` 值会以正确的方式进行传递。 -## Arrow functions have no "this" +## 箭头函数没有自己的 "this" -Arrow functions are special: they don't have their "own" `this`. If we reference `this` from such a function, it's taken from the outer "normal" function. +箭头函数有些特别:它们没有自己的 `this`。如果我们在这样的函数中引用 `this`,`this` 值取决于外部『正常的』函数。 -For instance, here `arrow()` uses `this` from the outer `user.sayHi()` method: +举个例子,这里的 `arrow()` 使用的 `this` 来自外部的 `user.sayHi()` 方法: ```js run let user = { @@ -336,18 +335,18 @@ let user = { user.sayHi(); // Ilya ``` -That's a special feature of arrow functions, it's useful when we actually do not want to have a separate `this`, but rather to take it from the outer context. Later in the chapter we'll go more deeply into arrow functions. +这是箭头函数的一个特征,当我们并不想要一个独立的 `this` 值,反而想从外部上下文中获取时,它很有用。在后面的章节 中我们将更深入地介绍箭头函数。 -## Summary +## 总结 -- Functions that are stored in object properties are called "methods". -- Methods allow objects to "act" like `object.doSomething()`. -- Methods can reference the object as `this`. +- 存储在对象中函数称之为『方法』。 +- 对象执行方法进行『操作』,比如 `object.doSomething()`。 +- 方法可以将该对象引用为 `this`。 -The value of `this` is defined at run-time. -- When a function is declared, it may use `this`, but that `this` has no value until the function is called. -- That function can be copied between objects. -- When a function is called in the "method" syntax: `object.method()`, the value of `this` during the call is `object`. +`this` 的值是在运行时求值的。 +- 函数声明使用的 `this` 只有等到调用时才会有值。 +- 函数可以在对象之间进行共用。 +- 当函数使用『方法』语法 `object.method()` 调用时,调用过程中的 `this` 总是指向 `object`。 -Please note that arrow functions are special: they have no `this`. When `this` is accessed inside an arrow function, it is taken from outside. +请注意箭头函数有些特别:它们没有 `this`。在箭头函数内部访问的都是来自外部的 `this`值。 From 6c6831015ed80a0413c7bacea382ce344436f81b Mon Sep 17 00:00:00 2001 From: L9m Date: Thu, 19 Apr 2018 11:44:25 +0800 Subject: [PATCH 02/32] 2-check-syntax draft 1 --- .../04-object-methods/2-check-syntax/task.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/2-check-syntax/task.md b/1-js/04-object-basics/04-object-methods/2-check-syntax/task.md index f40d687352..011c353877 100644 --- a/1-js/04-object-basics/04-object-methods/2-check-syntax/task.md +++ b/1-js/04-object-basics/04-object-methods/2-check-syntax/task.md @@ -1,10 +1,10 @@ -importance: 2 +重要级:2 --- -# Syntax check +# 检查语法 -What is the result of this code? +这段代码的结果是什么? ```js no-beautify @@ -16,4 +16,4 @@ let user = { (user.go)() ``` -P.S. There's a pitfall :) +提示:有一个陷阱哦 :) From 9f032e70aedd6b3588d2e603da0c8dc78075ec7f Mon Sep 17 00:00:00 2001 From: L9m Date: Thu, 19 Apr 2018 11:47:36 +0800 Subject: [PATCH 03/32] 2-check-syntax solution draft 1 --- .../04-object-methods/2-check-syntax/solution.md | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/2-check-syntax/solution.md b/1-js/04-object-basics/04-object-methods/2-check-syntax/solution.md index e2e87de7c9..34fd7af40a 100644 --- a/1-js/04-object-basics/04-object-methods/2-check-syntax/solution.md +++ b/1-js/04-object-basics/04-object-methods/2-check-syntax/solution.md @@ -1,6 +1,6 @@ -**Error**! +**错误**! -Try it: +试一下: ```js run let user = { @@ -11,19 +11,19 @@ let user = { (user.go)() // error! ``` -The error message in most browsers does not give understanding what went wrong. +大多数浏览器中的错误信息并不能说明出现了什么问题。 -**The error appears because a semicolon is missing after `user = {...}`.** +**出现此错误是因为在 `user = {...}` 之后遗漏了一个分号。** -JavaScript does not assume a semicolon before a bracket `(user.go)()`, so it reads the code like: +JavaScript 不会在括号 `(user.go)()` 前自动插入分号,所以解析的代码如下: ```js no-beautify let user = { go:... }(user.go)() ``` -Then we can also see that such a joint expression is syntactically a call of the object `{ go: ... }` as a function with the argument `(user.go)`. And that also happens on the same line with `let user`, so the `user` object has not yet even been defined, hence the error. +那么,我们可以看到这样一个连接的表达式,在语法构成上,把对象 `{ go: ... }` 作为一个方法调用,并且传递的参数为 `(user.go)`。并且让 `let user`在同一行赋值,因此 `user` 没被定义(之前)就会出现错误 -If we insert the semicolon, all is fine: +如果我们插入该分号,一切都会正常: ```js run let user = { @@ -34,7 +34,7 @@ let user = { (user.go)() // John ``` -Please note that brackets around `(user.go)` do nothing here. Usually they setup the order of operations, but here the dot `.` works first anyway, so there's no effect. Only the semicolon thing matters. +要注意的是 `(user.go)` 内的括号没有什么意义。通常用它们来设置操作的顺序,但在这里点 `.` 总是会先执行,所以并没有什么影响。分号是唯一重要的。 From cd139732c675c4223bf08471bdb777463d1bae33 Mon Sep 17 00:00:00 2001 From: L9m Date: Thu, 19 Apr 2018 11:50:26 +0800 Subject: [PATCH 04/32] 3-why-this solution draft 1 --- .../04-object-methods/3-why-this/solution.md | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/3-why-this/solution.md b/1-js/04-object-basics/04-object-methods/3-why-this/solution.md index 89bc0d722a..0feaf16eae 100644 --- a/1-js/04-object-basics/04-object-methods/3-why-this/solution.md +++ b/1-js/04-object-basics/04-object-methods/3-why-this/solution.md @@ -1,22 +1,22 @@ -Here's the explanations. +这里是解释。 -1. That's a regular object method call. +1. 它是一个常规的方法调用。 -2. The same, brackets do not change the order of operations here, the dot is first anyway. +2. 同样,括号没有改变执行的顺序,点总是首先执行。 -3. Here we have a more complex call `(expression).method()`. The call works as if it were split into two lines: +3. 这里我们有一个更复杂的 `(expression).method()` 调用。这个调用就像被分成了两行(代码)一样: ```js no-beautify f = obj.go; // calculate the expression f(); // call what we have ``` - Here `f()` is executed as a function, without `this`. +    这里的 `f()` 是作为一个没有(设定)`this` 的函数执行的。 -4. The similar thing as `(3)`, to the left of the dot `.` we have an expression. +4. 与 `(3)` 相类似,在点 `.` 的左边也有一个表达式。 -To explain the behavior of `(3)` and `(4)` we need to recall that property accessors (dot or square brackets) return a value of the Reference Type. +要解释 `(3)` 和 `(4)` 的原因,我们需要回顾一下属性访问器(点或方括号)返回的值是引用类型的。 -Any operation on it except a method call (like assignment `=` or `||`) turns it into an ordinary value, which does not carry the information allowing to set `this`. +除了方法调用之外的任何操作(如赋值 `=` 或 `||` 等)把它变为了一个没有设定 `this` 信息的普通值。 From c5a9ff672f0d3f1779451d1b5340c7d2dcc8878d Mon Sep 17 00:00:00 2001 From: L9m Date: Thu, 19 Apr 2018 11:51:48 +0800 Subject: [PATCH 05/32] 3-why-this task draft 1 --- .../04-object-basics/04-object-methods/3-why-this/task.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/3-why-this/task.md b/1-js/04-object-basics/04-object-methods/3-why-this/task.md index f22de29ccd..6441259635 100644 --- a/1-js/04-object-basics/04-object-methods/3-why-this/task.md +++ b/1-js/04-object-basics/04-object-methods/3-why-this/task.md @@ -1,12 +1,12 @@ -importance: 3 +重要级:3 --- -# Explain the value of "this" +# 解释“this”的值 -In the code below we intend to call `user.go()` method 4 times in a row. +在下面的代码中,我们试图连续调用 4 次 `user.go()` 方法。 -But calls `(1)` and `(2)` works differently from `(3)` and `(4)`. Why? +但是 `(1)` 和 `(2)` 次与 `(3)` 和 `(4)` 调用结果不同,为什么呢? ```js run no-beautify let obj, method; From 6b8709831a347298b4f2b0c139383dd44e87aaa1 Mon Sep 17 00:00:00 2001 From: L9m Date: Thu, 19 Apr 2018 11:53:33 +0800 Subject: [PATCH 06/32] 4-object-property-this task draft 1 --- .../04-object-methods/4-object-property-this/task.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md b/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md index 4784b082c0..002a62949b 100644 --- a/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md +++ b/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md @@ -1,12 +1,12 @@ -importance: 5 +重要级:5 --- -# Using "this" in object literal +# 在对象字面量中使用“this” -Here the function `makeUser` returns an object. +这里 `makeUser` 函数返回了一个对象。 -What is the result of accessing its `ref`? Why? +访问 `ref` 的结果是什么?为什么? ```js function makeUser() { From e34662f2fff21bab58e6ba6ddb548a12e21eaa8e Mon Sep 17 00:00:00 2001 From: L9m Date: Thu, 19 Apr 2018 11:55:38 +0800 Subject: [PATCH 07/32] 4-object-property-this solution draft 1 --- .../4-object-property-this/solution.md | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md b/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md index f5773ec2cd..48a15c55df 100644 --- a/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md +++ b/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md @@ -1,6 +1,6 @@ -**Answer: an error.** +**答案:一个错误.** -Try it: +试一下: ```js run function makeUser() { return { @@ -14,15 +14,15 @@ let user = makeUser(); alert( user.ref.name ); // Error: Cannot read property 'name' of undefined ``` -That's because rules that set `this` do not look at object literals. +这是因为设置的 `this` 的规则并没有找到对象字面量。 -Here the value of `this` inside `makeUser()` is `undefined`, because it is called as a function, not as a method. +这里 `makeUser()` 中的 `this` 值是 `undefined`,因为它是被作为函数调用的,而不是方法调用。 -And the object literal itself has no effect on `this`. The value of `this` is one for the whole function, code blocks and object literals do not affect it. +对象字面量本身对于 `this` 没有影响。 `this` 的值是整个函数,代码段和对象字面量对它没有影响。 -So `ref: this` actually takes current `this` of the function. +所以,`ref: this` 实际上取的是该函数当前的 `this`。 -Here's the opposite case: +这里有个反例: ```js run function makeUser() { @@ -41,6 +41,6 @@ let user = makeUser(); alert( user.ref().name ); // John ``` -Now it works, because `user.ref()` is a method. And the value of `this` is set to the object before dot `.`. +现在正常了,因为 `user.ref()` 是一个方法。`this` 的值是点 `.` 之前的这个对象。 From d2d19afb3e2d34d6f06f0fea3ea2ae8992cf87da Mon Sep 17 00:00:00 2001 From: L9m Date: Thu, 19 Apr 2018 11:57:08 +0800 Subject: [PATCH 08/32] 7-calculator task draft 1 --- .../04-object-methods/7-calculator/task.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/7-calculator/task.md b/1-js/04-object-basics/04-object-methods/7-calculator/task.md index aa22608ece..075eece9ce 100644 --- a/1-js/04-object-basics/04-object-methods/7-calculator/task.md +++ b/1-js/04-object-basics/04-object-methods/7-calculator/task.md @@ -1,14 +1,14 @@ -importance: 5 +重要级:5 --- -# Create a calculator +# 创建一个计算器(对象) -Create an object `calculator` with three methods: +创建一个有三个方法的 `calculator` 对象: -- `read()` prompts for two values and saves them as object properties. -- `sum()` returns the sum of saved values. -- `mul()` multiplies saved values and returns the result. +- `read()` 提示输入两个值,并保存其为对象属性。 +- `sum()` 返回保存的值的和。 +- `mul()` 将保存的值相乘并返回其结果。 ```js let calculator = { From 2b708635118422a1220c48e2f9323a8acb621d4f Mon Sep 17 00:00:00 2001 From: L9m Date: Thu, 19 Apr 2018 11:58:42 +0800 Subject: [PATCH 09/32] 8-chain-calls task draft 1 --- .../04-object-methods/8-chain-calls/task.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/8-chain-calls/task.md b/1-js/04-object-basics/04-object-methods/8-chain-calls/task.md index a989846f52..3fa8710571 100644 --- a/1-js/04-object-basics/04-object-methods/8-chain-calls/task.md +++ b/1-js/04-object-basics/04-object-methods/8-chain-calls/task.md @@ -1,10 +1,10 @@ -importance: 2 +重要级:2 --- -# Chaining +# 链式(调用) -There's a `ladder` object that allows to go up and down: +有一个可以上下移动的 `ladder` 对象: ```js let ladder = { @@ -21,7 +21,7 @@ let ladder = { }; ``` -Now, if we need to make several calls in sequence, can do it like this: +现在如果我们要依次执行几次调用,可以这样做: ```js ladder.up(); @@ -30,10 +30,10 @@ ladder.down(); ladder.showStep(); // 1 ``` -Modify the code of `up` and `down` to make the calls chainable, like this: +修改 `up` 和 `down` 的代码让调用可以链接,就像这样: ```js ladder.up().up().down().showStep(); // 1 ``` -Such approach is widely used across JavaScript libraries. +此种方法在 JavaScript 库中被广泛使用。 From 25c421b1d602db26be4898b9036b7cce6b77a9b6 Mon Sep 17 00:00:00 2001 From: L9m Date: Thu, 19 Apr 2018 11:59:22 +0800 Subject: [PATCH 10/32] 8-chain-calls solution draft 1 --- .../04-object-methods/8-chain-calls/solution.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/8-chain-calls/solution.md b/1-js/04-object-basics/04-object-methods/8-chain-calls/solution.md index 41edd72369..5184e733e1 100644 --- a/1-js/04-object-basics/04-object-methods/8-chain-calls/solution.md +++ b/1-js/04-object-basics/04-object-methods/8-chain-calls/solution.md @@ -1,4 +1,4 @@ -The solution is to return the object itself from every call. +解决方案就是从每次调用后返回这个对象本身。 ```js run let ladder = { @@ -26,7 +26,7 @@ let ladder = { ladder.up().up().down().up().down().showStep(); // 1 ``` -We also can write a single call per line. For long chains it's more readable: +我们也可以每行一个调用。对于长链接它更具可读性: ```js ladder From 9cdbc486e4db4d9faef18534aa1a6238bcc9f31c Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 21:39:44 +0800 Subject: [PATCH 11/32] article draft 2 --- .../04-object-methods/article.md | 45 ++++++++++--------- 1 file changed, 23 insertions(+), 22 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/article.md b/1-js/04-object-basics/04-object-methods/article.md index cb168e5b94..5040454149 100644 --- a/1-js/04-object-basics/04-object-methods/article.md +++ b/1-js/04-object-basics/04-object-methods/article.md @@ -48,12 +48,12 @@ let user = { }; *!* -// first, declare +// 首先声明 function sayHi() { alert("Hello!"); }; -// then add as a method +// 然后将其作为一个方法 user.sayHi = sayHi; */!* @@ -70,7 +70,7 @@ OOP 是一门很大的学问,也是一门有其本身乐趣的学问。怎样 在对象字面量中,有一种更短的(声明)方法的语法: ```js -// these objects do the same +// 这些对象作用一样 let user = { sayHi: function() { @@ -78,10 +78,10 @@ let user = { } }; -// method shorthand looks better, right? +// 方法简写看起来更好,对吧? let user = { *!* - sayHi() { // same as "sayHi: function()" +  sayHi() { // 与 "sayHi: function()" 一样 */!* alert("Hello"); } @@ -119,6 +119,7 @@ let user = { user.sayHi(); // John ``` + 在这里 `user.sayHi()` 执行过程中,`this` 的值是 `user`。 技术上讲,也可以在不使用 `this` 的情况下,通过外部变量名来引用它: @@ -130,7 +131,7 @@ let user = { sayHi() { *!* - alert(user.name); // "user" instead of "this" +    alert(user.name); // "user" 替代 "this" */!* } @@ -148,7 +149,7 @@ let user = { sayHi() { *!* - alert( user.name ); // leads to an error +    alert( user.name ); // 导致错误 */!* } @@ -156,14 +157,14 @@ let user = { let admin = user; -user = null; // overwrite to make things obvious +user = null; // 覆盖让其更易懂 -admin.sayHi(); // Whoops! inside sayHi(), the old name is used! error! +admin.sayHi(); // 噢哟!在 sayHi() 使用了旧的变量名。错误! ``` 如果在 `alert` 中以 `this.name` 替换 `user.name`,那么代码就会正常运行。 -## “this” 不受限制 +## “this”不受限制 在 JavaScript 中,“this”关键字与大多数其他编程语言中的不同。首先,它可以用于任何函数。 @@ -188,17 +189,17 @@ function sayHi() { } *!* -// use the same functions in two objects +// 在两个对象中使用的是相同的函数 user.f = sayHi; admin.f = sayHi; */!* -// these calls have different this -// "this" inside the function is the object "before the dot" +// 它们调用时有不同的 this 值 +// 函数内部的 “this” 是点之前的这个对象 user.f(); // John (this == user) admin.f(); // Admin (this == admin) -admin['f'](); // Admin (dot or square brackets access the method – doesn't matter) +admin['f'](); // Admin(使用点或方括号语法来访问这个方法,都没有关系。) ``` 实际上,我们可以在没有任何对象的情况下调用函数: @@ -224,7 +225,7 @@ sayHi(); // undefined 在运行时对 `this` 求值的这个想法有其优缺点。一方面,函数可以被重用于不同的对象。另一方面,更大的灵活性给错误留下了余地。 -这里我们的立场并不是要评判编程语言的这个想法的好坏。而是我们要了解怎样使用它,如何趋利避害。 +这里我们的立场并不是要评判编程语言的这个想法的好坏,而是要了解怎样使用它,如何趋利避害。 ``` ## 内部:引用类型 @@ -235,7 +236,7 @@ sayHi(); // undefined 如果你想学得更快,这部分你可以跳过或过后来读。 ``` -『复杂』的方法调用可能会失去 `this`,如例: +『复杂』的方法调用可能会失去 `this`,比如: ```js run let user = { @@ -247,7 +248,7 @@ let user = { user.hi(); // John (the simple call works) *!* -// now let's call user.hi or user.bye depending on the name +// 现在我们要判断 name 属性,来决定调用 user.hi 或是 user.bye (user.name == "John" ? user.hi : user.bye)(); // Error! */!* ``` @@ -265,7 +266,7 @@ user.hi(); 这样没有效果(对方法求值): ```js -(user.name == "John" ? user.hi : user.bye)(); // Error! +(user.name == "John" ? user.hi : user.bye)(); // 错误! ``` 原因是什么?如果我们想了解为什么会这样,那么我们要深入理解 `obj.method()` 调用的原理。 @@ -286,9 +287,9 @@ let user = { } *!* -// split getting and calling the method in two lines +// 将赋值和方法调用拆分为两行 let hi = user.hi; -hi(); // Error, because this is undefined +hi(); // 错误,因为 this 未定义 */!* ``` @@ -307,7 +308,7 @@ hi(); // Error, because this is undefined `user.hi` 属性访问的值不是函数,而是引用类型的值。在严格模式下,`user.hi` 是: ```js -// Reference Type value +// 引用类型值 (user, "hi", true) ``` @@ -317,7 +318,7 @@ hi(); // Error, because this is undefined 所以如果直接使用点 `obj.method()` 或方括号语法 `obj[method]()`(它们在这里并无差别)调用函数,那么作为结果,`this` 值会以正确的方式进行传递。 -## 箭头函数没有自己的 "this" +## 箭头函数没有自己的“this” 箭头函数有些特别:它们没有自己的 `this`。如果我们在这样的函数中引用 `this`,`this` 值取决于外部『正常的』函数。 From a03901a7880805e64b2ba338bbaf567b2d73bbe7 Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 21:45:24 +0800 Subject: [PATCH 12/32] article draft 3 --- 1-js/04-object-basics/04-object-methods/article.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/article.md b/1-js/04-object-basics/04-object-methods/article.md index 5040454149..7c870f2bca 100644 --- a/1-js/04-object-basics/04-object-methods/article.md +++ b/1-js/04-object-basics/04-object-methods/article.md @@ -194,8 +194,8 @@ user.f = sayHi; admin.f = sayHi; */!* -// 它们调用时有不同的 this 值 -// 函数内部的 “this” 是点之前的这个对象 +// 它们调用时有不同的 this 值。 +// 函数内部的“this”是点之前的这个对象。 user.f(); // John (this == user) admin.f(); // Admin (this == admin) @@ -248,7 +248,7 @@ let user = { user.hi(); // John (the simple call works) *!* -// 现在我们要判断 name 属性,来决定调用 user.hi 或是 user.bye +// 现在我们要判断 name 属性,来决定调用 user.hi 或是 user.bye。 (user.name == "John" ? user.hi : user.bye)(); // Error! */!* ``` @@ -287,7 +287,7 @@ let user = { } *!* -// 将赋值和方法调用拆分为两行 +// 将赋值与方法调用拆分为两行 let hi = user.hi; hi(); // 错误,因为 this 未定义 */!* From ba73a3e5ff1a02c9f8bfc026f54b0b42c62ce88e Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 21:47:55 +0800 Subject: [PATCH 13/32] article 4 --- 1-js/04-object-basics/04-object-methods/article.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/article.md b/1-js/04-object-basics/04-object-methods/article.md index 7c870f2bca..babe9d2af2 100644 --- a/1-js/04-object-basics/04-object-methods/article.md +++ b/1-js/04-object-basics/04-object-methods/article.md @@ -1,4 +1,4 @@ -# 对象方法与“this” +# 对象方法与 “this” 对象通常被用来表示真实世界中的实体,比如用户、订单等等: @@ -164,9 +164,9 @@ admin.sayHi(); // 噢哟!在 sayHi() 使用了旧的变量名。错误! 如果在 `alert` 中以 `this.name` 替换 `user.name`,那么代码就会正常运行。 -## “this”不受限制 +## “this” 不受限制 -在 JavaScript 中,“this”关键字与大多数其他编程语言中的不同。首先,它可以用于任何函数。 +在 JavaScript 中,“this” 关键字与大多数其他编程语言中的不同。首先,它可以用于任何函数。 这样的代码没有语法错误: @@ -178,7 +178,7 @@ function sayHi() { `this` 是在运行时求值的。它可以是任何值。 -例如,从不同的对象中调用同一个函数可能会有不同的“this”值: +例如,从不同的对象中调用同一个函数可能会有不同的 “this” 值: ```js run let user = { name: "John" }; @@ -195,7 +195,7 @@ admin.f = sayHi; */!* // 它们调用时有不同的 this 值。 -// 函数内部的“this”是点之前的这个对象。 +// 函数内部的 “this” 是点之前的这个对象。 user.f(); // John (this == user) admin.f(); // Admin (this == admin) @@ -318,7 +318,7 @@ hi(); // 错误,因为 this 未定义 所以如果直接使用点 `obj.method()` 或方括号语法 `obj[method]()`(它们在这里并无差别)调用函数,那么作为结果,`this` 值会以正确的方式进行传递。 -## 箭头函数没有自己的“this” +## 箭头函数没有自己的 “this” 箭头函数有些特别:它们没有自己的 `this`。如果我们在这样的函数中引用 `this`,`this` 值取决于外部『正常的』函数。 From 548d181ae7008b367ec5c08290da301eea32d00e Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 21:50:32 +0800 Subject: [PATCH 14/32] article draft 4 --- 1-js/04-object-basics/04-object-methods/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/article.md b/1-js/04-object-basics/04-object-methods/article.md index babe9d2af2..505b4a8559 100644 --- a/1-js/04-object-basics/04-object-methods/article.md +++ b/1-js/04-object-basics/04-object-methods/article.md @@ -350,4 +350,4 @@ user.sayHi(); // Ilya - 函数可以在对象之间进行共用。 - 当函数使用『方法』语法 `object.method()` 调用时,调用过程中的 `this` 总是指向 `object`。 -请注意箭头函数有些特别:它们没有 `this`。在箭头函数内部访问的都是来自外部的 `this`值。 +请注意箭头函数有些特别:它们没有 `this`。在箭头函数内部访问的都是来自外部的 `this` 值。 From 89318739e7e804eea994b116409dc5ee57ca404a Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 21:53:23 +0800 Subject: [PATCH 15/32] task draft 2 --- 1-js/04-object-basics/04-object-methods/3-why-this/task.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/3-why-this/task.md b/1-js/04-object-basics/04-object-methods/3-why-this/task.md index 6441259635..8a38cf494f 100644 --- a/1-js/04-object-basics/04-object-methods/3-why-this/task.md +++ b/1-js/04-object-basics/04-object-methods/3-why-this/task.md @@ -2,11 +2,11 @@ --- -# 解释“this”的值 +# 解释 “this” 的值 在下面的代码中,我们试图连续调用 4 次 `user.go()` 方法。 -但是 `(1)` 和 `(2)` 次与 `(3)` 和 `(4)` 调用结果不同,为什么呢? +但是 `(1)` 和 `(2)` 次 `(3)` 和 `(4)` 调用结果不同,为什么呢? ```js run no-beautify let obj, method; From 719f92421ff61826011a1962cdfde91346667f8a Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 21:54:21 +0800 Subject: [PATCH 16/32] solution draft 2 --- .../04-object-methods/4-object-property-this/solution.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md b/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md index 48a15c55df..1e0aff095f 100644 --- a/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md +++ b/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md @@ -18,7 +18,7 @@ alert( user.ref.name ); // Error: Cannot read property 'name' of undefined 这里 `makeUser()` 中的 `this` 值是 `undefined`,因为它是被作为函数调用的,而不是方法调用。 -对象字面量本身对于 `this` 没有影响。 `this` 的值是整个函数,代码段和对象字面量对它没有影响。 +对象字面量本身对于 `this` 没有影响。`this` 的值是整个函数,代码段和对象字面量对它没有影响。 所以,`ref: this` 实际上取的是该函数当前的 `this`。 From e31913e2a198e907c217e672296b298d57ced9d6 Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 21:55:07 +0800 Subject: [PATCH 17/32] solution draft 2 --- .../04-object-methods/4-object-property-this/solution.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md b/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md index 1e0aff095f..b000e9ac60 100644 --- a/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md +++ b/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md @@ -41,6 +41,6 @@ let user = makeUser(); alert( user.ref().name ); // John ``` -现在正常了,因为 `user.ref()` 是一个方法。`this` 的值是点 `.` 之前的这个对象。 +现在正常了,因为 `user.ref()` 是一个方法。`this` 的值设置为点 `.` 之前的这个对象。 From ad2a70be15e9f1e46a4835bf767bc4556a3929c6 Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 21:55:34 +0800 Subject: [PATCH 18/32] task draft 2 --- .../04-object-methods/4-object-property-this/task.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md b/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md index 002a62949b..e9ee73ed37 100644 --- a/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md +++ b/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md @@ -2,7 +2,7 @@ --- -# 在对象字面量中使用“this” +# 在对象字面量中使用 “this” 这里 `makeUser` 函数返回了一个对象。 From 191c95dbe87eb4f79db52ba5d13229a4b4e6e846 Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 21:56:02 +0800 Subject: [PATCH 19/32] task draft 2 --- 1-js/04-object-basics/04-object-methods/7-calculator/task.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/7-calculator/task.md b/1-js/04-object-basics/04-object-methods/7-calculator/task.md index 075eece9ce..98e27b9612 100644 --- a/1-js/04-object-basics/04-object-methods/7-calculator/task.md +++ b/1-js/04-object-basics/04-object-methods/7-calculator/task.md @@ -6,7 +6,7 @@ 创建一个有三个方法的 `calculator` 对象: -- `read()` 提示输入两个值,并保存其为对象属性。 +- `read()` 提示输入两个值,将其保存为对象属性。 - `sum()` 返回保存的值的和。 - `mul()` 将保存的值相乘并返回其结果。 From c7fb890f4ed55bf2fbde07f9e4deca6eb43bc0a5 Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 21:56:31 +0800 Subject: [PATCH 20/32] solution draft 2 --- .../04-object-methods/8-chain-calls/solution.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/8-chain-calls/solution.md b/1-js/04-object-basics/04-object-methods/8-chain-calls/solution.md index 5184e733e1..a19f7a77bd 100644 --- a/1-js/04-object-basics/04-object-methods/8-chain-calls/solution.md +++ b/1-js/04-object-basics/04-object-methods/8-chain-calls/solution.md @@ -1,4 +1,4 @@ -解决方案就是从每次调用后返回这个对象本身。 +解决方案就是在每次调用后返回这个对象本身。 ```js run let ladder = { From 63814e36f86b87121794d22fc2c404e5c3951e18 Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 22:00:33 +0800 Subject: [PATCH 21/32] revert 'importance:' --- 1-js/04-object-basics/04-object-methods/2-check-syntax/task.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/2-check-syntax/task.md b/1-js/04-object-basics/04-object-methods/2-check-syntax/task.md index 011c353877..62a368864e 100644 --- a/1-js/04-object-basics/04-object-methods/2-check-syntax/task.md +++ b/1-js/04-object-basics/04-object-methods/2-check-syntax/task.md @@ -1,4 +1,4 @@ -重要级:2 +importance: 2 --- From bea3a9eb67556e61d79e78796f4d4a2e88c8a702 Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 22:01:46 +0800 Subject: [PATCH 22/32] revert 'importance:' --- 1-js/04-object-basics/04-object-methods/3-why-this/task.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/3-why-this/task.md b/1-js/04-object-basics/04-object-methods/3-why-this/task.md index 8a38cf494f..759a4e930b 100644 --- a/1-js/04-object-basics/04-object-methods/3-why-this/task.md +++ b/1-js/04-object-basics/04-object-methods/3-why-this/task.md @@ -1,4 +1,4 @@ -重要级:3 +importance: 3 --- From aea9aba448fcb513e4584c196269971207a5fb20 Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 22:03:08 +0800 Subject: [PATCH 23/32] revert 'importance:' --- .../04-object-methods/4-object-property-this/task.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md b/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md index e9ee73ed37..ddf4f516cd 100644 --- a/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md +++ b/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md @@ -1,4 +1,4 @@ -重要级:5 +importance: 5 --- From d5c17946d39d7c4e7547e8fa3c2b2f47306ef240 Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 22:03:49 +0800 Subject: [PATCH 24/32] revert 'importance:' --- 1-js/04-object-basics/04-object-methods/8-chain-calls/task.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/8-chain-calls/task.md b/1-js/04-object-basics/04-object-methods/8-chain-calls/task.md index 3fa8710571..2d37bf4eb5 100644 --- a/1-js/04-object-basics/04-object-methods/8-chain-calls/task.md +++ b/1-js/04-object-basics/04-object-methods/8-chain-calls/task.md @@ -1,4 +1,4 @@ -重要级:2 +importance: 2 --- From c2cc370fe502c5fbacfbf27e2b97a6ab0c24fbbe Mon Sep 17 00:00:00 2001 From: L9m Date: Mon, 23 Apr 2018 22:05:04 +0800 Subject: [PATCH 25/32] revert 'importance:' --- 1-js/04-object-basics/04-object-methods/7-calculator/task.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/7-calculator/task.md b/1-js/04-object-basics/04-object-methods/7-calculator/task.md index 98e27b9612..ac10808a42 100644 --- a/1-js/04-object-basics/04-object-methods/7-calculator/task.md +++ b/1-js/04-object-basics/04-object-methods/7-calculator/task.md @@ -1,4 +1,4 @@ -重要级:5 +importance: 5 --- From 3095f25b3d95ed294376c7749e8f8df33546bcf8 Mon Sep 17 00:00:00 2001 From: LeviDing Date: Mon, 23 Apr 2018 22:32:19 +0800 Subject: [PATCH 26/32] Update task.md --- 1-js/04-object-basics/04-object-methods/3-why-this/task.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/3-why-this/task.md b/1-js/04-object-basics/04-object-methods/3-why-this/task.md index 759a4e930b..3a59ecadc1 100644 --- a/1-js/04-object-basics/04-object-methods/3-why-this/task.md +++ b/1-js/04-object-basics/04-object-methods/3-why-this/task.md @@ -2,7 +2,7 @@ importance: 3 --- -# 解释 “this” 的值 +# 解释 "this" 的值 在下面的代码中,我们试图连续调用 4 次 `user.go()` 方法。 From 68dec6c5e68e46bd1ca089c13db6b60b38c93172 Mon Sep 17 00:00:00 2001 From: LeviDing Date: Mon, 23 Apr 2018 22:32:38 +0800 Subject: [PATCH 27/32] Update solution.md --- .../04-object-methods/4-object-property-this/solution.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md b/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md index b000e9ac60..1356a407ba 100644 --- a/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md +++ b/1-js/04-object-basics/04-object-methods/4-object-property-this/solution.md @@ -1,4 +1,4 @@ -**答案:一个错误.** +**答案:一个错误。** 试一下: ```js run From fbc064fd72254988171e0daaa97a3a4459c87b37 Mon Sep 17 00:00:00 2001 From: LeviDing Date: Mon, 23 Apr 2018 22:33:11 +0800 Subject: [PATCH 28/32] Update task.md --- .../04-object-methods/4-object-property-this/task.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md b/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md index ddf4f516cd..c990362c46 100644 --- a/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md +++ b/1-js/04-object-basics/04-object-methods/4-object-property-this/task.md @@ -2,7 +2,7 @@ importance: 5 --- -# 在对象字面量中使用 “this” +# 在对象字面量中使用 "this" 这里 `makeUser` 函数返回了一个对象。 From 7fcb57d4601d1b4ea3aec3f4a1013f1ccd3a15aa Mon Sep 17 00:00:00 2001 From: LeviDing Date: Mon, 23 Apr 2018 22:33:46 +0800 Subject: [PATCH 29/32] Update article.md --- 1-js/04-object-basics/04-object-methods/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/article.md b/1-js/04-object-basics/04-object-methods/article.md index 505b4a8559..f87f2b785d 100644 --- a/1-js/04-object-basics/04-object-methods/article.md +++ b/1-js/04-object-basics/04-object-methods/article.md @@ -1,4 +1,4 @@ -# 对象方法与 “this” +# 对象方法与 "this" 对象通常被用来表示真实世界中的实体,比如用户、订单等等: From fde8b4bc9500e8ee1a41b56acc70d002c5b6b7ed Mon Sep 17 00:00:00 2001 From: LeviDing Date: Mon, 23 Apr 2018 22:35:16 +0800 Subject: [PATCH 30/32] Update article.md --- 1-js/04-object-basics/04-object-methods/article.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/article.md b/1-js/04-object-basics/04-object-methods/article.md index f87f2b785d..6ac1986b07 100644 --- a/1-js/04-object-basics/04-object-methods/article.md +++ b/1-js/04-object-basics/04-object-methods/article.md @@ -61,9 +61,9 @@ user.sayHi(); // Hello! ``` ```smart header="Object-oriented programming" -当我们在代码中用对象表示实体时,这就是所谓的[面向对象编程](https://en.wikipedia.org/wiki/Object-oriented_programming),简称为“OOP”。 +当我们在代码中用对象表示实体时,这就是所谓的[面向对象编程](https://en.wikipedia.org/wiki/Object-oriented_programming),简称为 "OOP"。 -OOP 是一门很大的学问,也是一门有其本身乐趣的学问。怎样选择合适的实体?如何组织它们之间的交互?这就是架构,有很多关于此方面的书,例如 E.Gamma、R.Helm、R.Johnson 和 J.Vissides 所著的《设计模式:可复用面向对象软件的基础》、 G.Booch 所著的《面向对象分析与设计》 等等。在后面的 一章中,我们将会触及这个主题的浅层内容。 +OOP 是一门很大的学问,也是一门有其本身乐趣的学问。怎样选择合适的实体?如何组织它们之间的交互?这就是架构,有很多关于此方面的书,例如 E.Gamma、R.Helm、R.Johnson 和 J.Vissides 所著的《设计模式:可复用面向对象软件的基础》、G.Booch 所著的《面向对象分析与设计》 等等。在后面的 一章中,我们将会触及这个主题的浅层内容。 ``` ### 方法简写 @@ -88,11 +88,11 @@ let user = { }; ``` -如所示,我们可以省略 `function` 只写了 `sayHi()`。 +如所示,我们可以省略 `"function"` 只写了 `sayHi()`。 说实话,这种表示法还是有些不同。与对象集成有关的细微差别(稍后将会介绍),但现在它们无关紧要。在几乎所有的情况下,较短的语法是最好的。 -## 方法中的 “this” +## 方法中的 "this" 对象方法需要访问对象中的存储的信息完成其工作是很常见的。 From 8664708385ea52743ba924eb9fb60f99e71b3c4a Mon Sep 17 00:00:00 2001 From: LeviDing Date: Mon, 23 Apr 2018 22:38:35 +0800 Subject: [PATCH 31/32] Update article.md --- 1-js/04-object-basics/04-object-methods/article.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/1-js/04-object-basics/04-object-methods/article.md b/1-js/04-object-basics/04-object-methods/article.md index 6ac1986b07..70f385a0ff 100644 --- a/1-js/04-object-basics/04-object-methods/article.md +++ b/1-js/04-object-basics/04-object-methods/article.md @@ -63,7 +63,7 @@ user.sayHi(); // Hello! ```smart header="Object-oriented programming" 当我们在代码中用对象表示实体时,这就是所谓的[面向对象编程](https://en.wikipedia.org/wiki/Object-oriented_programming),简称为 "OOP"。 -OOP 是一门很大的学问,也是一门有其本身乐趣的学问。怎样选择合适的实体?如何组织它们之间的交互?这就是架构,有很多关于此方面的书,例如 E.Gamma、R.Helm、R.Johnson 和 J.Vissides 所著的《设计模式:可复用面向对象软件的基础》、G.Booch 所著的《面向对象分析与设计》 等等。在后面的 一章中,我们将会触及这个主题的浅层内容。 +OOP 是一门很大的学问,也是一门有其本身乐趣的学问。怎样选择合适的实体?如何组织它们之间的交互?这就是架构,有很多关于此方面的书,例如 E.Gamma、R.Helm、R.Johnson 和 J.Vissides 所著的《设计模式:可复用面向对象软件的基础》、G.Booch 所著的《面向对象分析与设计》等等。在后面的 一章中,我们将会触及这个主题的浅层内容。 ``` ### 方法简写 @@ -166,7 +166,7 @@ admin.sayHi(); // 噢哟!在 sayHi() 使用了旧的变量名。错误! ## “this” 不受限制 -在 JavaScript 中,“this” 关键字与大多数其他编程语言中的不同。首先,它可以用于任何函数。 +在 JavaScript 中,"this" 关键字与大多数其他编程语言中的不同。首先,它可以用于任何函数。 这样的代码没有语法错误: @@ -178,7 +178,7 @@ function sayHi() { `this` 是在运行时求值的。它可以是任何值。 -例如,从不同的对象中调用同一个函数可能会有不同的 “this” 值: +例如,从不同的对象中调用同一个函数可能会有不同的 "this" 值: ```js run let user = { name: "John" }; @@ -195,7 +195,7 @@ admin.f = sayHi; */!* // 它们调用时有不同的 this 值。 -// 函数内部的 “this” 是点之前的这个对象。 +// 函数内部的 "this" 是点之前的这个对象。 user.f(); // John (this == user) admin.f(); // Admin (this == admin) @@ -299,7 +299,7 @@ hi(); // 错误,因为 this 未定义 引用类型是一种『规范中有的类型』。我们不能明确地指定它,但是可以在语言内部使用。 -引用类型的值是三点的结合 `(base, name, strict)` ,如下: +引用类型的值是三点的结合 `(base, name, strict)`,如下: - `base` 是对象。 - `name` 是属性。 From 596fc30e726b6dbecfe479a5384326c979c5343b Mon Sep 17 00:00:00 2001 From: LeviDing Date: Mon, 23 Apr 2018 22:40:14 +0800 Subject: [PATCH 32/32] Update article.md --- 1-js/04-object-basics/04-object-methods/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/04-object-basics/04-object-methods/article.md b/1-js/04-object-basics/04-object-methods/article.md index 70f385a0ff..243798874b 100644 --- a/1-js/04-object-basics/04-object-methods/article.md +++ b/1-js/04-object-basics/04-object-methods/article.md @@ -318,7 +318,7 @@ hi(); // 错误,因为 this 未定义 所以如果直接使用点 `obj.method()` 或方括号语法 `obj[method]()`(它们在这里并无差别)调用函数,那么作为结果,`this` 值会以正确的方式进行传递。 -## 箭头函数没有自己的 “this” +## 箭头函数没有自己的 "this" 箭头函数有些特别:它们没有自己的 `this`。如果我们在这样的函数中引用 `this`,`this` 值取决于外部『正常的』函数。