From 8da054b106610e5bc3f9b78f4ad5de91602ddaf2 Mon Sep 17 00:00:00 2001 From: Scott Martin <43204121+scott-ln@users.noreply.github.com> Date: Wed, 2 Oct 2019 11:57:50 +0100 Subject: [PATCH 1/7] Minor fixes for consistency --- 2-ui/1-document/01-browser-environment/article.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/2-ui/1-document/01-browser-environment/article.md b/2-ui/1-document/01-browser-environment/article.md index a8a3fd11..f680554d 100644 --- a/2-ui/1-document/01-browser-environment/article.md +++ b/2-ui/1-document/01-browser-environment/article.md @@ -1,6 +1,6 @@ # Browser environment, specs -The JavaScript language was initially created for web browsers. Since then, it has evolved and become a language with many uses and platforms. +The JavaScript language was initially created for web browsers. Since then it has evolved and become a language with many uses and platforms. A platform may be a browser, or a web-server or another *host*, even a coffee machine. Each of them provides platform-specific functionality. The JavaScript specification calls that a *host environment*. @@ -60,14 +60,14 @@ For instance, server-side scripts that download HTML pages and process them can ``` ```smart header="CSSOM for styling" -CSS rules and stylesheets are structured in a different way than HTML. There's a separate specification [CSSOM](https://www.w3.org/TR/cssom-1/) that explains how they are represented as objects, and how to read and write them. +CSS rules and stylesheets are structured in a different way than HTML. There's a separate specification, [CSS Object Model (CSSOM)](https://www.w3.org/TR/cssom-1/), that explains how they are represented as objects, and how to read and write them. CSSOM is used together with DOM when we modify style rules for the document. In practice though, CSSOM is rarely required, because usually CSS rules are static. We rarely need to add/remove CSS rules from JavaScript, but that's also possible. ``` -## BOM (Browser object model) +## BOM (Browser Object Model) -Browser Object Model (BOM) are additional objects provided by the browser (host environment) to work with everything except the document. +The Browser Object Model (BOM) represents additional objects provided by the browser (host environment) for working with everything except the document. For instance: From ca032771a8e1827175b9783b5ec24c23b9991eda Mon Sep 17 00:00:00 2001 From: Anurag Bhandari Date: Thu, 3 Oct 2019 09:34:00 +0530 Subject: [PATCH 2/7] Fix grammatical errors --- 5-network/05-fetch-crossorigin/article.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/5-network/05-fetch-crossorigin/article.md b/5-network/05-fetch-crossorigin/article.md index 67e83f56..f5a5f663 100644 --- a/5-network/05-fetch-crossorigin/article.md +++ b/5-network/05-fetch-crossorigin/article.md @@ -22,7 +22,7 @@ That policy is called "CORS": Cross-Origin Resource Sharing. ## Why CORS is needed? A brief history -CORS exists protect the internet from evil hackers. +CORS exists to protect the internet from evil hackers. Seriously. Let's make a very brief historical digression. @@ -149,7 +149,7 @@ As you can see, `Origin` header contains exactly the origin (domain/protocol/por The server can inspect the `Origin` and, if it agrees to accept such a request, adds a special header `Access-Control-Allow-Origin` to the response. That header should contain the allowed origin (in our case `https://javascript.info`), or a star `*`. Then the response is successful, otherwise an error. The browser plays the role of a trusted mediator here: -1. It ensures that the corrent `Origin` is sent with a cross-origin request. +1. It ensures that the correct `Origin` is sent with a cross-origin request. 2. It checks for permitting `Access-Control-Allow-Origin` in the response, if it exists, then JavaScript is allowed to access the response, otherwise it fails with an error. ![](xhr-another-domain.svg) @@ -203,13 +203,13 @@ With such `Access-Control-Expose-Headers` header, the script is allowed to read We can use any HTTP-method: not just `GET/POST`, but also `PATCH`, `DELETE` and others. -Some time ago no one could even assume that a webpage is able to do such requests. So there may exist webservices that treat a non-standard method as a signal: "That's not a browser". They can take it into account when checking access rights. +Some time ago no one could even imagine that a webpage could make such requests. So there may still exist webservices that treat a non-standard method as a signal: "That's not a browser". They can take it into account when checking access rights. So, to avoid misunderstandings, any "non-simple" request -- that couldn't be done in the old times, the browser does not make such requests right away. Before it sends a preliminary, so-called "preflight" request, asking for permission. A preflight request uses method `OPTIONS`, no body and two headers: -- `Access-Control-Request-Method` header has the method of an the non-simple request. +- `Access-Control-Request-Method` header has the method of the non-simple request. - `Access-Control-Request-Headers` header provides a comma-separated list of its non-simple HTTP-headers. If the server agrees to serve the requests, then it should respond with empty body, status 200 and headers: @@ -273,7 +273,7 @@ Access-Control-Allow-Headers: API-Key,Content-Type,If-Modified-Since,Cache-Contr Access-Control-Max-Age: 86400 ``` -Now the browser can see that `PATCH` in `Access-Control-Allow-Methods` and `Content-Type,API-Key` are in the list `Access-Control-Allow-Headers`, so it sends out the main request. +Now the browser can see that `PATCH` is in `Access-Control-Allow-Methods` and `Content-Type,API-Key` are in the list `Access-Control-Allow-Headers`, so it sends out the main request. Besides, the preflight response is cached for time, specified by `Access-Control-Max-Age` header (86400 seconds, one day), so subsequent requests will not cause a preflight. Assuming that they fit the cached allowances, they will be sent directly. From 918227fcba48dee8b6df1689b9cb9d311e45a0a0 Mon Sep 17 00:00:00 2001 From: paroche <46547072+paroche@users.noreply.github.com> Date: Thu, 3 Oct 2019 18:42:06 -0600 Subject: [PATCH 3/7] Update article.md Replaced ":"s with ","s. I edited these lines before, and thought they were a little awkward w/ ":"s, but didn't see fit to change it then. But now ","s seem clearly better. Think of it as successive approximations. --- 1-js/08-prototypes/04-prototype-methods/article.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/1-js/08-prototypes/04-prototype-methods/article.md b/1-js/08-prototypes/04-prototype-methods/article.md index 9f4b806d..c83756fa 100644 --- a/1-js/08-prototypes/04-prototype-methods/article.md +++ b/1-js/08-prototypes/04-prototype-methods/article.md @@ -72,8 +72,8 @@ Why so? That's for historical reasons. - The `"prototype"` property of a constructor function works since very ancient times. -- Later, in the year 2012: `Object.create` appeared in the standard. It gave the ability to create objects with a given prototype, but did not provide the ability to get/set it. So browsers implemented the non-standard `__proto__` accessor that allowed the user to get/set a prototype at any time. -- Later, in the year 2015: `Object.setPrototypeOf` and `Object.getPrototypeOf` were added to the standard, to perform the same functionality as `__proto__`. As `__proto__` was de-facto implemented everywhere, it was kind-of deprecated and made its way to the Annex B of the standard, that is: optional for non-browser environments. +- Later, in the year 2012, `Object.create` appeared in the standard. It gave the ability to create objects with a given prototype, but did not provide the ability to get/set it. So browsers implemented the non-standard `__proto__` accessor that allowed the user to get/set a prototype at any time. +- Later, in the year 2015, `Object.setPrototypeOf` and `Object.getPrototypeOf` were added to the standard, to perform the same functionality as `__proto__`. As `__proto__` was de-facto implemented everywhere, it was kind-of deprecated and made its way to the Annex B of the standard, that is: optional for non-browser environments. As of now we have all these ways at our disposal. From 45c2e1d91ae084ff37d91496e3468cfcc71d03b0 Mon Sep 17 00:00:00 2001 From: paroche <46547072+paroche@users.noreply.github.com> Date: Fri, 4 Oct 2019 15:51:09 -0600 Subject: [PATCH 4/7] Update article.md Add results of 2nd alert --- 1-js/09-classes/03-static-properties-methods/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/09-classes/03-static-properties-methods/article.md b/1-js/09-classes/03-static-properties-methods/article.md index 583fabcf..8e08514f 100644 --- a/1-js/09-classes/03-static-properties-methods/article.md +++ b/1-js/09-classes/03-static-properties-methods/article.md @@ -192,7 +192,7 @@ class Rabbit extends Animal {} alert(Rabbit.__proto__ === Animal); // true // for regular methods -alert(Rabbit.prototype.__proto__ === Animal.prototype); +alert(Rabbit.prototype.__proto__ === Animal.prototype); // true ``` ## Summary From 4d1a006591d5ab10784a0f363ab3a5454a582184 Mon Sep 17 00:00:00 2001 From: paroche <46547072+paroche@users.noreply.github.com> Date: Fri, 4 Oct 2019 19:50:29 -0600 Subject: [PATCH 5/7] Update article.md object constructor -> the object's constructor --- 1-js/09-classes/05-extend-natives/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/09-classes/05-extend-natives/article.md b/1-js/09-classes/05-extend-natives/article.md index 2dc4902b..24fa5cbb 100644 --- a/1-js/09-classes/05-extend-natives/article.md +++ b/1-js/09-classes/05-extend-natives/article.md @@ -21,7 +21,7 @@ alert(filteredArr); // 10, 50 alert(filteredArr.isEmpty()); // false ``` -Please note a very interesting thing. Built-in methods like `filter`, `map` and others -- return new objects of exactly the inherited type `PowerArray`. Their internal implementation uses object `constructor` property for that. +Please note a very interesting thing. Built-in methods like `filter`, `map` and others -- return new objects of exactly the inherited type `PowerArray`. Their internal implementation uses the object's `constructor` property for that. In the example above, ```js From 947cdbb03134fa05d0578f4b93bb799915fbbbbb Mon Sep 17 00:00:00 2001 From: paroche <46547072+paroche@users.noreply.github.com> Date: Fri, 4 Oct 2019 20:08:40 -0600 Subject: [PATCH 6/7] Update article.md 'chapter' -> 'article' --- 1-js/09-classes/05-extend-natives/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/09-classes/05-extend-natives/article.md b/1-js/09-classes/05-extend-natives/article.md index 2dc4902b..c9e9c939 100644 --- a/1-js/09-classes/05-extend-natives/article.md +++ b/1-js/09-classes/05-extend-natives/article.md @@ -74,7 +74,7 @@ Built-in objects have their own static methods, for instance `Object.keys`, `Arr As we already know, native classes extend each other. For instance, `Array` extends `Object`. -Normally, when one class extends another, both static and non-static methods are inherited. That was thoroughly explained in the chapter [](info:static-properties-methods#statics-and-inheritance). +Normally, when one class extends another, both static and non-static methods are inherited. That was thoroughly explained in the article [](info:static-properties-methods#statics-and-inheritance). But built-in classes are an exception. They don't inherit statics from each other. From 5c515bbfad6c745333ddc82bf1b677eea18672c5 Mon Sep 17 00:00:00 2001 From: Elmore Cheng <9206414+ikeq@users.noreply.github.com> Date: Sun, 6 Oct 2019 17:06:03 +0800 Subject: [PATCH 7/7] Remove unnecessary code syntax inside buttons --- 2-ui/1-document/10-size-and-scroll-window/article.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/2-ui/1-document/10-size-and-scroll-window/article.md b/2-ui/1-document/10-size-and-scroll-window/article.md index edfb8bcd..30605615 100644 --- a/2-ui/1-document/10-size-and-scroll-window/article.md +++ b/2-ui/1-document/10-size-and-scroll-window/article.md @@ -132,9 +132,9 @@ To make the document unscrollable, it's enough to set `document.body.style.overf ```online Try it: - + - + The first button freezes the scroll, the second one resumes it. ```