Cadenas

Cualquier conjunto de caracteres (letras, números, símbolos, etc.) entre un conjunto de comillas dobles ("), comillas simples (') o comillas simples (`) es una primitiva de string. Ya viste algunos ejemplos de cadenas en este curso: las instancias de console.log del módulo anterior contenían primitivas de cadenas.

console.log( "Hello, World." );
> Hello, World.

"Hello, World." es una primitiva de cadena. Obtienes el mismo resultado con comillas simples o acentos graves:

console.log( 'Hello, World.' );
> Hello, World.

console.log(`Hello, World.`);
> Hello, World.

Una serie de caracteres encerrados entre comillas se denomina literal de string. Las comillas dobles y simples se comportan de la misma manera y una puede contener la otra como un carácter en la string misma:

console.log( "I'm a string." );
> I'm a string.

console.log( '"A string," I said.' );
> "A string," I said.

Una instancia del mismo carácter de cierre dentro de la string "cierra" la string, lo que puede causar errores como los siguientes:

console.log( '"I'm a string," I said.' );
> Uncaught SyntaxError: missing ) after argument list

Para evitar esto, usa una barra inversa (``) para escapar el carácter:

console.log( '"I\'m a string," I said.' );
> "I'm a string," I said.

Objeto de string

Cuando se llama como función, el objeto String convierte un valor especificado en un literal de string.

let myString = String( 10 );

myString
> "10"

typeof myString
> string

Como se detalla en la herencia prototípica, rara vez necesitarás usar el objeto String como constructor. Crea un objeto de string que contiene el valor especificado, junto con los métodos y las propiedades que ya permite el objeto String, en lugar de un literal de string.

let stringObj = new String( "My new string." );

typeof stringObj
> object

stringObj
> String { "My new string." }

Concatenación

Cuando se usa en el contexto de cadenas en lugar de números, un solo signo más (+) actúa como un operador de concatenación y combina varios valores de cadena en una sola cadena:

console.log( "My" + " string." );
> My string.

Literales de string y literales de plantilla

Las comillas simples, las comillas dobles y las comillas simples se pueden usar indistintamente para crear primitivas de strings. Sin embargo, también puedes usar comillas simples para especificar literales de plantillas (a veces llamados "cadenas de plantillas"). A diferencia de los literales de string que se crean con comillas simples o dobles, los literales de plantilla permiten la interpolación de cadenas y las cadenas de varias líneas.

const myString = "This
is a string.";
> Uncaught SyntaxError: "" string literal contains an unescaped line break

const myString = `This
is a string.`;

console.log( myString );

> This
is a string.

Los literales de plantilla pueden contener expresiones de marcador de posición marcadas por un signo de dólar y llaves (${}). Estos marcadores de posición se “interpolan” de forma predeterminada, lo que significa que el resultado de la expresión reemplaza al marcador de posición en la string final.

console.log( "The result is " + ( 2 + 4 ) + "." );
> The result is 6.
console.log( `The result is ${ 2 + 4 }.` );
> The result is 6.

Se puede pasar un literal de plantilla a una función personalizada para crear una plantilla etiquetada, una llamada a función que usa un literal de plantilla único como un conjunto de argumentos y permite que sus marcadores de posición se propaguen según la lógica definida por el autor.

El primer argumento de una función de etiqueta contiene un array de valores de cadena, y los argumentos restantes definen los marcadores de posición. Este array de valores de cadena se crea mediante la "división" del literal de la plantilla en cada marcador de posición que contiene. El primer elemento del array contiene cualquier carácter hasta el primer marcador de posición, el segundo elemento contiene cualquier carácter entre el primero y el segundo, y así sucesivamente. Cada marcador de posición se pasa a la función de etiqueta como un valor independiente con un marcador de posición asociado.

const myNoun = "template literal";

function myTagFunction( myStrings, myPlaceholder ) {
    const myInitialString = myStrings[ 0 ];
    console.log( `${ myInitialString }modified ${ myPlaceholder }.` );
}

myTagFunction`I'm a ${ myNoun }.`;
> "I'm a modified template literal."

Verifica tus conocimientos

¿Qué carácter se usa para escapar caracteres?

Una barra inversa ()
Comillas dobles (")
Una barra diagonal (/)

¿Qué carácter se usa para la concatenación?

+
&
.