Merge pull request #54 from javascript-tutorial/sync-d35baee3

Sync with upstream @ d35baee

Author: 1H0

1-js/02-first-steps/04-variables/article.md

@@ -79,10 +79,17 @@ let user = 'John'
   , message = 'Hello';
 ```
 
+<<<<<<< HEAD
 Technisch gesehen machen alle diese Varianten dasselbe. Es ist also eine Frage des persönlichen Geschmacks und der Ästhetik.
 
 ````smart header="`var` anstatt `let`"
 In älteren Scripts findest du womöglich noch ein anderes Schlüsselwort: `var` anstatt `let`:
+=======
+Technically, all these variants do the same thing. So, it's a matter of personal taste and aesthetics.
+
+````smart header="`var` instead of `let`"
+In older scripts, you may also find another keyword: `var` instead of `let`:
+>>>>>>> d35baee32dcce127a69325c274799bb81db1afd8
 
 ```js
 *!*var*/!* message = 'Hello';
@@ -135,8 +142,27 @@ alert(hello); // Hello world!
 alert(message); // Hello world!
 ```
 
+<<<<<<< HEAD
 ```smart header="Funktionale Sprachen"
 Interessant ist, dass es [funktionale](https://de.wikipedia.org/wiki/Funktionale_Programmierung) Programmiersprachen wie [Scala](http://www.scala-lang.org/) oder [Erlang](http://www.erlang.org/) gibt, die das Ändern von Variablenwerten verbieten.
+=======
+````warn header="Declaring twice triggers an error"
+A variable should be declared only once.
+
+A repeated declaration of the same variable is an error:
+
+```js run
+let message = "This";
+
+// repeated 'let' leads to an error
+let message = "That"; // SyntaxError: 'message' has already been declared
+```
+So, we should declare a variable once and then refer to it without `let`.
+````
+
+```smart header="Functional languages"
+It's interesting to note that there exist [functional](https://en.wikipedia.org/wiki/Functional_programming) programming languages, like [Scala](http://www.scala-lang.org/) or [Erlang](http://www.erlang.org/) that forbid changing variable values.
+>>>>>>> d35baee32dcce127a69325c274799bb81db1afd8
 
 In solchen Sprachen ist der Wert, sobald er "in der Kiste" gespeichert ist, für immer da. Wenn wir etwas anderes speichern wollen, zwingt uns die Sprache dazu, eine neue Kiste zu erstellen (eine neue Variable zu deklarieren). Wir können die alte nicht wiederverwenden.
 
@@ -190,7 +216,11 @@ let имя = '...';
 let 我 = '...';
 ```
 
+<<<<<<< HEAD
 Technisch gesehen gibt es hier keinen Fehler, solche Namen sind erlaubt, aber es gibt eine internationale Tradition, Englisch in Variablennamen zu verwenden. Selbst wenn wir ein kleines Script schreiben, kann es ein langes Leben vor sich haben. Menschen aus anderen Ländern müssen es vielleicht irgendwann einmal lesen.
+=======
+Technically, there is no error here. Such names are allowed, but there is an international convention to use English in variable names. Even if we're writing a small script, it may have a long life ahead. People from other countries may need to read it some time.
+>>>>>>> d35baee32dcce127a69325c274799bb81db1afd8
 ````
 
 ````warn header="Reservierte Namen"

1-js/03-code-quality/02-coding-style/article.md

@@ -285,7 +285,7 @@ Of course, a team can always write their own style guide, but usually there's no
 
 Some popular choices:
 
-- [Google JavaScript Style Guide](https://google.github.io/styleguide/javascriptguide.xml)
+- [Google JavaScript Style Guide](https://google.github.io/styleguide/jsguide.html)
 - [Airbnb JavaScript Style Guide](https://github.com/airbnb/javascript)
 - [Idiomatic.JS](https://github.com/rwaldron/idiomatic.js)
 - [StandardJS](https://standardjs.com/)

1-js/03-code-quality/05-testing-mocha/beforeafter.view/test.js

@@ -1,5 +1,11 @@
 describe("test", function() {
+  
+   // Mocha usually waits for the tests for 2 seconds before considering them wrong
+  
+  this.timeout(200000); // With this code we increase this - in this case to 200,000 milliseconds
 
+  // This is because of the "alert" function, because if you delay pressing the "OK" button the tests will not pass!
+  
   before(() => alert("Testing started – before all tests"));
   after(() => alert("Testing finished – after all tests"));
 

1-js/06-advanced-functions/02-rest-parameters-spread/article.md

@@ -227,7 +227,7 @@ So, for the task of turning something into an array, `Array.from` tends to be mo
 
 ## Get a new copy of an array/object
 
-Remember when we talked about `Object.assign()` [in the past](https://javascript.info/object#cloning-and-merging-object-assign)?
+Remember when we talked about `Object.assign()` [in the past](info:object-copy#cloning-and-merging-object-assign)?
 
 It is possible to do the same thing with the spread syntax.
 

1-js/06-advanced-functions/04-var/article.md

@@ -13,27 +13,18 @@ In the very first chapter about [variables](info:variables), we mentioned three
 2. `const`
 3. `var`
 
-`let` and `const` behave exactly the same way in terms of Lexical Environments.
-
-But `var` is a very different beast, that originates from very old times. It's generally not used in modern scripts, but still lurks in the old ones.
-
-If you don't plan on meeting such scripts you may even skip this chapter or postpone it, but then there's a chance that it bites you later.
-
-From the first sight, `var` behaves similar to `let`. That is, declares a variable:
+The `var` declaration is similar to `let`. Most of the time we can replace `let` by `var` or vice-versa and expect things to work:
 
 ```js run
-function sayHi() {
-  var phrase = "Hello"; // local variable, "var" instead of "let"
-
-  alert(phrase); // Hello
-}
+var message = "Hi";
+alert(message); // Hi
+```
 
-sayHi();
+But internally `var` is a very different beast, that originates from very old times. It's generally not used in modern scripts, but still lurks in the old ones.
 
-alert(phrase); // Error, phrase is not defined
-```
+If you don't plan on meeting such scripts you may even skip this chapter or postpone it.
 
-...But here are the differences.
+On the other hand, it's important to understand differences when migrating old scripts from `var` to `let`, to avoid odd errors.
 
 ## "var" has no block scope
 
@@ -94,7 +85,27 @@ alert(phrase); // Error: phrase is not defined (Check the Developer Console)
 
 As we can see, `var` pierces through `if`, `for` or other code blocks. That's because a long time ago in JavaScript blocks had no Lexical Environments. And `var` is a remnant of that.
 
-## "var" declarations are processed at the function start
+## "var" tolerates redeclarations
+
+If we declare the same variable with `let` twice in the same scope, that's an error:
+
+```js run
+let user;
+let user; // SyntaxError: 'user' has already been declared
+```
+
+With `var`, we can redeclare a variable any number of times. If we use `var` with an already-declared variable, it's just ignored:
+
+```js run
+var user = "Pete";
+
+var user = "John"; // this "var" does nothing (already declared)
+// ...it doesn't trigger an error
+
+alert(user); // John
+```
+
+## "var" variables can be declared below their use
 
 `var` declarations are processed when the function starts (or script starts for globals).
 

2-ui/1-document/09-size-and-scroll/article.md

@@ -211,7 +211,7 @@ If you click the element below, the code `elem.scrollTop += 10` executes. That m
 <div onclick="this.scrollTop+=10" style="cursor:pointer;border:1px solid black;width:100px;height:80px;overflow:auto">Click<br>Me<br>1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9</div>
 ```
 
-Setting `scrollTop` to `0` or `Infinity` will make the element scroll to the very top/bottom respectively.
+Setting `scrollTop` to `0` or a big value, such as `1e9` will make the element scroll to the very top/bottom respectively.
 ````
 
 ## Don't take width/height from CSS

2-ui/2-events/02-bubbling-and-capturing/article.md

@@ -181,7 +181,7 @@ The code sets click handlers on *every* element in the document to see which one
 If you click on `<p>`, then the sequence is:
 
 1. `HTML` -> `BODY` -> `FORM` -> `DIV` (capturing phase, the first listener):
-2. `P` (target phrase, triggers two times, as we've set two listeners: capturing and bubbling)
+2. `P` (target phase, triggers two times, as we've set two listeners: capturing and bubbling)
 3. `DIV` -> `FORM` -> `BODY` -> `HTML` (bubbling phase, the second listener).
 
 There's a property `event.eventPhase` that tells us the number of the phase on which the event was caught. But it's rarely used, because we usually know it in the handler.

2-ui/3-event-details/4-mouse-drag-and-drop/ball2.view/index.html

@@ -13,7 +13,7 @@
 
 
   <script>
-    ball.onmousedown = function(event) {s
+    ball.onmousedown = function(event) {
       ball.style.position = 'absolute';
       ball.style.zIndex = 1000;
       document.body.appendChild(ball);