Javascript. El operador “optional chaining”

Descubre cómo funciona el operador “optional chaining” que llega con la nueva propuesta ES2020

Motivación del “optional chaining operator”

const person = {
name: 'Gerardo',
email: 'mail@mail.com'
}
const jobTitle = person.currentJob.title
const jobTitle = person?.currentJob?.title
const person = {
name: 'Gerardo',
email: 'mail@mail.com',
currentJob: null;
}
const jobTitle = person?.currentJob?.title // undefined

Usos del “optional chaining operator”

Para acceder a propiedades de objetos

const jobTitle = person?.['currentJob']?.['title']

Para acceder a posiciones de arrays

const people = [
{
id: 1,
name: 'Foo'
}
];
const person = people[1]?.name;

Para invocar funciones

const foo = function(callback) {
callback?.('bar');
}

Combinado con el “nullish coalescing operator”

const jobTitle = person?.currentJob?.title ?? 'New Job';

Conclusiones

¿Quieres recibir más artículos como este?

Entre paseo y paseo con Simba desarrollo en Symfony y React

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store