Javascript. ¿Conoces el tipo Symbol?

Una introducción al tipo Symbol que introdujo ES2015

El tipo Symbol

Creando un Symbol

const myFirstSymbol = Symbol();
const foo = Symbol('foo');
console.log(foo); // Symbol(foo);
Symbol() === Symbol() // false
const a = Symbol('a');const otherA = Symbol('a');a === otherA // false

Características del tipo Symbol

const foo = Symbol('foo');console.log('This is the symbol foo: ' + foo); // Error

Accediendo a Symbols creados anteriormente

const foo = Symbol.for('foo'); 
const bar = Symbol.for('foo');foo === bar; // true
const foo = Symbol('foo');const bar = Symbol.for('foo');foo === bar; // false

Symbols predefinidos

const arr = [1, 2, 3];const iterator = arr[Symbol.iterator]();console.log(iterator.next()); // {value: 'a', done: false}

Usos de los Symbols

Image for post
Image for post
Photo by Natalya Letunova on Unsplash

Symbols como claves de propiedades de objetos

const foo = Symbol();const myObject = {};myObject[foo] = 'foo';myObject['bar'] = 'bar';console.log(myObject); // {bar: "bar", Symbol(): "foo"}console.log(foo in myObject); // trueconsole.log(myObject[foo]); // 'foo'console.log(Object.getOwnPropertyNames(myObject)); // ['bar']console.log(Object.keys(myObject)); ['bar']
console.log(Reflect.ownKeys(myObject)); ['bar', Symbol]

Prevenir colisiones de nombres de propiedades

// Library Aconst jQuerySymbolA = Symbol('library a');
window[jQuerySymbolA] = $;
// Library Bconst jQuerySymbolB = Symbol('library b');
window[jQuerySymbolB] = $;

Conclusiones

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

Entre paseo y paseo con Simba desarrollo en Symfony y React

Get the Medium app