From f723253f784ef4f0dab782e04dc18e62ee4df65d Mon Sep 17 00:00:00 2001 From: joaquinelio Date: Sun, 28 Mar 2021 00:08:17 -0300 Subject: [PATCH 01/26] transpiler def --- 1-js/03-code-quality/06-polyfills/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/03-code-quality/06-polyfills/article.md b/1-js/03-code-quality/06-polyfills/article.md index af38faad2..9d119132e 100644 --- a/1-js/03-code-quality/06-polyfills/article.md +++ b/1-js/03-code-quality/06-polyfills/article.md @@ -22,7 +22,7 @@ Here, in this chapter, our purpose is to get the gist of how they work, and thei ## Transpilers -A [transpiler](https://en.wikipedia.org/wiki/Source-to-source_compiler) is a special piece of software that can parse ("read and understand") modern code, and rewrite it using older syntax constructs, so that the result would be the same. +A [transpiler](https://en.wikipedia.org/wiki/Source-to-source_compiler) is a special piece of software that can parse ("read and understand") modern code, and rewrite it using syntax constructs that the target engine (even oudated ones) can run. E.g. JavaScript before year 2020 didn't have the "nullish coalescing operator" `??`. So, if a visitor uses an outdated browser, it may fail to understand the code like `height = height ?? 100`. From 3d88d3322e97c06c3cbd09bb58f6a025351130a6 Mon Sep 17 00:00:00 2001 From: Z Yin Date: Sun, 13 Jun 2021 16:48:40 -0400 Subject: [PATCH 02/26] Update article.md --- 1-js/05-data-types/02-number/article.md | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/1-js/05-data-types/02-number/article.md b/1-js/05-data-types/02-number/article.md index 6fd513f43..6f9ddd953 100644 --- a/1-js/05-data-types/02-number/article.md +++ b/1-js/05-data-types/02-number/article.md @@ -37,8 +37,8 @@ alert( 7.3e9 ); // 7.3 billions (same as 7300000000 or 7_300_000_000) In other words, `e` multiplies the number by `1` with the given zeroes count. ```js -1e3 = 1 * 1000 // e3 means *1000 -1.23e6 = 1.23 * 1000000 // e6 means *1000000 +1e3 === 1 * 1000; // e3 means *1000 +1.23e6 === 1.23 * 1000000; // e6 means *1000000 ``` Now let's write something very small. Say, 1 microsecond (one millionth of a second): @@ -59,10 +59,10 @@ In other words, a negative number after `"e"` means a division by 1 with the giv ```js // -3 divides by 1 with 3 zeroes -1e-3 = 1 / 1000 (=0.001) +1e-3 === 1 / 1000; // 0.001 // -6 divides by 1 with 6 zeroes -1.23e-6 = 1.23 / 1000000 (=0.00000123) +1.23e-6 === 1.23 / 1000000; // 0.00000123 ``` ### Hex, binary and octal numbers @@ -118,6 +118,7 @@ Please note that two dots in `123456..toString(36)` is not a typo. If we want to If we placed a single dot: `123456.toString(36)`, then there would be an error, because JavaScript syntax implies the decimal part after the first dot. And if we place one more dot, then JavaScript knows that the decimal part is empty and now goes the method. Also could write `(123456).toString(36)`. + ``` ## Rounding From 2dce19e3e9bc37d2e473e137157ab48c99340676 Mon Sep 17 00:00:00 2001 From: joaquinelio Date: Wed, 16 Jun 2021 02:05:38 -0300 Subject: [PATCH 03/26] "inserts into" instead of "appends to" --- 1-js/11-async/01-callbacks/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/11-async/01-callbacks/article.md b/1-js/11-async/01-callbacks/article.md index 344d92b74..9432e860b 100644 --- a/1-js/11-async/01-callbacks/article.md +++ b/1-js/11-async/01-callbacks/article.md @@ -28,7 +28,7 @@ function loadScript(src) { } ``` -It appends to the document the new, dynamically created, tag ` ``` +The `onkeydown` handler here uses `checkPhoneKey` to check for the key pressed. If it's valid (from `0..9` or one of `+-()`), then it returns `true`, otherwise `false`. + +As we know, the `false` value returned from the event handler, assigned using a DOM property or an attribute, such as above, prevents the default action, so nothing appears in the `` for keys that don't pass the test. (The `true` value returned doesn't affect anything, only returning `false` matters) + Please note that special keys, such as `key:Backspace`, `key:Left`, `key:Right`, `key:Ctrl+V`, do not work in the input. That's a side-effect of the strict filter `checkPhoneKey`. Let's relax it a little bit: @@ -153,8 +157,8 @@ Let's relax it a little bit: ```html autorun height=60 run From ff53f0638b4fcf9a4ab851b175d28d32a465f42f Mon Sep 17 00:00:00 2001 From: Ilya Kantor Date: Sat, 19 Jun 2021 18:48:57 +0300 Subject: [PATCH 15/26] minor fixes --- 2-ui/3-event-details/7-keyboard-events/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/2-ui/3-event-details/7-keyboard-events/article.md b/2-ui/3-event-details/7-keyboard-events/article.md index b4b398062..d7892b683 100644 --- a/2-ui/3-event-details/7-keyboard-events/article.md +++ b/2-ui/3-event-details/7-keyboard-events/article.md @@ -151,7 +151,7 @@ As we know, the `false` value returned from the event handler, assigned using a Please note that special keys, such as `key:Backspace`, `key:Left`, `key:Right`, `key:Ctrl+V`, do not work in the input. That's a side-effect of the strict filter `checkPhoneKey`. -Let's relax it a little bit: +Let's relax it a little bit by allowing `key:Left`, `key:Right` arrows and `key:Delete`, `key:Backspace`: ```html autorun height=60 run From cf82cc3bcedc08eeb545a9caf7a246170d23d6c6 Mon Sep 17 00:00:00 2001 From: Ilya Kantor Date: Sat, 19 Jun 2021 18:49:46 +0300 Subject: [PATCH 16/26] minor fixes --- 2-ui/3-event-details/7-keyboard-events/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/2-ui/3-event-details/7-keyboard-events/article.md b/2-ui/3-event-details/7-keyboard-events/article.md index d7892b683..6318fde21 100644 --- a/2-ui/3-event-details/7-keyboard-events/article.md +++ b/2-ui/3-event-details/7-keyboard-events/article.md @@ -149,7 +149,7 @@ The `onkeydown` handler here uses `checkPhoneKey` to check for the key pressed. As we know, the `false` value returned from the event handler, assigned using a DOM property or an attribute, such as above, prevents the default action, so nothing appears in the `` for keys that don't pass the test. (The `true` value returned doesn't affect anything, only returning `false` matters) -Please note that special keys, such as `key:Backspace`, `key:Left`, `key:Right`, `key:Ctrl+V`, do not work in the input. That's a side-effect of the strict filter `checkPhoneKey`. +Please note that special keys, such as `key:Backspace`, `key:Left`, `key:Right`, do not work in the input. That's a side-effect of the strict filter `checkPhoneKey`. Let's relax it a little bit by allowing `key:Left`, `key:Right` arrows and `key:Delete`, `key:Backspace`: From 85282ef4ad90e33e6b0a35bdf1fe062cd262693c Mon Sep 17 00:00:00 2001 From: Ilya Kantor Date: Sat, 19 Jun 2021 18:50:12 +0300 Subject: [PATCH 17/26] minor fixes --- 2-ui/3-event-details/7-keyboard-events/article.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/2-ui/3-event-details/7-keyboard-events/article.md b/2-ui/3-event-details/7-keyboard-events/article.md index 6318fde21..78c4bf1f5 100644 --- a/2-ui/3-event-details/7-keyboard-events/article.md +++ b/2-ui/3-event-details/7-keyboard-events/article.md @@ -149,9 +149,9 @@ The `onkeydown` handler here uses `checkPhoneKey` to check for the key pressed. As we know, the `false` value returned from the event handler, assigned using a DOM property or an attribute, such as above, prevents the default action, so nothing appears in the `` for keys that don't pass the test. (The `true` value returned doesn't affect anything, only returning `false` matters) -Please note that special keys, such as `key:Backspace`, `key:Left`, `key:Right`, do not work in the input. That's a side-effect of the strict filter `checkPhoneKey`. +Please note that special keys, such as `key:Backspace`, `key:Left`, `key:Right`, do not work in the input. That's a side-effect of the strict filter `checkPhoneKey`. These keys make it return `false`. -Let's relax it a little bit by allowing `key:Left`, `key:Right` arrows and `key:Delete`, `key:Backspace`: +Let's relax the filter a little bit by allowing `key:Left`, `key:Right` arrows and `key:Delete`, `key:Backspace`: ```html autorun height=60 run From a40ca9a4a3b7624ca95096df9950ea30c0853e95 Mon Sep 17 00:00:00 2001 From: Ilya Kantor Date: Sat, 19 Jun 2021 18:50:41 +0300 Subject: [PATCH 18/26] minor fixes --- 2-ui/3-event-details/7-keyboard-events/article.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/2-ui/3-event-details/7-keyboard-events/article.md b/2-ui/3-event-details/7-keyboard-events/article.md index 78c4bf1f5..9639239cd 100644 --- a/2-ui/3-event-details/7-keyboard-events/article.md +++ b/2-ui/3-event-details/7-keyboard-events/article.md @@ -151,8 +151,7 @@ As we know, the `false` value returned from the event handler, assigned using a Please note that special keys, such as `key:Backspace`, `key:Left`, `key:Right`, do not work in the input. That's a side-effect of the strict filter `checkPhoneKey`. These keys make it return `false`. -Let's relax the filter a little bit by allowing `key:Left`, `key:Right` arrows and `key:Delete`, `key:Backspace`: - +Let's relax the filter a little bit by allowing arrow keys `key:Left`, `key:Right` and `key:Delete`, `key:Backspace`: ```html autorun height=60 run From df6e5a4522e83a071d5c0013648d2839f5b68345 Mon Sep 17 00:00:00 2001 From: Ilya Kantor Date: Sat, 19 Jun 2021 18:53:06 +0300 Subject: [PATCH 20/26] minor fixes --- 2-ui/3-event-details/7-keyboard-events/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/2-ui/3-event-details/7-keyboard-events/article.md b/2-ui/3-event-details/7-keyboard-events/article.md index f683e1f7e..cea96a101 100644 --- a/2-ui/3-event-details/7-keyboard-events/article.md +++ b/2-ui/3-event-details/7-keyboard-events/article.md @@ -165,7 +165,7 @@ function checkPhoneKey(key) { Now arrows and deletion works well. -...But we still can enter anything by using a mouse and right-click + Paste. So the filter is not 100% reliable. We can just let it be like that, because most of time it works. Or an alternative approach would be to track the `input` event -- it triggers after any modification. There we can check the new value and highlight/modify it when it's invalid. +Even though we have the key filter, one still can enter anything using a mouse and right-click + Paste. So the filter is not 100% reliable. We can just let it be like that, because most of time it works. Or an alternative approach would be to track the `input` event -- it triggers after any modification. There we can check the new value and highlight/modify it when it's invalid. ## Legacy From e769408d640e325233fe46c2d30b83edf9b3334d Mon Sep 17 00:00:00 2001 From: Ilya Kantor Date: Sat, 19 Jun 2021 18:55:00 +0300 Subject: [PATCH 21/26] minor fixes --- 2-ui/3-event-details/7-keyboard-events/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/2-ui/3-event-details/7-keyboard-events/article.md b/2-ui/3-event-details/7-keyboard-events/article.md index cea96a101..0af3cee42 100644 --- a/2-ui/3-event-details/7-keyboard-events/article.md +++ b/2-ui/3-event-details/7-keyboard-events/article.md @@ -165,7 +165,7 @@ function checkPhoneKey(key) { Now arrows and deletion works well. -Even though we have the key filter, one still can enter anything using a mouse and right-click + Paste. So the filter is not 100% reliable. We can just let it be like that, because most of time it works. Or an alternative approach would be to track the `input` event -- it triggers after any modification. There we can check the new value and highlight/modify it when it's invalid. +Even though we have the key filter, one still can enter anything using a mouse and right-click + Paste. So the filter is not 100% reliable. The more reliable approach would be to track the `input` event -- it triggers after any modification. There we can check the new value and highlight/modify it when it's invalid. ## Legacy From de81cb4809ca3147a6c5cede2fb60c9af1e5dc54 Mon Sep 17 00:00:00 2001 From: Ilya Kantor Date: Sat, 19 Jun 2021 18:58:37 +0300 Subject: [PATCH 22/26] minor fixes --- 2-ui/3-event-details/7-keyboard-events/article.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/2-ui/3-event-details/7-keyboard-events/article.md b/2-ui/3-event-details/7-keyboard-events/article.md index 0af3cee42..8a15e657a 100644 --- a/2-ui/3-event-details/7-keyboard-events/article.md +++ b/2-ui/3-event-details/7-keyboard-events/article.md @@ -165,7 +165,9 @@ function checkPhoneKey(key) { Now arrows and deletion works well. -Even though we have the key filter, one still can enter anything using a mouse and right-click + Paste. So the filter is not 100% reliable. The more reliable approach would be to track the `input` event -- it triggers after any modification. There we can check the new value and highlight/modify it when it's invalid. +Even though we have the key filter, one still can enter anything using a mouse and right-click + Paste. So the filter is not 100% reliable. + +The alternative approach would be to track the `oninput` event -- it triggers *after* any modification. There we can check the new `input.value` and highlight/modify the `` when it's invalid. Or we can use both event handlers together. ## Legacy From 7dacfd411b4d99536b02df5200a4e4f5078adff3 Mon Sep 17 00:00:00 2001 From: Ilya Kantor Date: Sat, 19 Jun 2021 18:59:04 +0300 Subject: [PATCH 23/26] minor fixes --- 2-ui/3-event-details/7-keyboard-events/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/2-ui/3-event-details/7-keyboard-events/article.md b/2-ui/3-event-details/7-keyboard-events/article.md index 8a15e657a..bdfcff308 100644 --- a/2-ui/3-event-details/7-keyboard-events/article.md +++ b/2-ui/3-event-details/7-keyboard-events/article.md @@ -167,7 +167,7 @@ Now arrows and deletion works well. Even though we have the key filter, one still can enter anything using a mouse and right-click + Paste. So the filter is not 100% reliable. -The alternative approach would be to track the `oninput` event -- it triggers *after* any modification. There we can check the new `input.value` and highlight/modify the `` when it's invalid. Or we can use both event handlers together. +The alternative approach would be to track the `oninput` event -- it triggers *after* any modification. There we can check the new `input.value` and modify it/highlight the `` when it's invalid. Or we can use both event handlers together. ## Legacy From 36613935fea17fe8e0e85dd14c9af0dd3d5b5ac8 Mon Sep 17 00:00:00 2001 From: Ilya Kantor Date: Sat, 19 Jun 2021 18:59:39 +0300 Subject: [PATCH 24/26] minor fixes --- 2-ui/3-event-details/7-keyboard-events/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/2-ui/3-event-details/7-keyboard-events/article.md b/2-ui/3-event-details/7-keyboard-events/article.md index bdfcff308..51c1618f6 100644 --- a/2-ui/3-event-details/7-keyboard-events/article.md +++ b/2-ui/3-event-details/7-keyboard-events/article.md @@ -165,7 +165,7 @@ function checkPhoneKey(key) { Now arrows and deletion works well. -Even though we have the key filter, one still can enter anything using a mouse and right-click + Paste. So the filter is not 100% reliable. +Even though we have the key filter, one still can enter anything using a mouse and right-click + Paste. Mobile devices provide other means to enter values. So the filter is not 100% reliable. The alternative approach would be to track the `oninput` event -- it triggers *after* any modification. There we can check the new `input.value` and modify it/highlight the `` when it's invalid. Or we can use both event handlers together. From 52eaa63aaa0f7f0bdcd739cc3f7e915f32dfd249 Mon Sep 17 00:00:00 2001 From: joaquinelio Date: Sat, 19 Jun 2021 21:21:24 -0300 Subject: [PATCH 25/26] typo --- 1-js/04-object-basics/09-object-toprimitive/article.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/1-js/04-object-basics/09-object-toprimitive/article.md b/1-js/04-object-basics/09-object-toprimitive/article.md index b0605d44f..3e52a1d51 100644 --- a/1-js/04-object-basics/09-object-toprimitive/article.md +++ b/1-js/04-object-basics/09-object-toprimitive/article.md @@ -9,7 +9,7 @@ In case of such operations, objects are auto-converted to primitives, and then t That's an important limitation, as the result of `obj1 + obj2` can't be another object! -E.g. we can't make objects representing vectors or matrices (or archievements or whatever), add them and expect a "summed" object as the result. Such architectural feats are automatically "off the board". +E.g. we can't make objects representing vectors or matrices (or achievements or whatever), add them and expect a "summed" object as the result. Such architectural feats are automatically "off the board". So, because we can't do much here, there's no maths with objects in real projects. When it happens, it's usually because of a coding mistake. @@ -133,7 +133,7 @@ As we can see from the code, `user` becomes a self-descriptive string or a money If there's no `Symbol.toPrimitive` then JavaScript tries to find methods `toString` and `valueOf`: -- For the "string" hint: `toString`, and if it doesn't exist, then `valueOf` (so `toString` has the priority for stirng conversions). +- For the "string" hint: `toString`, and if it doesn't exist, then `valueOf` (so `toString` has the priority for string conversions). - For other hints: `valueOf`, and if it doesn't exist, then `toString` (so `valueOf` has the priority for maths). Methods `toString` and `valueOf` come from ancient times. They are not symbols (symbols did not exist that long ago), but rather "regular" string-named methods. They provide an alternative "old-style" way to implement the conversion. @@ -274,4 +274,4 @@ The conversion algorithm is: In practice, it's often enough to implement only `obj.toString()` as a "catch-all" method for string conversions that should return a "human-readable" representation of an object, for logging or debugging purposes. -As for math operations, JavaScript doesn't provide a way to "override" them using methods, so real life projects rarely use them on objects. \ No newline at end of file +As for math operations, JavaScript doesn't provide a way to "override" them using methods, so real life projects rarely use them on objects. From 9847492838326ea9c161aebeb1ebb6749bd1f5cd Mon Sep 17 00:00:00 2001 From: Elena Valeeva Date: Sun, 20 Jun 2021 08:12:59 +0300 Subject: [PATCH 26/26] Typo in Ch 15 Functions --- 1-js/02-first-steps/15-function-basics/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/02-first-steps/15-function-basics/article.md b/1-js/02-first-steps/15-function-basics/article.md index ac6f1f47c..09ad90dc0 100644 --- a/1-js/02-first-steps/15-function-basics/article.md +++ b/1-js/02-first-steps/15-function-basics/article.md @@ -247,7 +247,7 @@ function showMessage(text) { showMessage(); // empty message ``` -...Or we could use the `??` operator: +...Or we could use the `||` operator: ```js function showMessage(text) {