Tipos de Símbolos en JavaScript

❮ Anterior Siguiente ❯

En general, las claves de las propiedades de un objeto pueden ser de dos tipos: cadena y símbolo. Los símbolos son identificadores únicos finales. Se pueden crear utilizando la función de fábrica Symbol().

Por ejemplo:

javascript symbol

Después de crear un símbolo, puedes darle un nombre o una descripción. Esto es especialmente útil para las prácticas de depuración. Veamos el siguiente ejemplo:

//  id is a symbol, it's a description "id"
let id = Symbol("id");

Como ya hemos señalado, los símbolos son únicos. Incluso cuando creas una variedad de símbolos con el mismo nombre, se consideran símbolos diferentes.

Recuerda que las descripciones y los nombres son simplemente etiquetas que no afectan a nada.

Aquí tienes un ejemplo:

Javascript symbol type

let mySymbol1 = Symbol("mySymbol"); let mySymbol2 = Symbol("mySymbol"); console.log(mySymbol1 == mySymbol2); // false

En el caso anterior, los dos símbolos tienen la misma descripción, pero no son iguales.

Es importante saber que no es posible convertir automáticamente los símbolos a una cadena.

Por ejemplo, esta alerta dará un error:

Javascript symbol type

let mySymbol = Symbol("mySymbol"); console.log(mySymbol); // TypeError: Cannot convert a Symbol value to a string

Para mostrar un símbolo, necesitas llamar explícitamente a .toString() en él, como se muestra a continuación:

javascript symbol type

let mySymbol = Symbol("mySymbol"); console.log(mySymbol.toString()); // Symbol(mySymbol), now it works

Para obtener la propiedad symbol.description, llama:

Javascript symbol description

let mySymbol = Symbol("mySymbol"); console.log(mySymbol.description); // mySymbol

Acerca de las propiedades “ocultas”.

Con la ayuda de los símbolos, puedes crear fácilmente las llamadas propiedades "ocultas" de un objeto. Es imposible acceder a ellas o sobrescribirlas en otras partes del código.

En caso de que trabajes con objetos sitio pertenecientes a un código de terceros, necesitarás añadirles identificadores. Es necesario utilizar una clave de símbolo para ello, como sigue:

Javascript symbol key

let site = { // belongs to another code name: "W3Docs" }; let id = Symbol("id"); site[id] = 1; console.log(site[id]); // we can access the data using the symbol as the key

En otro caso, cuando otro script quiere tener su identificador dentro del sitio.

Puede ser otra biblioteca de JavaScript de manera que los scripts no se conocen entre sí.

Así, ese script puede crear su Symbol("id").

Por ejemplo:

// ...
let id = Symbol("id");
site[id] = "Their id value";

Símbolos en un literal

Para utilizar un símbolo en un literal de objeto, es necesario insertar corchetes alrededor de él.

Mira este ejemplo:

Javascript symbol

let id = Symbol("id"); let site = { name: "W3Docs", [id]: 100 // not "id: 100" }; console.log(site[id]);

Esto se debe a que necesitas el valor de la variable, id como la clave pero no la cadena "id".

El for…in omite los Símbolos

El bucle for..in no incluye propiedades simbólicas. Aquí tienes un ejemplo:

Javascript symbol for..in loop

let id = Symbol("id"); let site = { name: "W3Docs", [id]: 10 }; for (let key in site) { console.log(key); // name , no symbols } console.log("Direct: " + site[id]); // works the direct access by the symbol

Símbolos globales

Como ya hemos mencionado, los símbolos son únicos, incluso si tienen la misma descripción. Pero, a veces, puedes necesitar que los símbolos con el mismo nombre sean las mismas entidades. Por ejemplo, varias partes de tu aplicación desean acceder al símbolo "id" que significa la misma propiedad.

Para ello existe un registro global de símbolos. Permite crear símbolos dentro de él y acceder a ellos más tarde. Además, asegura que los accesos continuos con el mismo nombre muestren exactamente el mismo símbolo. Para leer un símbolo del registro global, se recomienda utilizar Symbol.for(key).

Usar esta llamada ayuda a comprobar el registro global. Entonces, si hay un símbolo, definido como key, será devuelto. De lo contrario, se creará un nuevo símbolo Symbol(key) y se almacenará en el registro con un key específico.

Se demuestra en el ejemplo de abajo:

Javascript symbol.for the global registry

// read from the global registry let id = Symbol.for("id"); // if this the symbol did not exist, it's created // read it again let idAgain = Symbol.for("id") // the same symbol console.log(id === idAgain); // true

Los símbolos que están dentro del registro son conocidos como símbolos globales. Puedes usarlos cuando quieres un símbolo a nivel de aplicación que tenga una entrada en todas partes del código.

Symbol.keyFor

Es posible utilizar una llamada inversa para los símbolos globales. Se puede hacer con la ayuda de Symbol.keyFor(sym). Esto hará lo contrario: devolverá un nombre por un símbolo global.

Para entenderlo mejor, echa un vistazo al siguiente ejemplo:

Javascript global symbol

// get symbol by name let sym1 = Symbol.for("siteName"); let sym2 = Symbol.for("id"); // get name by symbol console.log(Symbol.keyFor(sym1)); // siteName console.log(Symbol.keyFor(sym2)); // id

El Symbol.keyFor funcionará exclusivamente para símbolos globales. En caso de que el símbolo no sea global, no habrá opción de encontrarlo y devolverá undefined. En otras palabras, cada símbolo tiene una propiedad description.

Por ejemplo:

Javascript symbol description

let globalSymbol = Symbol.for("name"); let localSymbol = Symbol("name"); console.log(Symbol.keyFor(globalSymbol)); // name, global symbol console.log(Symbol.keyFor(localSymbol)); // undefined, not global console.log(localSymbol.description); // name

Símbolos del sistema

Internamente JavaScript usa una amplia gama de símbolos del sistema.

Aquí hay algunos de ellos:

Symbol.hasInstance
Symbol.iterator
Symbol.isConcatSpreadable
Symbol.toPrimitive

También existen muchos otros símbolos del sistema.

Por ejemplo, Symbol.toPrimitive está destinado a describir la conversión de objeto a primitivo.

Symbol.isConcatSpreadable se puede describir como un símbolo bastante específico. Dirige el comportamiento de Array#concat..

Resumen

En JavaScript, los símbolos garantizan un nivel de acceso único a los objetos. Todos los desarrolladores necesitan tener una comprensión básica de los símbolos y sus casos de uso.

Técnicamente, los símbolos no están completamente ocultos. Un método incorporado Object.getOwnPropertySymbols(obj) te permitirá recibir todos los símbolos. Existe otro método, llamado Reflect.ownKeys(obj),, que está destinado a devolver todas las claves de un objeto junto con las simbólicas. De todos modos, la mayoría de las bibliotecas, construcciones de sintaxis y funciones incorporadas evitan usar los métodos mencionados anteriormente.

Hora del Cuestionario: ¡Pon a Prueba Tus Habilidades!

¿Listo para desafiar lo que has aprendido? Sumérgete en nuestros cuestionarios interactivos para una comprensión más profunda y una forma divertida de reforzar tu conocimiento.