Los símbolos son un nuevo valor primitivo introducido por ES6. Su propósito es proporcionarnos identificadores únicos. En este artículo te contamos cómo funcionan, de qué forma se utilizan con JavaScript y cómo nos pueden ayudar.

 

Cómo crear símbolos

 

Para crear un nuevo símbolo tendremos que usar su constructor:

 

const symbol = Symbol();

 

La función tiene un parámetro de cadena opcional que actúa como una descripción.

 

const symbol = Symbol('description');
console.log(symbol);//Symbol(description)

 

Lo importante es que, aunque uses la misma descripción más de una vez, cada símbolo es único.

 

Symbol('description') === Symbol('description');
//false

Como dije antes, los símbolos son nuevos valores primitivos y tienen su propio tipo. Podemos verificar esto usando typeof:

typeof Symbol();
//symbol

 

Conversión a tipo de símbolo

 

Ya sabes que en Javascript es posible convertir tipos. Una gran parte de esto es la conversión implícita, que sucede cuando usamos valores de diferentes tipos juntos:

 

console.log(1 + " added to " + 2 + " equals " + 3); 
//1 added to 2 equals 3

 

Aunque hay tipos que son compatibles, este no es el caso de los símbolos.

 

const symbol = Symbol('Hello');
symbol + 'world!';
//Uncaught TypeError: Cannot convert a Symbol value to a string

 

Si desea usar símbolos de esta manera, deberá convertirlos o usar la propiedad “descripción”.

 

const symbol = Symbol('Hello');
console.log(`${symbol.description} world!`);
//Hello world!

 

Cómo usar símbolos

 

Antes de sumergirnos en los símbolos, no hace falta decir que las claves de un objeto solo pueden ser cadenas. Intentar usar un objeto como clave para una propiedad no devuelve el resultado esperado.

 

const key = {};
const myObject = {
  [key]: 'Hello world!'
};
console.log(myObject);
/*
{
 [object Object]: 'Hello world!'
 }
 */

 

Este no es el caso de los símbolos. La especificación ECMAScript establece que podemos usarlos como claves. Así que vamos a darle una oportunidad.

 

const key = Symbol();
const myObject = {
 [key]: 'Hello world!'
 };
 console.log(myObject);
 /*
 {
  Symbol(): 'Hello world!'
  }
 */

 

Incluso si dos símbolos tienen la misma descripción, no se superpondrán cuando se utilicen como claves:

 

const key = Symbol('key');
const myObject = {
 [key]: 'Hello world!'

};

console.log(myObject[key] === myObject[Symbol('key')]);

//false

 

Esto significa que podemos asignar un número ilimitado de símbolos únicos y no preocuparnos por los conflictos entre ellos.

 

Acceder al valor

 

Ahora, la única forma de acceder a nuestro valor es usar el símbolo.

 

console.log(myObject[key]); // Hello world!

 

Existen algunas diferencias cuando se trata de iterar a través de las propiedades de un objeto con símbolos. Las funciones Object.keys, Object.entries y Object.entries no nos dan acceso a ningún valor que use símbolos, lo mismo es cierto para a for … in. La forma más fácil de iterar a través de ellos es usar el objeto. función getOwnPropertySymbols.

 

const key = Symbol();
const myObject = {
 [key]: 'Hello world!'
};

Object.getOwnPropertySymbols(myObject)
  .forEach((symbol) => {
    console.log(myObject[symbol]);
 });
//Hello world!

 

A juzgar por lo anterior, podemos concluir que los símbolos nos brindan una capa oculta debajo del objeto, separada de las teclas que son cadenas.

 

Los símbolos son únicos… al menos, la mayor parte del tiempo.

 

La forma de crear un símbolo global es usar la función Symbol.for.

 

const symbol = Symbol.for('key');
console.log(symbol === Symbol.for('key'));
//true

 

Si tiene dudas sobre si un símbolo es único, puede utilizar la función Symbol.keyFor. Devuelve la clave asociada si se encuentra.

 

Symbol.keyFor(
  
Symbol.for('key')
);
//key

 

Symbol.keyFor(
 Symbol('key')
);
//undefined

Source link