Merge pull request #326 from vplentinax/sync25July

sync25Jul

Author: vplentinax

1-js/02-first-steps/05-types/article.md

@@ -1,6 +1,10 @@
 # Tipos de datos
 
-Una variable en JavaScript puede contener cualquier dato. Una variable puede ser una cadena en un momento dado y en otro, un número:
+Un valor en JavaScript siempre es de cierto tipo. Por ejemplo, un string(cadena de caracteres) o un número.
+
+Hay ocho tipos de datos básicos en JavaScript. Aquí, los cubriremos en general y en los próximos capítulos hablaremos de cada uno de ellos en detalle.
+
+Podemos poner cualquier tipo en una variable. Por ejemplo, una variable puede en un momento ser un string y luego almacenar un número:
 
 ```js
 // no hay error
@@ -10,7 +14,6 @@ message = 123456;
 
 Los lenguajes de programación que permiten estas cosas se denominan "dinámicamente tipeados", lo que significa que hay tipos de datos, pero las variables no están vinculadas a ninguno de ellos.
 
-Hay siete tipos de datos básicos en JavaScript. Aquí, los cubriremos en general y en los próximos capítulos hablaremos de cada uno de ellos detalladamente.
 
 ## Un number
 ```js
@@ -62,6 +65,27 @@ Los valores numéricos especiales pertenecen formalmente al tipo "número". Por
 
 Veremos más sobre el trabajo con números en el capítulo <info:number>.
 
+## BigInt
+
+En JavaScript, el tipo "número" no puede representar valores enteros mayores que <code> (2 <sup> 53 </sup> -1) </code> (eso es `9007199254740991`), o menor que <code> - (2 <sup> 53 </sup> -1) </code> para negativos. Es una limitación técnica causada por su representación interna.
+
+Para la mayoría de los propósitos es suficiente, pero a veces necesitamos números realmente grandes, e.j. para criptografía o marcas de tiempo de precisión de microsegundos.
+
+`BigInt` se agregó recientemente al lenguaje para representar enteros de longitud arbitraria.
+
+Un valor `BigInt` se crea agregando `n` al final de un entero:
+
+```js
+// la "n" al final significa que es un BigInt
+const bigInt = 1234567890123456789012345678901234567890n;
+```
+
+Como los números `BigInt` rara vez se necesitan, no los cubrimos aquí, sino que les dedicamos un capítulo separado <info: bigint>. Léalo cuando necesite números tan grandes.
+
+```smart header="Problemas de compatibilidad"
+En este momento, `BigInt` es compatible con Firefox / Chrome / Edge, pero no con Safari / IE.
+```
+
 ## Un string
 
 Un string (cadena de caracteres) en JavaScript debe estar encerrado entre comillas.
@@ -226,9 +250,10 @@ Las últimas tres líneas pueden necesitar una explicación adicional:
 
 ## Resumen
 
-Hay 7 tipos básicos en JavaScript.
+Hay 8 tipos básicos en JavaScript.
 
 - `number` para números de cualquier tipo: enteros o en punto flotante.
+- `bigint` para números enteros de longitud arbitraria.
 - `string` para cadenas. Una cadena puede tener uno o más caracteres, no hay un tipo especial para un único carácter.
 - `boolean` para `verdadero`/`falso`.
 - `null` para valores desconocidos -- un tipo independiente que tiene un solo valor `nulo`.

1-js/02-first-steps/06-alert-prompt-confirm/article.md

@@ -1,26 +1,18 @@
 # Interacción: alert, prompt, confirm
 
-Esta parte del tutorial pretende cubrir JavaScript "como es", sin ajustes específicos del entorno.
-
-Pero como seguiremos utilizando el navegador como entorno de demostración, deberíamos conocer al menos algunas de sus funciones de la interfaz de usuario. En este capítulo, nos familiarizaremos con las funciones del navegador `alert`, `prompt` y `confirm`.
+Como usaremos el navegador como nuestro entorno de demostración, veamos un par de funciones para interactuar con el usuario: `alert`,` prompt` y `confirm`.
 
 ## alert
 
-Sintaxis:
-
-```js
-alert(mensaje);
-```
-
-Esto muestra un mensaje y detiene la ejecución del script hasta que el usuario pulsa "OK".
+Este ya lo hemos visto. Muestra un mensaje y espera a que el usuario presione "Aceptar".
 
 Por ejemplo:
 
 ```js run
-alert("Hola");
+alert("Hello");
 ```
 
-La mini-ventana con el mensaje se llama *ventana modal*. La palabra "modal" significa que el usuario no puede interactuar con el resto de la página, presionar otros botones, etc. hasta que no se haya ocupado de la ventana. En este caso, hasta que pulse "OK".
+La mini ventana con el mensaje se llama * ventana modal *. La palabra "modal" significa que el visitante no puede interactuar con el resto de la página, presionar otros botones, etc., hasta que se haya ocupado de la ventana. En este caso, hasta que presionen "OK".
 
 ## prompt
 
@@ -38,7 +30,7 @@ Muestra una ventana modal con un mensaje de texto, un campo de entrada para el v
 `default`
 : Un segundo parámetro opcional, el valor inicial del campo de entrada.
 
-El usuario puede escribir algo en el campo de entrada y pulsar OK. O puede cancelar la entrada pulsando CANCELAR o presionando la tecla `key:Esc`.
+El usuario puede escribir algo en el campo de entrada de solicitud y presionar OK. Luego obtenemos ese texto en el `resultado`. O pueden cancelar la entrada presionando Cancelar o presionando la tecla `: Esc`, luego obtenemos `null` como el `result`.
 
 La llamada a `prompt` retorna el texto del campo de entrada o `null` si la entrada fue cancelada.
 
@@ -50,7 +42,7 @@ let age = prompt ('¿Cuántos años tienes?', 100);
 alert(`Tienes ${age} años!`); //Tienes 100 años!
 ```
 
-````warn header="En IE: siempre proporciona un `predeterminado`"
+````warn header="En IE: siempre proporciona un *predeterminado*"
 El segundo parámetro es opcional, pero si no lo proporcionamos, Internet Explorer insertará el texto `"undefined"` en el prompt.
 
 Ejecuta este código en Internet Explorer para verlo:

1-js/02-first-steps/09-comparison/article.md

@@ -6,7 +6,7 @@ En Javascript se escriben así:
 
 - Mayor/menor que: <code>a &gt; b</code>, <code>a &lt; b</code>.
 - Mayor/menor o igual que: <code>a &gt;= b</code>, <code>a &lt;= b</code>.
-- Igual: `a == b` (ten en cuenta el doble signo `=`. Un solo símbolo `a = b` significaría una asignación).
+- Igual: `a == b` (ten en cuenta el doble signo `==`. Un solo símbolo `a = b` significaría una asignación).
 - Distinto. En matemáticas la notación es <code>&ne;</code>, pero en JavaScript se escribe como una asignación con un signo de exclamación delante: <code>a != b</code>.
 
 En este artículo, aprenderemos más sobre los diferentes tipos de comparaciones, cómo las realiza JavaScript, incluidas las peculiaridades importantes.

1-js/02-first-steps/12-nullish-coalescing-operator/article.md

@@ -62,7 +62,7 @@ En el caso de `height ?? 100` este retorna `100` solo si `height` es exactamente
 
 ## Precedencia
 
-La precedencia del operador `??` es bastante baja: `7` en la [Tabla MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/Operator_Precedence#Table).
+La precedencia del operador `??` es bastante baja: `5` en la [Tabla MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Operadores/Operator_Precedence#Table).
 
 Es más baja que en la mayoría de los operadores y un poco más alta que `=` y `?`.
 

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

@@ -40,7 +40,7 @@ Y el camino completo a la propiedad asegura que todos los componentes existen, p
 
 El encadenamiento opcional `?.` detiene la evaluación y devuelve` undefined` si la parte anterior a `?.` es` undefined` o `null`.
 
-Más adelante en este artículo, por brevedad, diremos que algo "existe" si no es `null` ni `undefined`.
+**Además en este artículo, por brevedad, diremos que algo "existe" si no es `null` o `undefined`.**
 
 
 Aquí está la forma segura de acceder a `user.address.street`:
@@ -64,7 +64,10 @@ alert( user?.address.street.anything ); // undefined
 
 Tenga en cuenta: la sintaxis `?.` funciona exactamente donde está colocada, nada más.
 
-En las últimas dos líneas, la evaluación se detiene inmediatamente después de `user?.`, sin acceder nunca a otras propiedades. Pero si `user` realmente existe, entonces las propiedades intermedias adicionales, como `user.address`deben existir.
+En el ejemplo anterior, `user?.` permite que solo `user` sea `null / undefined`.
+
+Por otro lado, si `user` existe, entonces debe tener la propiedad `user.address`, de lo contrario `user?.Address.street` da un error en el segundo punto.
+
 
 ```warn header="No abuses del encadenamiento opcional"
 Deberíamos usar `?.` solo donde está bien que algo no exista.
@@ -74,14 +77,14 @@ Por ejemplo, si de acuerdo con nuestra lógica de codificación, el objeto `user
 Entonces, si `user` no está definido debido a un error, lo sabremos y lo arreglaremos. De lo contrario, los errores de codificación pueden silenciarse donde no sea apropiado y volverse más difíciles de depurar.
 ```
 
-````warn header="La variable antes de ?. debe existir"
-Si no hay una variable `user`, entonces `user? .Anything` provocará un error:
+````warn header="La variable antes de ?. debe declararse"
+Si no hay una variable `user` declarada, entonces `user?.Anything` provocará un error:
 
 ```js run
 // ReferenceError: El usuario no está definido
 user?.address;
 ```
-El encadenamiento opcional solo prueba para `null/undefined`, no interfiere con ninguna otra mecánica del lenguaje.
+Debe haber `let / const / var user`. El encadenamiento opcional solo funciona para variables declaradas.
 ````
 
 ## Short-circuiting (Cortocircuitos)

1-js/04-object-basics/08-symbol/article.md

@@ -131,7 +131,7 @@ let id = Symbol("id");
 let user = {
   name: "John",
 *!*
-  [id]: 123 // no "id: 123"
+  [id]: 123 // no "id": 123
 */!*
 };
 ```

1-js/06-advanced-functions/10-bind/article.md

@@ -216,7 +216,7 @@ for (let key in user) {
 }
 ```
 
-Las bibliotecas de JavaScript también proporcionan funciones para un enlace masivo, e.j. [_.bindAll(obj)](http://lodash.com/docs#bindAll) en lodash.
+Las bibliotecas de JavaScript también proporcionan funciones para un enlace masivo, e.j. [_.bindAll(object, methodNames)](http://lodash.com/docs#bindAll) en lodash.
 ````
 
 ## Funciones parciales

1-js/08-prototypes/04-prototype-methods/article.md

@@ -9,7 +9,7 @@ En el primer capítulo de esta sección, mencionamos que existen métodos modern
 
 Los métodos modernos son:
 
-- [Object.create(proto[, descriptors])] (mdn:js/Object/create): crea un objeto vacío con el "proto" dado como `[[Prototype]]` y descriptores de propiedad opcionales.
+- [Object.create(proto, [descriptors])] (mdn:js/Object/create): crea un objeto vacío con el "proto" dado como `[[Prototype]]` y descriptores de propiedad opcionales.
 - [Object.getPrototypeOf(obj)](mdn:js/Object/getPrototypeOf) - devuelve el `[[Prototype]]` de `obj`.
 - [Object.setPrototypeOf(obj, proto)](mdn:js/Object/setPrototypeOf) - establece el `[[Prototype]]` de `obj` en `proto`.
 

1-js/10-error-handling/1-try-catch/article.md

@@ -363,7 +363,7 @@ La técnica de "rethrowing" puede explicarse con más detalle:
 
 1. Catch captura todos los errores.
 2. En el bloque `catch(err) {...}` analizamos el objeto error `err`.
-2. Si no sabemos cómo manejarlo, hacemos 'throw err`.
+3. Si no sabemos cómo manejarlo, hacemos 'throw err`.
 
 Por lo general, podemos verificar el tipo de error usando el operador `instanceof`:
 

1-js/11-async/04-promise-error-handling/article.md

@@ -122,7 +122,7 @@ Here the `.catch` block finishes normally. So the next successful `.then` handle
 In the example below we see the other situation with `.catch`. The handler `(*)` catches the error and just can't handle it (e.g. it only knows how to handle `URIError`), so it throws it again:
 
 ```js run
-// the execution: catch -> catch -> then
+// the execution: catch -> catch
 new Promise((resolve, reject) => {
 
   throw new Error("Whoops!");
@@ -201,4 +201,4 @@ In non-browser environments like Node.js there are other ways to track unhandled
 - `.catch` handles errors in promises of all kinds: be it a `reject()` call, or an error thrown in a handler.
 - We should place `.catch` exactly in places where we want to handle errors and know how to handle them. The handler should analyze errors (custom error classes help) and rethrow unknown ones (maybe they are programming mistakes).
 - It's ok not to use `.catch` at all, if there's no way to recover from an error.
-- In any case we should have the `unhandledrejection` event handler (for browsers, and analogs for other environments) to track unhandled errors and inform the user (and probably our server) about them, so that our app never "just dies".
+- In any case we should have the `unhandledrejection` event handler (for browsers, and analogs for other environments) to track unhandled errors and inform the user (and probably our server) about them, so that our app never "just dies".

2-ui/1-document/07-modifying-document/article.md

@@ -57,9 +57,11 @@ Creating the message div takes 3 steps:
 ```js
 // 1. Create <div> element
 let div = document.createElement('div');
+
 // 2. Set its class to "alert"
 div.className = "alert";
-// Fill it with the content
+
+// 3. Fill it with the content
 div.innerHTML = "<strong>Hi there!</strong> You've read an important message.";
 ```
 
@@ -99,10 +101,10 @@ Here we called `append` on `document.body`, but we can call `append` method on a
 
 Here are more insertion methods, they specify different places where to insert:
 
-- `node.append(...nodes or strings)` -- append nodes or strings at the end of `node`,
-- `node.prepend(...nodes or strings)` -- insert nodes or strings at the beginning of `node`,
-- `node.before(...nodes or strings)` –- insert nodes or strings before `node`,
-- `node.after(...nodes or strings)` –- insert nodes or strings after `node`,
+- `node.append(...nodes or strings)` -- append nodes or strings *at the end* of `node`,
+- `node.prepend(...nodes or strings)` -- insert nodes or strings *at the beginning* of `node`,
+- `node.before(...nodes or strings)` –- insert nodes or strings *before* `node`,
+- `node.after(...nodes or strings)` –- insert nodes or strings *after* `node`,
 - `node.replaceWith(...nodes or strings)` –- replaces `node` with the given nodes or strings.
 
 Arguments of these methods are an arbitrary list of DOM nodes to insert, or text strings (that become text nodes automatically).

2-ui/2-events/01-introduction-browser-events/article.md

@@ -236,7 +236,7 @@ element.removeEventListener(event, handler, [options]);
 ````warn header="Removal requires the same function"
 To remove a handler we should pass exactly the same function as was assigned.
 
-That doesn't work:
+This doesn't work:
 
 ```js no-beautify
 elem.addEventListener( "click" , () => alert('Thanks!'));

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 phase, triggers two times, as we've set two listeners: capturing and bubbling)
+2. `P` (target phrase, 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/ball.view/index.html

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

3-frames-and-windows/03-cross-window-communication/sandbox.view/index.html

@@ -7,7 +7,7 @@
 
 <body>
 
-  <div>The iframe below is has <code>sandbox</code> attribute.</div>
+  <div>The iframe below has the <code>sandbox</code> attribute.</div>
 
   <iframe sandbox src="sandboxed.html" style="height:60px;width:90%"></iframe>
 

5-network/07-url/article.md

@@ -88,7 +88,7 @@ It provides convenient methods for search parameters:
 - **`delete(name)`** -- remove the parameter by `name`,
 - **`get(name)`** -- get the parameter by `name`,
 - **`getAll(name)`** -- get all parameters with the same `name` (that's possible, e.g. `?user=John&user=Pete`),
-- **`has(name)`** -- check for the existance of the parameter by `name`,
+- **`has(name)`** -- check for the existence of the parameter by `name`,
 - **`set(name, value)`** -- set/replace the parameter,
 - **`sort()`** -- sort parameters by name, rarely needed,
 - ...and it's also iterable, similar to `Map`.

6-data-storage/02-localstorage/article.md

@@ -218,7 +218,7 @@ Los navegadores modernos también soportan la [API de Broadcast channel API](htt
 
 Los objetos de almacenaje web `localStorage` y `sessionStorage` permiten guardar pares de clave/valor en el navegador.
 - Tanto la `clave` como el `valor` deben ser strings, cadenas de texto.
-- El límite es de más de 2mb; depende del navegador.
+- El límite es de más de 5mb+; depende del navegador.
 - No expiran.
 - Los datos están vinculados al orígen (domínio/puerto/protocolo).