Aug 27, 2020 · Aug 26, 2020
diff --git a/5-network/04-fetch-abort/article.md b/5-network/04-fetch-abort/article.md

 # Fetch: Abort

 As we know,`fetch`returns a promise. AndJavaScriptgenerally has no concept of "aborting" a promise. So how can we abort a `fetch`?
 Como sabemos`fetch`devuelve una promesa, y generalmenteJavaScriptno tiene un concepto de "abortar" una promesa. Entonces, ¿cómo podemos abortar una llamada al método `fetch`?

 There's a special built-in object for such purposes: `AbortController`,that can be used to abort not only `fetch`,but other asynchronous tasks as well.
 Existe para esto de forma nativa un objeto especial: `AbortController`,este puede ser utilizado para abortar una tarea `fetch`,así como otras tareas asincrónicas.

 The usage is pretty simple:
 Su uso es muy sencillo:

 -Step 1:create a controller:
 -Paso 1:crear un controlador:

    ```js
    let controller = new AbortController();
    ```

 A controller is an extremely simple object.
 Este controlador es un objeto extremadamente simple.

    -It has a single method`abort()`,and a single property `signal`.
    -When `abort()`is called:
        - `abort`event triggers on `controller.signal`
        - `controller.signal.aborted`property becomes `true`.
    -Tiene un único método`abort()`,así como una única propiedad `signal`.
    -Cuando `abort()`es invocado:
        -El evento`abort`se dispara en `controller.signal`
        -La propiedad`controller.signal.aborted`toma el valor `true`.

 All parties interested to learn about`abort()`call set listeners on`controller.signal` to track it.
 Todas las partes interesadas en estar al tanto de una llamada a`abort()`realizan un seguimiento a la propiedad`controller.signal`.

 Like this (without`fetch` yet):
 Tal como se muestra a continuación (por ahora sin`fetch`):

    ```js run
    let controller = new AbortController();
    alert(signal.aborted); // true
    ```

 -Step 2:pass the`signal`property to`fetch` option:
 -Paso 2:Se pasa la propiedad`signal`en la opción de`fetch`:

    ```js
    let controller = new AbortController();
    });
    ```

 The`fetch`method knows how to work with`AbortController`,it listens to `abort`on `signal`.
 El método`fetch`conoce como funciona`AbortController`,el escucha por `abort`en `signal`.

 -Step 3:to abort, call`controller.abort()`:
 -Paso 3:Se llama al método`controller.abort()` para abortar:

    ```js
    controller.abort();
    ```

 We're done: `fetch`gets the event from `signal`and aborts the request.
 Y así `fetch`obtiene el evento desde `signal`y aborta la solicitud.

 When a fetchis aborted, its promise rejects with anerror `AbortError`,so we should handle it, e.g. in`try..catch`:
 Cuando un fetches abortado su promesa es rechazada con unerrordel tipo`AbortError`,por lo que es posible responder a esto utilizando un bloque`try..catch` por ejemplo:

 ```js run async
 //abort in 1 second
 //Se abortara en un segundo
 let controller = new AbortController();
 setTimeout(() => controller.abort(), 1000);

    signal: controller.signal
  });
 } catch(err) {
  if (err.name == 'AbortError') { //handle abort()
  if (err.name == 'AbortError') { //se maneja el abort()
    alert("Aborted!");
  } else {
    throw err;
  }
 }
 ```

 **`AbortController`is scalable, it allows to cancel multiple fetches at once.**
 **`AbortController`es escalable, permitiendo cancelar múltiples fetch a la vez.**

 For instance, here we fetch many`urls`in parallel, and the controller aborts them all:
 Por ejemplo, aquí tenemos muchas`urls`en paralelo, y el controlador las aborta todas:

 ```js
 let urls = [...]; //a list of urlstofetchin parallel
 let urls = [...]; //una lista de urlspara utilizarfetchen paralelo

 let controller = new AbortController();


 let results = await Promise.all(fetchJobs);

 //if controller.abort()is called from elsewhere,
 //it aborts all fetches
 //si controller.abort()es llamado,
 //se abortaran todas las solicitudes fetch
 ```

 If we have our own asynchronous jobs, different from`fetch`,we can use a single`AbortController`to stop those, together with fetches.
 En el caso de tener nuestras propias tareas asincrónicas aparte de`fetch`,podemos utilizar un único`AbortController`para detenerlas junto con fetch.

 We just need to listen to its`abort` event:
 Solo es necesario escuchar el evento`abort`:

 ```js
 let urls = [...];
 let controller = new AbortController();

 let ourJob = new Promise((resolve, reject) => { //our task
 let ourJob = new Promise((resolve, reject) => { //nuestra tarea
  ...
  controller.signal.addEventListener('abort', reject);
 });

 let fetchJobs = urls.map(url => fetch(url, { //fetches
 let fetchJobs = urls.map(url => fetch(url, { //varios fetch
  signal: controller.signal
 }));

 //Wait for fetches and our task in parallel
 //Se espera por la finalización de los fetch y nuestra tarea
 let results = await Promise.all([...fetchJobs, ourJob]);

 //ifcontroller.abort()is called from elsewhere,
 //it aborts all fetches and ourJob
 //en caso de que se llame al métodocontroller.abort()desde algún sitio,
 //se abortan todos los fetch y nuestra tarea.
 ```

 So `AbortController` is not only for`fetch`, it's a universal object to abort asynchronous tasks, and`fetch` has built-in integration with it.
 Por lo tanto, si bien`fetch` incorpora esta funcionalidad de forma nativa, `AbortController` no es sólo para`fetch`, sino que es un objeto universal para abortar tareas asincrónicas.
Original file line number	Diff line number	Diff line change
		@@ -1,28 +1,28 @@

		# Fetch: Abort

		As we know,`fetch`returns a promise. AndJavaScriptgenerally has no concept of "aborting" a promise. So how can we abort a `fetch`?
		Como sabemos`fetch`devuelve una promesa, y generalmenteJavaScriptno tiene un concepto de "abortar" una promesa. Entonces, ¿cómo podemos abortar una llamada al método `fetch`?

		There's a special built-in object for such purposes: `AbortController`,that can be used to abort not only `fetch`,but other asynchronous tasks as well.
		Existe para esto de forma nativa un objeto especial: `AbortController`,este puede ser utilizado para abortar una tarea `fetch`,así como otras tareas asincrónicas.

		The usage is pretty simple:
		Su uso es muy sencillo:

		-Step 1:create a controller:
		-Paso 1:crear un controlador:

		```js
		let controller = new AbortController();
		```

		A controller is an extremely simple object.
		Este controlador es un objeto extremadamente simple.

		-It has a single method`abort()`,and a single property `signal`.
		-When `abort()`is called:
		- `abort`event triggers on `controller.signal`
		- `controller.signal.aborted`property becomes `true`.
		-Tiene un único método`abort()`,así como una única propiedad `signal`.
		-Cuando `abort()`es invocado:
		-El evento`abort`se dispara en `controller.signal`
		-La propiedad`controller.signal.aborted`toma el valor `true`.

		All parties interested to learn about`abort()`call set listeners on`controller.signal` to track it.
		Todas las partes interesadas en estar al tanto de una llamada a`abort()`realizan un seguimiento a la propiedad`controller.signal`.

		Like this (without`fetch` yet):
		Tal como se muestra a continuación (por ahora sin`fetch`):

		```js run
		let controller = new AbortController();
Expand All		@@ -36,7 +36,7 @@ The usage is pretty simple:
		alert(signal.aborted); // true
		```

		-Step 2:pass the`signal`property to`fetch` option:
		-Paso 2:Se pasa la propiedad`signal`en la opción de`fetch`:

		```js
		let controller = new AbortController();
Expand All		@@ -45,20 +45,20 @@ The usage is pretty simple:
		});
		```

		The`fetch`method knows how to work with`AbortController`,it listens to `abort`on `signal`.
		El método`fetch`conoce como funciona`AbortController`,el escucha por `abort`en `signal`.

		-Step 3:to abort, call`controller.abort()`:
		-Paso 3:Se llama al método`controller.abort()` para abortar:

		```js
		controller.abort();
		```

		We're done: `fetch`gets the event from `signal`and aborts the request.
		Y así `fetch`obtiene el evento desde `signal`y aborta la solicitud.

		When a fetchis aborted, its promise rejects with anerror `AbortError`,so we should handle it, e.g. in`try..catch`:
		Cuando un fetches abortado su promesa es rechazada con unerrordel tipo`AbortError`,por lo que es posible responder a esto utilizando un bloque`try..catch` por ejemplo:

		```js run async
		//abort in 1 second
		//Se abortara en un segundo
		let controller = new AbortController();
		setTimeout(() => controller.abort(), 1000);

Expand All		@@ -67,20 +67,20 @@ try {
		signal: controller.signal
		});
		} catch(err) {
		if (err.name == 'AbortError') { //handle abort()
		if (err.name == 'AbortError') { //se maneja el abort()
		alert("Aborted!");
		} else {
		throw err;
		}
		}
		```

		`AbortController`is scalable, it allows to cancel multiple fetches at once.
		`AbortController`es escalable, permitiendo cancelar múltiples fetch a la vez.

		For instance, here we fetch many`urls`in parallel, and the controller aborts them all:
		Por ejemplo, aquí tenemos muchas`urls`en paralelo, y el controlador las aborta todas:

		```js
		let urls = [...]; //a list of urlstofetchin parallel
		let urls = [...]; //una lista de urlspara utilizarfetchen paralelo

		let controller = new AbortController();

Expand All		@@ -90,32 +90,32 @@ let fetchJobs = urls.map(url => fetch(url, {

		let results = await Promise.all(fetchJobs);

		//if controller.abort()is called from elsewhere,
		//it aborts all fetches
		//si controller.abort()es llamado,
		//se abortaran todas las solicitudes fetch
		```

		If we have our own asynchronous jobs, different from`fetch`,we can use a single`AbortController`to stop those, together with fetches.
		En el caso de tener nuestras propias tareas asincrónicas aparte de`fetch`,podemos utilizar un único`AbortController`para detenerlas junto con fetch.

		We just need to listen to its`abort` event:
		Solo es necesario escuchar el evento`abort`:

		```js
		let urls = [...];
		let controller = new AbortController();

		let ourJob = new Promise((resolve, reject) => { //our task
		let ourJob = new Promise((resolve, reject) => { //nuestra tarea
		...
		controller.signal.addEventListener('abort', reject);
		});

		let fetchJobs = urls.map(url => fetch(url, { //fetches
		let fetchJobs = urls.map(url => fetch(url, { //varios fetch
		signal: controller.signal
		}));

		//Wait for fetches and our task in parallel
		//Se espera por la finalización de los fetch y nuestra tarea
		let results = await Promise.all([...fetchJobs, ourJob]);

		//ifcontroller.abort()is called from elsewhere,
		//it aborts all fetches and ourJob
		//en caso de que se llame al métodocontroller.abort()desde algún sitio,
		//se abortan todos los fetch y nuestra tarea.
		```

		So `AbortController` is not only for`fetch`, it's a universal object to abort asynchronous tasks, and`fetch` has built-in integration with it.
		Por lo tanto, si bien`fetch` incorpora esta funcionalidad de forma nativa, `AbortController` no es sólo para`fetch`, sino que es un objeto universal para abortar tareas asincrónicas.