Merge pull request #260 from javascript-tutorial/sync-99e59ba6

Sync with upstream @ 99e59ba

Author: HachemiH

1-js/01-getting-started/1-intro/article.md

@@ -67,7 +67,12 @@ Les exemples de telles restrictions sont:
 
     Les navigateurs modernes lui permettent de fonctionner avec des fichiers, mais l'accès est limité et n'est fourni que si l'utilisateur effectue certaines actions, comme «déposer» un fichier dans une fenêtre de navigateur ou le sélectionner via une balise `<input>`.
 
+<<<<<<< HEAD
     Il existe des moyens d’interagir avec une webcam/microphone et d’autres appareils, mais ils nécessitent une autorisation explicite de l’utilisateur. Ainsi, une page compatible avec JavaScript ne permet pas d'activer une caméra Web, d'observer l'environnement et d'envoyer les informations à la [NSA](https://fr.wikipedia.org/wiki/National_Security_Agency).
+=======
+    There are ways to interact with camera/microphone and other devices, but they require a user's explicit permission. So a JavaScript-enabled page may not sneakily enable a web-camera, observe the surroundings and send the information to the [NSA](https://en.wikipedia.org/wiki/National_Security_Agency).
+- Different tabs/windows generally do not know about each other. Sometimes they do, for example when one window uses JavaScript to open the other one. But even in this case, JavaScript from one page may not access the other if they come from different sites (from a different domain, protocol or port).
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
 - Différents onglets / fenêtres ne se connaissent généralement pas. Parfois, ils se croisent, par exemple lorsqu'une fenêtre utilise JavaScript pour ouvrir l'autre. Mais même dans ce cas, le JavaScript d'une page ne peut pas accéder à l'autre si elle provient de sites différents (provenant d'un autre domaine, protocole ou port).
 

1-js/01-getting-started/4-devtools/article.md

@@ -8,7 +8,11 @@ Pour voir les erreurs et obtenir beaucoup d’informations utiles sur les script
 
 Le plus souvent, les développeurs se tournent vers Chrome ou Firefox pour le développement, car ces navigateurs disposent des meilleurs outils de développement. D'autres navigateurs fournissent également des outils de développement, parfois dotés de fonctions spéciales, mais jouent généralement le rôle de "rattrapage" pour Chrome ou Firefox. Donc, la plupart des gens ont un navigateur "favori" et passent à d'autres si un problème est spécifique au navigateur.
 
+<<<<<<< HEAD
 Les outils de développement sont très puissants, il existe de nombreuses fonctionnalités. Pour commencer, nous allons apprendre à les ouvrir, à examiner les erreurs et à exécuter des commandes JavaScript.
+=======
+Developer tools are potent, they have many features. To start, we'll learn how to open them, look at errors, and run JavaScript commands.
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
 ## Google Chrome
 

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

@@ -334,7 +334,7 @@ Voici un exemple de `.eslintrc`:
   },
   "rules": {
     "no-console": 0,
-    "indent": ["warning", 2]
+    "indent": 2
   }
 }
 ```

1-js/03-code-quality/06-polyfills/article.md

@@ -23,7 +23,12 @@ Actuellement, Babel comporte deux parties :
 
 2. Ensuite, le polyfill.
 
+<<<<<<< HEAD
 Les nouvelles fonctionnalités du langage peuvent inclure de nouvelles fonctions intégrées et de nouvelles constructions de syntaxe. Le transpiler réécrit le code en transformant les nouvelles constructions de syntaxe en anciennes. Mais en ce qui concerne les nouvelles fonctions intégrées, nous devons les implémenter. JavaScript est un langage très dynamique, les scripts peuvent ajouter / modifier n’importe quelle fonction, afin qu’ils se comportent conformément au standard moderne.
+=======
+    New language features may include not only syntax constructs, but also built-in functions.
+    The transpiler rewrites the code, transforming syntax constructs into older ones. But as for new built-in functions, we need to implement them. JavaScript is a highly dynamic language, scripts may add/modify any functions, so that they behave according to the modern standard.
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
   Un script qui met à jour / ajoute de nouvelles fonctions s'appelle "polyfill". Il "comble" le vide et ajoute les implémentations manquantes.
 

1-js/04-object-basics/03-garbage-collection/article.md

@@ -23,7 +23,11 @@ En termes simples, les valeurs "accessibles" sont celles qui sont accessibles ou
 
 2. Toute autre valeur est considérée comme accessible si elle est accessible depuis une racine par une référence ou par une chaîne de références.
 
+<<<<<<< HEAD
     Par exemple, s’il existe un objet dans une variable globale et que cet objet a une propriété référençant un autre objet, cet objet est considéré comme accessible. Et ceux auxquels il fait référence sont également accessibles. Des exemples détaillés à suivre.
+=======
+    For instance, if there's an object in a global variable, and that object has a property referencing another object, *that* object is considered reachable. And those that it references are also reachable. Detailed examples to follow.
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
 Il existe un processus d’arrière-plan dans le moteur JavaScript appelé [Ramasse-miettes (Garbage Collector)](https://fr.wikipedia.org/wiki/Ramasse-miettes_(informatique)). Il surveille tous les objets et supprime ceux qui sont devenus inaccessibles.
 

1-js/04-object-basics/07-optional-chaining/article.md

@@ -12,17 +12,29 @@ Le chaînage optionnel `?.` Est un moyen sécurisé d'accéder aux propriétés
 
 Si vous venez de commencer à lire le tutoriel et à apprendre JavaScript, peut-être que le problème ne vous a pas encore touché, mais c'est assez courant.
 
+<<<<<<< HEAD
 
 À titre d'exemple, considérons les objets pour les données utilisateur. La plupart de nos utilisateurs ont des adresses dans la propriété `user.address`, avec la rue `user.address.street`, mais certains ne les ont pas fournies.
 Dans ce cas, lorsque nous tentons d'obtenir `user.address.street`, nous obtenons une erreur :
 
 ```js run
 let user = {}; // l'utilisateur sans propriété "address"
 
+=======
+As an example, let's say we have `user` objects that hold the information about our users. 
+
+Most of our users have addresses in `user.address` property, with the street `user.address.street`, but some did not provide them.
+
+In such case, when we attempt to get `user.address.street`, and the user happens to be without an address, we get an error:
+
+```js run
+let user = {}; // a user without "address" property
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
 alert(user.address.street); // Error!
 ```
 
+<<<<<<< HEAD
 
 C'est le résultat attendu, JavaScript fonctionne comme ça, mais dans de nombreux cas pratiques, nous préférerions obtenir `undefined` au lieu d'une erreur (signifiant "pas de rue").
 
@@ -37,32 +49,98 @@ let html = document.querySelector('.my-element').innerHTML;
 Avant l'apparition de `?.` Dans le langage, l'opérateur `&&` était utilisé pour contourner ce problème.
 
 Par exemple :
+=======
+That's the expected result. JavaScript works like this. As `user.address` is `undefined`, an attempt to get `user.address.street` fails with an error. 
+
+In many practical cases we'd prefer to get `undefined` instead of an error here (meaning "no street").
+
+...And another example. In the web development, we can get an object that corresponds to a web page element using a special method call, such as `document.querySelector('.elem')`, and it returns `null` when there's no such element.
+
+```js run
+// document.querySelector('.elem') is null if there's no element
+let html = document.querySelector('.elem').innerHTML; // error if it's null
+```
+
+Once again, if the element doesn't exist, we'll get an error accessing `.innerHTML` of `null`. And in some cases, when the absence of the element is normal, we'd like to avoid the error and just accept `html = null` as the result.
+
+How can we do this?
+
+The obvious solution would be to check the value using `if` or the conditional operator `?`, before accessing its property, like this:
+
+```js
+let user = {};
+
+alert(user.address ? user.address.street : undefined);
+```
+
+It works, there's no error... But it's quite inelegant. As you can see, the `"user.address"` appears twice in the code. For more deeply nested properties, that becomes a problem as more repetitions are required.
+
+E.g. let's try getting `user.address.street.name`.
+
+We need to check both `user.address` and `user.address.street`:
+
+```js
+let user = {}; // user has no address
+
+alert(user.address ? user.address.street ? user.address.street.name : null : null);
+```
+
+That's just awful, one may even have problems understanding such code. 
+
+Don't even care to, as there's a better way to write it, using the `&&` operator:
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
 ```js run
 let user = {}; // l'utilisateur n'a pas d'adresse
 
-alert( user && user.address && user.address.street ); // undefined (no error)
+alert( user.address && user.address.street && user.address.street.name ); // undefined (no error)
 ```
 
+<<<<<<< HEAD
+=======
+AND'ing the whole path to the property ensures that all components exist (if not, the evaluation stops), but also isn't ideal.
+
+As you can see, property names are still duplicated in the code. E.g. in the code above, `user.address` appears three times.
+
+That's why the optional chaining `?.` was added to the language. To solve this problem once and for all!
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
 ET l'ensemble du chemin d'accès à la propriété garantit que tous les composants existent (sinon, l'évaluation s'arrête), mais est difficile à écrire.
 
 
 ## Chaînage optionnel
 
+<<<<<<< HEAD
 Le chaînage facultatif `?.` Arrête l'évaluation et renvoie `undefined` si la partie avant `?.` est `undefined` ou `null`.
+=======
+The optional chaining `?.` stops the evaluation if the part before `?.` is `undefined` or `null` and returns that part.
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
 **Plus loin dans cet article, par souci de brièveté, nous dirons que quelque chose "existe" si ce n'est pas "null" et non "undefined".**
 
+<<<<<<< HEAD
 Voici le moyen sûr d'accéder `user.address.street` :
+=======
+In other words, `value?.prop`:
+- is the same as `value.prop` if `value` exists,
+- otherwise (when `value` is `undefined/null`) it returns `undefined`.
+
+Here's the safe way to access `user.address.street` using `?.`:
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
 ```js run
 let user = {}; // l'utilisateur n'a pas d'adresse
 
 alert( user?.address?.street ); // undefined (no error)
 ```
 
+<<<<<<< HEAD
 La lecture de l'adresse avec `user?.address` fonctionne même si l'objet `user` n'existe pas :
+=======
+The code is short and clean, there's no duplication at all.
+
+Reading the address with `user?.address` works even if `user` object doesn't exist:
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
 ```js run
 let user = null;
@@ -73,17 +151,25 @@ alert( user?.address.street ); // undefined
 
 Remarque: la syntaxe `?.` Rend facultative la valeur qui la précède, mais pas plus.
 
+<<<<<<< HEAD
 Dans l'exemple ci-dessus, `user?.` Permet uniquement à `user` d'être `null/undefined`.
 
 D'un autre côté, si `user` existe, alors il doit avoir la propriété `user.address`, sinon `user?.address.street` donne une erreur au deuxième point.
+=======
+E.g. in `user?.address.street.name` the `?.` allows `user` to be `null/undefined`, but it's all it does. Further properties are accessed in a regular way. If we want some of them to be optional, then we'll need to replace more `.` with `?.`.
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
 ```warn header="N'abusez pas du chaînage optionnel"
 Nous ne devrions utiliser `?.` que là où il est normal que quelque chose n'existe pas.
 
+<<<<<<< HEAD
 Par exemple, si selon notre logique de codage, l'objet `user` doit être là, mais que `address` est facultatif, alors `user.address?.street` serait mieux.
 
 
 Donc, si `user` n'est pas défini en raison d'une erreur, nous verrons une erreur de programmation à ce sujet et la corrigerons. Sinon, les erreurs de codage peuvent être réduites au silence lorsqu'elles ne sont pas appropriées et devenir plus difficiles à déboguer.
+=======
+For example, if according to our coding logic `user` object must exist, but `address` is optional, then we should write `user.address?.street`, but not `user?.address?.street`.
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
 ```
 
@@ -94,9 +180,13 @@ S'il n'y a pas du tout de variable `user`, alors `user?.anything` déclenche une
 // ReferenceError: user is not defined
 user?.address;
 ```
+<<<<<<< HEAD
 
 Il doit y avoir une déclaration (par exemple `let/const/var user`). Le chaînage optionnel ne fonctionne que pour les variables déclarées.
 
+=======
+The variable must be declared (e.g. `let/const/var user` or as a function parameter). The optional chaining works only for declared variables.
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 ````
 
 ## Court-circuit
@@ -129,17 +219,20 @@ Par exemple, `?.()` est utilisé pour exécuter une fonction seulement si elle e
 Ainsi dans cet exemple la méthode `admin` n'existe pas pour tout le monde :
 
 ```js run
-let user1 = {
+let userAdmin = {
   admin() {
     alert("I am admin");
   }
-}
+};
+
+let userGuest = {};
 
-let user2 = {};
+*!*
+userAdmin.admin?.(); // I am admin
+*/!*
 
 *!*
-user1.admin?.(); // I am admin
-user2.admin?.();
+userGuest.admin?.(); // nothing (no such method)
 */!*
 ```
 

1-js/05-data-types/02-number/article.md

@@ -408,9 +408,13 @@ Quelques exemples:
     alert( Math.pow(2, 10) ); // 2 puissance 10 = 1024
     ```
 
+<<<<<<< HEAD
 Il y a plus de fonctions et de constantes dans l'objet Math, y compris la trigonométrie, que vous pouvez trouver dans la [documentation de l'objet Math](https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/Math).
 
 ## Résumé
+=======
+There are more functions and constants in `Math` object, including trigonometry, which you can find in the [docs for the Math object](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Math).
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
 Pour écrire de nombres avec beaucoup de zéros :
 

1-js/05-data-types/05-array-methods/2-filter-range/task.md

@@ -4,7 +4,11 @@ importance: 4
 
 # Filter range
 
+<<<<<<< HEAD
 Ecrivez une fonction `filterRange(arr, a, b)` qui obtient un tableau `arr`, recherche les éléments compris entre `a` et `b` et retourne un tableau. 
+=======
+Write a function `filterRange(arr, a, b)` that gets an array `arr`, looks for elements with values higher or equal to `a` and lower or equal to `b` and return a result as an array.
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
 La fonction ne doit pas modifier le tableau. Elle doit juste retourner le nouveau tableau.
 

1-js/05-data-types/05-array-methods/article.md

@@ -749,7 +749,13 @@ Ces méthodes sont les plus utilisées, elles couvrent 99% des cas d'utilisation
 
   La fonction `fn` est appelée sur chaque élément du tableau comme pour `map`. Si n'importe quel/tous les résultats sont `true`, il retourne vrai, sinon il retourne `false`.
 
+<<<<<<< HEAD
 Ces méthodes se comportent en quelque sorte comme les opérateurs `||` et `&&` : si `fn` renvoie une valeur vraie, `arr.some()` retourne immédiatement `true` et arrête d'itérer sur les autres éléments ; si `fn` renvoie une valeur fausse, `arr.every()` retourne immédiatement `false` et arrête également d'itérer sur les autres éléments.
+=======
+  The function `fn` is called on each element of the array similar to `map`. If any/all results are `true`, returns `true`, otherwise `false`.
+  
+  These methods behave sort of like `||` and `&&` operators: if `fn` returns a truthy value, `arr.some()` immediately returns `true` and stops iterating over the rest items; if `fn`  returns a falsy value, `arr.every()` immediately returns `false` and stops iterating over the rest items as well.
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 
   On peut utiliser `every` pour compaere les tableaux :
   ```js run

1-js/05-data-types/08-weakmap-weakset/article.md

@@ -30,8 +30,14 @@ let array = [ john ];
 john = null; // écraser la référence
 
 *!*
+<<<<<<< HEAD
 // John est stocké à l'intérieur du tableau, donc il ne sera pas nettoyé (garbage-collected)
 // nous pouvons l'atteindre avec array[0]
+=======
+// the object previously referenced by john is stored inside the array 
+// therefore it won't be garbage-collected
+// we can get it as array[0]
+>>>>>>> 99e59ba611ab11319ef9d0d66734b0bea2c3f058
 */!*
 ```