Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 1913b45

Browse files
Merge branch 'master' into patch-7
2 parents 3a5647a + dbcbd45 commit 1913b45

File tree

7 files changed

+75
-74
lines changed

7 files changed

+75
-74
lines changed

‎1-js/03-code-quality/04-ninja-code/article.md‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -137,7 +137,7 @@ Instead, reuse existing names. Just write new values into them.
137137

138138
In a function try to use only variables passed as parameters.
139139

140-
That would make it really hard to identify what's exactly in the variable *now*. And also where it comes from. A person with weak intuition would have to analyze the code line-by-line and track the changes through every code branch.
140+
That would make it really hard to identify what's exactly in the variable *now*. And also where it comes from. The purpose is to develop the intuition and memory of a person reading the code. A person with weak intuition would have to analyze the code line-by-line and track the changes through every code branch.
141141

142142
**An advanced variant of the approach is to covertly (!) replace the value with something alike in the middle of a loop or a function.**
143143

@@ -155,7 +155,7 @@ function ninjaFunction(elem) {
155155

156156
A fellow programmer who wants to work with `elem` in the second half of the function will be surprised... Only during the debugging, after examining the code they will find out that they're working with a clone!
157157

158-
Seen in code regularly. Deadly effective even against an experienced ninja.
158+
Seen in code regularly. Deadly effective even against an experienced ninja.
159159

160160
## Underscores for fun
161161

@@ -169,8 +169,7 @@ A smart ninja puts underscores at one spot of code and evades them at other plac
169169

170170
Let everyone see how magnificent your entities are! Names like `superElement`, `megaFrame` and `niceItem` will definitely enlighten a reader.
171171

172-
Indeed, from one hand, something is written: `super..`, `mega..`, `nice..` But from the other hand -- that brings no details. A reader may decide to look for a hidden meaning and meditate for an hour or two.
173-
172+
Indeed, from one hand, something is written: `super..`, `mega..`, `nice..` But from the other hand -- that brings no details. A reader may decide to look for a hidden meaning and meditate for an hour or two of their paid working time.
174173

175174

176175
## Overlap outer variables
@@ -180,7 +179,7 @@ When in the light, can't see anything in the darkness.<br>
180179
When in the darkness, can see everything in the light.
181180
```
182181

183-
Use same names for variables inside and outside a function. As simple. No efforts required.
182+
Use same names for variables inside and outside a function. As simple. No efforts to invent new names.
184183

185184
```js
186185
let *!*user*/!* = authenticateUser();

‎1-js/06-advanced-functions/11-currying-partials/article.md‎

Lines changed: 10 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -170,7 +170,7 @@ To understand the benefits we definitely need a worthy real-life example.
170170

171171
Advanced currying allows the function to be both callable normally and partially.
172172

173-
For instance, we have the logging function `log(date, importance, message)` that formats and outputs the information. In real projects such functions also have many other useful features like sending logs over the network:
173+
For instance, we have the logging function `log(date, importance, message)` that formats and outputs the information. In real projects such functions also have many other useful features like sending logs over the network, here we just use `alert`:
174174

175175
```js
176176
function log(date, importance, message) {
@@ -184,34 +184,29 @@ Let's curry it!
184184
log = _.curry(log);
185185
```
186186

187-
After that `log` still works the normal way:
188-
189-
```js
190-
log(new Date(), "DEBUG", "some debug");
191-
```
192-
193-
...But also can be called in the curried form:
187+
After that `log` work both the normal way and in the curried form:
194188

195189
```js
190+
log(new Date(), "DEBUG", "some debug"); // log(a,b,c)
196191
log(new Date())("DEBUG")("some debug"); // log(a)(b)(c)
197192
```
198193

199-
Let's get a convenience function for today's logs:
194+
Now we can easily make a convenience function for current logs:
200195

201196
```js
202-
// todayLog will be the partial of log with fixed first argument
203-
let todayLog = log(new Date());
197+
// currentLog will be the partial of log with fixed first argument
198+
let logNow = log(new Date());
204199

205200
// use it
206-
todayLog("INFO", "message"); // [HH:mm] INFO message
201+
logNow("INFO", "message"); // [HH:mm] INFO message
207202
```
208203

209-
And now a convenience function for today's debug messages:
204+
And here's a convenience function for current debug messages:
210205

211206
```js
212-
let todayDebug = todayLog("DEBUG");
207+
let debugNow = logNow("DEBUG");
213208

214-
todayDebug("message"); // [HH:mm] DEBUG message
209+
debugNow("message"); // [HH:mm] DEBUG message
215210
```
216211

217212
So:

‎1-js/11-async/07-microtask-queue/article.md‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ In-browser JavaScript execution flow, as well as Node.js, is based on an *event
5858

5959
"Event loop" is a process when the engine sleeps and waits for events. When they occur - handles them and sleeps again.
6060

61-
Events may come either comes from external sources, like user actions, or just as the end signal of an internal task.
61+
Events may come either from external sources, like user actions, or just as the end signal of an internal task.
6262

6363
Examples of events:
6464
- `mousemove`, a user moved their mouse.
@@ -124,7 +124,6 @@ Naturally, `promise` shows up first, because `setTimeout` macrotask awaits in th
124124

125125
As a logical consequence, macrotasks are handled only when promises give the engine a "free time". So if we have a chain of promise handlers that don't wait for anything, execute right one after another, then a `setTimeout` (or a user action handler) can never run in-between them.
126126

127-
128127
## Unhandled rejection
129128

130129
Remember "unhandled rejection" event from the chapter <info:promise-error-handling>?

‎2-ui/1-document/08-styles-and-classes/article.md‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -66,10 +66,10 @@ So we can operate both on the full class string using `className` or on individu
6666
Methods of `classList`:
6767

6868
- `elem.classList.add/remove("class")` -- adds/removes the class.
69-
- `elem.classList.toggle("diff-43f8025f60da6e2bb898344caed76c1214cd0621b06cc8b34720b489ec393dde-69-69-0" data-selected="false" role="gridcell" tabindex="-1">
69+
- `elem.classList.toggle("class")` -- adds the class if it doesn't exist, otherwise removes it.
7070
- `elem.classList.contains("class")` -- returns `true/false`, checks for the given class.
7171

72-
Besides that, `classList` is iterable, so we can list all classes like this:
72+
Besides, `classList` is iterable, so we can list all classes with `for..of`, like this:
7373

7474
```html run
7575
<body class="main page">
@@ -147,7 +147,7 @@ To set the full style as a string, there's a special property `style.cssText`:
147147
</script>
148148
```
149149

150-
We rarely use it, because such assignment removes all existing styles: it does not add, but replaces them. May occasionally delete something needed. But still can be done for new elements when we know we won't delete something important.
150+
This property is rarely used, because such assignment removes all existing styles: it does not add, but replaces them. May occasionally delete something needed. But we can safely use it for new elements, when we know we won't delete an existing style.
151151

152152
The same can be accomplished by setting an attribute: `div.setAttribute('style', 'color: red...')`.
153153
````

‎2-ui/5-loading/02-script-async-defer/article.md‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -188,8 +188,11 @@ But there are also essential differences between them:
188188
| `defer` | *Document order* (as they go in the document). | Execute after the document is loaded and parsed (they wait if needed), right before `DOMContentLoaded`. |
189189

190190
```warn header="Page without scripts should be usable"
191-
Please note that if you're using `defer`, then the page is visible before the script loads and enables all the graphical components.
191+
Please note that if you're using `defer`, then the page is visible *before* the script loads.
192192
193-
So, buttons should be disabled by CSS or by other means, to let the user
193+
So the user may read the page, but some graphical components are probably not ready yet.
194+
195+
There should be "loading" indication in proper places, not-working buttons disabled, to clearly show the user what's ready and what's not.
196+
```
194197

195198
In practice, `defer` is used for scripts that need the whole DOM and/or their relative execution order is important. And `async` is used for independent scripts, like counters or ads. And their relative execution order does not matter.

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /