ES13: at

Hola Chic@s 😃

ES13:

• at

const array = ["one", "two", "three", "four", "five", "six"];

console.log(array[array.length - 1]);
console.log(array.at(-1));

Aquí la fake api de Platzi.

El índice negativo de .at devuelve el elemento del array contando desde el último elemento hacia al primero.
Si bien array_at(-1) devuelve el último elemento,
array_at(-2) devuelve el penúltimo.
Si la magnitud del índice negativo exede la longitud del array, devolverá Undefined, igual que al solicitar un índice positivo que exceda el final del array.

Este está interesante, hace lo mismo pero con código mas limpio y claro.

El método at() recibe un valor numérico entero y devuelve el elemento en esa posición, permitiendo valores positivos y negativos. Los valores negativos contarán desde el último elemento del array.

Esto no sugiere que haya algo mal con usar la notación de corchetes. Por ejemplo, array[0] devolvería el primer elemento. Sin embargo, en lugar de usar array.length para los últimos elementos; ej. array[array.length-1] para el último elemento, puede llamar array. at(-1).

para los que necesiten actualizar a la version 16 de node esta es una guia

33/35 ES13: at
El método at de los arrays en JavaScript permite acceder a los elementos utilizando índices positivos y negativos, siendo útil para manejar los índices negativos.

Ejemplo Acceder al primer y último elemento del array utilizando el método at y los indices positivos y negativos:

const frutas = ['manzana', 'pera', 'naranja', 'plátano'];

// Acceder al primer elemento del array con el índice positivo 0
console.log(frutas.at(0)); // 'manzana'

// Acceder al último elemento del array con el índice negativo -1
console.log(frutas.at(-1)); // 'platano'

Acceder a un elemento en el medio del array utilizando el método at y los índices positivos y negativos:

const numero = [10, 20, 30, 40, 50];

// Acceder al elemento en la posición 2 del array con el índice positivo 2
console.log(numeros.at(2)); // 30

// Acceder al elemento en la posición 3 del array con el índice negativo -2
console.log(numero.at(-2)); // 40

Mostrar la diferencia entre el uso del método at y la notación de corchetes para acceder al último elemento del array:

const colores = ['rojo', 'verde', 'azul'];

// Acceder al último elemento del array con el método at
console.log(colores.at(-1)); // azul

// Acceder al último elemento del array con la notación de corchees
console.log(colores[colores.length -1]); // 'azul'

¡Hola!
El método at me recordó bastante al concepto de slices en python, un gran lenguaje si consideras probarlo algún día.

Por si a alguno no le funciona el comando at, verificar que tengan instalado una version adecuada de Node, usen los siguientes comandos para manejar versiones de node, (Primero instalen NVM), pueden usar otra version que no sea la ultima, para esto en vez de “latest” indicar la que desean y en 18.10.0 indiquen la que les indique el comando nvm list.

nvm install latest
nvm list 
nvm use 18.10.0

Mi resumen:

ES13: .at()

El método “.at()” es una función introducida en ECMAScript 2022 (ES13) para acceder a los elementos de una matriz o cadena en un índice específico. Está disponible en instancias de objetos Array y String.

A continuación se muestra un ejemplo de uso del método “.at()” con un array:

const miArray = ['apple', 'banana', 'orange'];
console.log(myArray.at(1)); // Salida: 'banana'

En este ejemplo, la llamada al método “.at(1)” recupera el elemento en el índice 1 (indexación basada en cero) de la matriz myArray, que es ‘banana’.

El método “.at()” también se puede utilizar con cadenas:

const myString = 'Hello, World!';
console.log(myString.at(7)); // Salida: 'W'

En este caso, la llamada al método “.at(7)” recupera el carácter en el índice 7 de la cadena myString, que es ‘W’.

Es importante tener en cuenta que el método “.at()” no está muy extendido en todos los entornos JavaScript ni en las versiones antiguas de ECMAScript. Siempre es una buena práctica comprobar la compatibilidad antes de utilizar esta función.

Espero sea de utilidad. 👨‍💻

Genial!!!

El método propuesto at() debería ayudarte a acceder a los elementos de un arreglo usando un número de índice negativo. A partir de ahora, esto no es posible. tu puede acceder elemento solo desde el inicio del arreglo usando un número de índice positivo.

Acceder elementos de la parte de atrás del arreglo es posible usando el valor length. Con la inclusión del método at(), tú podrás acceder a los elementos usando ambos índices positivo y negativo con un solo método.

const junkFoodILove = ['?', '?', '?', '?', '?', '?', '?', '?'];

junkFoodILove.at(0); // ?
junkFoodILove.at(3); // ?
junkFoodILove.at(-1); // ?
junkFoodILove.at(-5); // ?
junkFoodILove.at(-8); // ?
junkFoodILove.at(10); // undefined

Aquí hay una demostracion rapida de ello:

Puedes usar este polyfill para lograr la funcionalidad del método at() hasta que este método sea añadido al lenguaje JavaScript. Por favor checa este repositorio de GitHub  para  los ejemplos del método at(): https://github.com/atapas/js-array-at-method.

La de veces que habré usado el método de restar 1 al length del array sin saber que podía hacerlo de esta forma… 😭

También es posible usar atributos privados en las clases de la misma forma en que se definen los metodos privados 😃.

class Person {
  #name; // Private attribute

  constructor(name) {
    this.#name = name; // Initialize the private attribute in the constructor
  }

  getName() {
    return this.#name;
  }

  changeName(newName) {
    this.#name = newName;
  }
}

Para la primera pregunta de “como encontrarias el ultimo valor del array sin saber cuantos valores hay” encontre esta solución medio deficiente:

const array = ["one", "two", "three", "four", "five", "six"];

let element
for (let i = 0; i < array.length; i++) {
    element = array[i];
    
}
console.log(element)

https://54albert54.github.io/ecomes
me vi tentado a utilizar la api jejjeje se que falta mucho por hacer

📰 Archivos del Proyecto 📰

Pasos 📌

• • Dentro de la carpeta src. Se crea la carpeta llamada es13.
• • Dentro de la carpeta es13, crear el archivo llamado: 00-at.js
  • • ◦ El código queda:

//Compilar: seleccionar el código + click derecho + Run Code

//Ejercicio #1
const array = ["one", "two", "three", "four", "five", "six"];

console.log(array[array.length - 1]);

/*output: accede al último elemento indicando la longitud
six
*/

console.log(array.at(-1));

/*output: accede al último elemento sin conocer su índice
six
*/

Ni idea de donde usarlo, pero util conocerlo 😄

at:

const arrayString = ["one", "two", "three", "four", "five", "six"];

console.log(arrayString[arrayString.length -1]);

console.log(arrayString.at(-1));

//six
//six

🍃 En JavaScript, la palabra clave “at” se utiliza para acceder al elemento de un arreglo en una posición específica. La sintaxis básica es la siguiente:

array.at(index)

Donde “array” es el arreglo que se desea acceder y “index” es la posición del elemento que se desea obtener. La posición se especifica como un número entero no negativo.

La función “at” devuelve el valor del elemento en la posición especificada. Si la posición está fuera del rango válido de índices para el arreglo, se devuelve “undefined”.

La ventaja de utilizar “at” en lugar de acceder al elemento directamente mediante su índice, es que si el índice es negativo o mayor o igual al tamaño del arreglo, “at” devolverá “undefined” en lugar de producir un error de índice fuera de rango. Además, “at” funciona correctamente con arreglos que tienen elementos no numéricos en sus propiedades de índice.

<
const array = ['uno', 'dos', 'tres', 'cuatro', 'cinco', 'seis']
const ultimo = array.length
console.log(ultimo);
console.log(array[ultimo - 1]);
console.log(array.at(-1));
> 

    ES13: at

        const array = ["uno","dos","tres","cuatro","cinco","seis"];
        //pesemos que este array tiene muchos caracteres  y no sabemos en donde termina y que no lo conocemos
        //al momento de llamar un API en la cual queramos por ejemplo aceder a los productos para eso vamos a utilizar at 
        
        //¿como acceder al ultimo elemento del array sin saber cuantos tiene  
        //antes
        console.log(array[array.length - 1]);

*/

const array = ["uno","dos","tres","cuatro","cinco","seis"];
//pesemos que este array tiene muchos caracteres  y no sabemos en donde termina y que no lo conocemos
//al momento de llamar un API en la cual queramos por ejemplo aceder a los productos para eso vamos a utilizar at 

//¿como acceder al ultimo elemento del array sin saber cuantos tiene  
//antes
console.log(array[array.length - 1]);// nos arrojara seis que es el ultimo elemento

/*

        Ahora

        console.log(array.at(-1));// esta es una forma mas sinplificada para acceder al ultimo elemento del array

*/

El operador at es una adición propuesta en ECMAScript 13 (ES13) para JavaScript que permite acceder a un elemento específico de un objeto o una matriz. El operador at se puede utilizar como una alternativa al operador de corchete ([]), que es el método más común para acceder a los elementos de un objeto o matriz.

Aquí hay un ejemplo de cómo utilizar el operador at para acceder a un elemento de una matriz:

const numbers = [1, 2, 3, 4, 5];
const thirdNumber = numbers.at(2);
console.log(thirdNumber);
// Output: 3

Si tienes alguna idea de cómo podemos implementar esta funcionalidad en un problema, porfa, déjanos un reto o varios para que todos practiquemos. 😃

Rectifico, cuando dice que vamos a tomar el último valor que se encuentra en el array y dice que .lenght cuenta desde “0”, esto no es cierto esta propiedad cuenta a partir de “1” y por ello como en el array si se cuenta desde cero lo mejor es ponerle el -1 para que tome el valor final real del array.

/* ES13 - 2022 */

const array = ['one', 'two,', 'three', 'four', 'five', 'six'];
console.log(array.at(-1)); // six
console.log(array.at(-2)); // five
console.log(array.at(-4)); // three

el método .at() no solo sirve para acceder a la última posición, para acceder a cualquier otra posición le pasamos por argumento el índice de la posición.

const strings = ['one', 'two', 'three', 'four', 'five','six', 'seven', 'eight', 'nine','ten']

console.log(strings.at(2)) // Devolvera 'three'

Y como vimos en clase, mejor uso es solo colar -1 y nos devolvera la ultima posicion sin importar la longitud del array

// At is a new method on String.prototype that returns the character at the given index.

const string = "Hello World"

console.log(string.at(0)) // H
console.log(string.at(-1)) // d
console.log(string.at(-2)) // l

Índices Positivos

Los índices positivos comienzan de izquierda a derecha del array; desde 0 hasta la longitud total menos uno, . El índice 0 es la primera posición.

[0,1,2,3, ...., lenght-1]

Índices Negativos

Los índices negativos comienzan de derecha a izquierda del array; ****desde -1 hasta el negativo de la longitud total del array. El índice -1 es la última posición.

[-lenght, ...,  -3, -2, -1]

Método at

La utilidad más importante de este método es para manejar índices negativos. Algo que no se puede con la notación de corchetes.

const nombres = ["Andres", "Valeria", "Ana", "Ramiro", "Richard"]

nombres.at(-1) // "Richard"
nombres[-1] // undefined
nombres.at(-3) // "Ana"
nombres[nombres.length -1] // "Richard"

Puedes utilizar la notación de corchetes, pero necesitas obtener la longitud del array y restarle una unidad, generando mucho código que puede volverse difícil de leer.

nombres[nombres.length -1] // "Richard"

Contribución creada por:

Andrés Guano (Platzi Contributor).

Buenas Practicas / Código Nuevo / Extras

At solo es para arrays ¿?

R E S U M E N

<aside>
📍 At:

Método que nos permite acceder a los elementos de un array a partir de un índice.

Positivos:

Comienzan de derecha a izquierda con el 0 y terminar con la longitud del array-1

Negativos:

Comienzan de izquierda a derecha con -1 hasta la longitud del array en negativo

Este método es especial para manejar los índices negativos, genera una facilidad para leer el código, más simple, sencillo.

nombres.at(-1) > nombres[nombres.length -1]

</aside>

Great!

Para acceder al último elemento de un array

const array = ['one', 'two', 'three', 'four', 'five', 'six', 'seven'];
  	
let szOfArray = array.length;
console.log(array[szOfArray - 1]); //seven