jeena/en.javascript.info
1
0
Fork 0
Code Issues Pull requests Projects Packages Wiki Activity Actions

fixes

Browse source
This commit is contained in:
Ilya Kantor 2019-05-19 23:05:25 +03:00
parent b52dd6fd7b
commit 5c6a3f003f
2 changed files with 12 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

10
1-js/06-advanced-functions/08-settimeout-setinterval/article.md
View file

@ -387,9 +387,9 @@ For server-side JavaScript, that limitation does not exist, and there exist othe
### Allowing the browser to render ### Allowing the browser to render
Another benefit for in-browser scripts is that they can show a progress bar or something to the user. That's because the browser usually does all "repainting" after the script is complete. Another benefit of splitting heavy tasks for browser scripts is that we can show a progress bar or something to the user.
So if we do a single huge function then even if it changes something, the changes are not reflected in the document till it finishes. Usually the browser does all "repainting" after the currently running code is complete. So if we do a single huge function that changes many elements, the changes are not painted out till it finishes.
Here's the demo: Here's the demo:
```html run ```html run
@ -402,7 +402,7 @@ Here's the demo:
for (let j = 0; j < 1e6; j++) { for (let j = 0; j < 1e6; j++) {
i++; i++;
// put the current i into the <div> // put the current i into the <div>
// (we'll talk more about innerHTML in the specific chapter, should be obvious here) // (we'll talk about innerHTML in the specific chapter, it just writes into element here)
progress.innerHTML = i; progress.innerHTML = i;
} }
} }
@ -446,9 +446,9 @@ Now the `<div>` shows increasing values of `i`.
- Methods `setInterval(func, delay, ...args)` and `setTimeout(func, delay, ...args)` allow to run the `func` regularly/once after `delay` milliseconds. - Methods `setInterval(func, delay, ...args)` and `setTimeout(func, delay, ...args)` allow to run the `func` regularly/once after `delay` milliseconds.
- To cancel the execution, we should call `clearInterval/clearTimeout` with the value returned by `setInterval/setTimeout`. - To cancel the execution, we should call `clearInterval/clearTimeout` with the value returned by `setInterval/setTimeout`.
- Nested `setTimeout` calls is a more flexible alternative to `setInterval`. Also they can guarantee the minimal time *between* the executions. - Nested `setTimeout` calls is a more flexible alternative to `setInterval`. Also they can guarantee the minimal time *between* the executions.
- Zero-timeout scheduling `setTimeout(...,0)` is used to schedule the call "as soon as possible, but after the current code is complete". - Zero-timeout scheduling `setTimeout(func, 0)` (the same as `setTimeout(func)`) is used to schedule the call "as soon as possible, but after the current code is complete".
Some use cases of `setTimeout(...,0)`: Some use cases of `setTimeout(func)`:
- To split CPU-hungry tasks into pieces, so that the script doesn't "hang" - To split CPU-hungry tasks into pieces, so that the script doesn't "hang"
- To let the browser do something else while the process is going on (paint the progress bar). - To let the browser do something else while the process is going on (paint the progress bar).

12
6-data-storage/02-localstorage/article.md
View file

@ -7,7 +7,7 @@ What's interesting about them is that the data survives a page refresh (for `ses
We already have cookies. Why additional objects? We already have cookies. Why additional objects?
- Unlike cookies, web storage objects are not sent to server with each request. Because of that, we can store much more. Most browsers allow at least 2 megabytes of data (or more) and have settings to configure that. - Unlike cookies, web storage objects are not sent to server with each request. Because of that, we can store much more. Most browsers allow at least 2 megabytes of data (or more) and have settings to configure that.
- The server can't manipulate storage objects via HTTP headers, everything's done in JavaScript. - Also unlike cookies, the server can't manipulate storage objects via HTTP headers. Everything's done in JavaScript.
- The storage is bound to the origin (domain/protocol/port triplet). That is, different protocols or subdomains infer different storage objects, they can't access data from each other. - The storage is bound to the origin (domain/protocol/port triplet). That is, different protocols or subdomains infer different storage objects, they can't access data from each other.
Both storage objects provide same methods and properties: Both storage objects provide same methods and properties:
@ -19,6 +19,8 @@ Both storage objects provide same methods and properties:
- `key(index)` -- get the key on a given position. - `key(index)` -- get the key on a given position.
- `length` -- the number of stored items. - `length` -- the number of stored items.
As you can see, it's like a `Map` colection (`setItem/getItem/removeItem`), but also keeps elements order and allows to access by index with `key(index)`.
Let's see how it works. Let's see how it works.
## localStorage demo ## localStorage demo
@ -71,11 +73,11 @@ That's allowed for historical reasons, and mostly works, but generally not recom
## Looping over keys ## Looping over keys
Methods provide get/set/remove functionality. But how to get all the keys? As we've seen, the methods provide get/set/remove functionality. But how to get all saved values or keys?
Unfortunately, storage objects are not iterable. Unfortunately, storage objects are not iterable.
One way is to use "array-like" iteration: One way is to loop over them as over an array:
```js run ```js run
for(let i=0; i<localStorage.length; i++) { for(let i=0; i<localStorage.length; i++) {
@ -84,9 +86,9 @@ for(let i=0; i<localStorage.length; i++) {
} }
``` ```
Another way is to use object-specific `for key in localStorage` loop. Another way is to use `for key in localStorage` loop, just as we do with regular objects.
That iterates over keys, but also outputs few built-in fields that we don't need: It iterates over keys, but also outputs few built-in fields that we don't need:
```js run ```js run
// bad try // bad try