¿Que es un Literal y en que se diferencia de una variable o constante?

publicado por: Anonymous

Buscando entender sobre las "plantillas literales" tuve curiosidad del nombre y me encontre con conceptos como:

  • "expresiones literales"
  • "cadenas literales"
  • "declaraciones literales"

También di con que en ámbitos de matemáticas y álgebra hay conceptos con nombre iguales.

La cuestión es que luego de consultar varias definiciones y buscar ejemplos no logre entender con claridad que es un literal, por el contrario tuve mas confusión, así que quisiera aplacar mis dudas de

  • ¿Que es exactamente un literal?
  • ¿como se define y usa un literal?
  • ¿que es una funcion literal?

solución

Aportando un poco más a lo ya respondido por @Rubén, trataré de explicarte lo que algunos autores llaman function literal y que tu has traducido (o copiado) en tu pregunta como función literal. Además, trataré de aclararte el propósito de un template literal que tu has traducido (o copiado) en tu pregunta como plantilla literal.

Template Literal (Template strings) – Plantilla de cadena de texto

Me voy a enfocar primero en el template literal.

Según la documentación de MDN, las plantillas de cadena de texto, son cadenas de texto (literal) que aceptan expresiones embedidas o incrustadas. Sin entrar mucho en detalle sobre cómo JavaScript procesa una plantilla de texto, lo que sucede internamente es que la plantilla es pasada por una función que evalúa la expresión embedida, y concatena toda la plantilla dando como resultado final una cadena de texto (string).

Ya hemos visto en la respuesta de @Rubén que lo siguiente es un literal de tipo cadena:

'literal'

o

"literal"

Una plantilla, en cambio comienza y termina con un back-tick o acento grave (el mismo usado para indicar código en el MarkDown de StackOverflow). Por ejemplo:

`Plantilla de texto`

Lo que podemos hacer con una plantilla de texto (y que no funciona en un literal de tipo cadena), es incrustarle una expresión. Por ejemplo:

`Plantilla de texto ${true ? 1 : 0}`

Lo cual mostrará:

'Plantilla de texto 1'

Notemos que la expresión usada entre las llaves (${ }) es código de JavaScript.

Podemos asignar una plantilla de cadena de texto a una variable, tal como lo hacemos con las expresiones literales ya mencionadas, por ejemplo:

const miPlantillaLiteral = `Plantilla de texto ${true ? 1 : 0}`;

Por lo tanto, una plantilla de cadena de texto es una forma de crear cadenas de texto con expresiones embedidas. Algo muy útil, cuando necesitamos usar algún tipo de plantilla para mostrar mensajes o información sin repetir código, y de una manera un poco más intuitiva. Por ejemplo:

_x000D_

_x000D_

let valor = 0;_x000D_
//el siguiente bucle imprime en pantalla los valores del 0 al 4_x000D_
for(let i = 0; i < 5; i++){_x000D_
  let plantilla = `El valor es: ${valor++}`;_x000D_
  console.log(plantilla);_x000D_
}

_x000D_

_x000D_

_x000D_

El propósito de las mismas, es usarla en expresiones mucho más complejas, donde los saltos de línea sean considerados como tal.

Uno de los usos más extendidos se encuentra en los frameworks para el frontend. Angular, por ejemplo, usa una plantilla de cadena de texto en una variable llamada template dentro de un componente. Esta forma de generar el código de la vista y ponerlo en una variable dentro del componente es conocida como inline template.

Función Literal (según algunos autores)

Me he topado con textos, en lo cuales el autor usa la expresión function literals.

Sin embargo, esta definición no es parte del estándar ECMA.

Por algún motivo el significado que todos los autores que usan la expresión function literal es el mismo:

Función Literal: Es una expresión que permite asignarle a una variable una función sin que la misma tenga un nombre.

Recordemos que en JavaScript, la declaración de funciones se realiza de la siguiente forma (no se muestran todos los detalles de la documentación):

function miFuncion (<parametros>) { <cuerpo> }

Observamos que la función tiene un identificador (Binding Identifier), que nos va a permitir utilizar o ejecutar la función en alguna otra parte del código.

Si deseo usar o llamar a la función, sólo debo invocar a la misma por su nombre identificador seguido de paréntesis (en este caso así: miFuncion()), pasarle los argumentos necesarios (o no) y la misma será ejecutada.

No tiene mucho sentido declarar funciones sin ponerle un nombre, y si lo hiciéramos obtendríamos un error de Sintaxis:

SyntaxError: Function statements require a function name

Sin embargo, existe una forma de asignar una función a una variable (en inglés el término es conocido como name binding). Con esto decimos que se asocia a un identificador de memoria (variable) el código (en este caso) de una función.

Si la declaración de la función que estamos asignando a nuestra variable contiene un nombre, el mismo será un identificador sólo visible dentro de la variable. Esto significa que el nombre de la función no estará disponible en el ámbito global o al ámbito al que pertenezca la variable.

Por ejemplo:

_x000D_

_x000D_

let miFuncion = function conNombre() {_x000D_
  console.log('Esto es una función.');_x000D_
  }_x000D_
  _x000D_
// imprime una descripcion del objeto miFuncion_x000D_
// notemos el nombre de la funcion_x000D_
console.log(miFuncion);_x000D_
_x000D_
// imprime el mensaje_x000D_
miFuncion();_x000D_
_x000D_
// lanza un error de referencia_x000D_
conNombre();

_x000D_

_x000D_

_x000D_

Ahora, veamos qué sucede si asignamos a una variable el código de declaración de una función sin nombre de identificador. Es a este tipo de declaraciones que se asignan a variables lo que algunos autores llaman function literal.

_x000D_

_x000D_

let miFuncion = function(){_x000D_
  console.log('Esto es una función');_x000D_
  }_x000D_
_x000D_
// imprime una descripcion del objeto miFuncion_x000D_
// notemos que la función no tiene nombre_x000D_
console.log(miFuncion);_x000D_
_x000D_
miFuncion();

_x000D_

_x000D_

_x000D_

Con el auge de los procesos asíncronos y las llamadas funciones callback, y además, con la introducción en el lenguaje de las funciones flecha, el término function literal fue quedando en desuso y los autores comenzaron a utilizar el término (que tampoco es parte del estándar) anonymous function que se traduce como función anónima, un término más adecuado a la declaración de una función sin asignarle un identificador o nombre.

Lo importante de todo esto, es que a diferencia de los literales de tipos de dato que ya se han mencionado:

No existe en la documentación nada parecido a un Literal de función. Y es que lo que algunos autores llaman así, realmente no es una expresión literal tal como las que hemos visto y que sí forman parte del lenguaje.

Espero que esto aclare un poco más tu duda.

Respondido por: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *