Interpolación De Cadenas De Javascript

Michael Zippo 04.11.2021

La interpolación de cadenas JavaScript es el proceso de incrustar una expresión en parte de una cadena. Se utiliza un literal de plantilla para expresiones incrustadas. Puede agregar valores, como variables y operaciones matemáticas, a una cadena mediante interpolación.

¿Necesita agregar un valor en una cadena de JavaScript? La sintaxis del patrón literal lo tiene cubierto. Los literales de plantilla facilitan el trabajo con cadenas de varias líneas y valores de JavaScript anidados en una cadena. Los literales de patrones son sintaxis de interpolación de cadenas de JavaScript.

En esta guía, vamos a hablar sobre la interpolación de cadenas de JavaScript. Discutiremos qué es, cómo funciona y veremos un ejemplo de interpolación de cadenas para que pueda comenzar.

Sin más preámbulos, ¡comencemos!

Cadena de interpolación de JavaScript

Puede agregar valores ‚Äã‚Äãa una cadena de JavaScript utilizando un literal de plantilla. Este es un signo de dólar seguido de dos llaves. Dentro de las llaves debe estar la expresión cuyo valor desea incrustar en la cadena.

Los patrones literales le permiten anidar valores ‚Äã‚Äãen una cadena sin depender de la concatenación. Para declarar un patrón literal, la cadena debe estar entre comillas simples (") en lugar de comillas dobles

Considere la siguiente sintaxis:.

Hemos declarado un patrón literal, nuestra expresión es:

esta expresión devuelve 9 + 10. el El resultado de esta expresión se agrega al final de nuestra cadena, antes del punto. De hecho, escribimos nuestra expresión antes del punto.

Cadena de interpolación JavaScript, por ejemplo

Las plantillas de literales le permiten a los valores ‚Äã‚Äãdirectamente en una cadena anidada. Considere este código:

La primera línea de código define el número de dirección del primer ministro. Luego usamos la plantilla de literales para crear la dirección completa. impuesto $ {} se utiliza para i Integrar valor en nuestra cadena. Agregamos el valor de "número_dirección" a la cadena

Deje que nuestro código se ejecute:

Nuestro código fusionó nuestras dos cadenas.

Al usar patrones literales, puede incrustar un valor en el sentido literal. Esto incluye una cadena, un número o el resultado de un Cálculo matemático de JavaScript . No debe incrustar un literal de plantilla en un literal de plantilla.

Una de las principales ventajas de las cadenas literales es ... que su sintaxis es clara que podemos incrustar nuestro código javascript directamente en nuestra cadena

Podemos unir cadenas usando la concatenación Digamos que tenemos dos st anillos:.

Puedes concatenar dos cadenas usando el signo más (+):

La consola JavaScript registra el siguiente valor:

Hemos logrado crear una cadena que conecta nuestras dos cuerdas. En última instancia, usamos el operador de concatenación para agregar un punto ("") a nuestra oración

Pero esta sintaxis tiene un inconveniente:. No puede agregar valores ‚Äã‚Äãal final de una cadena. Esta es una gran razón detrás de la introducción de la sintaxis de plantilla literal. Ahora es más fácil agregar valores ‚Äã‚Äãen medio de una cadena

JavaScript para la interpolación de cadenas. Cálculos

El código en un literal de plantilla es una declaración de JavaScript. Esto significa que puede usar patrones literales para realizar cálculos e incrustar sus valores ‚Äã‚Äãen un programa.

Vamos a crear una cadena que calcula el precio de dos bebidas en un Baré y pone el resultado en una cadena:

En la sintaxis $ {}, agregamos un cálculo. Este cálculo suma los valores ‚Äã‚Äão de dos variables de JavaScript juntas. Nuestras variables son bebida1 (2,30) y bebida2 (2,20) juntas. Nuestro código devuelve una cadena con la suma de estos valores:

JavaScript para la interpolación de cadenas: operadores ternarios

Operadores ternarios de JavaScript < /a> le permite evaluar si una declaración es verdadera o falsa. Son una forma más concisa de escribir una sentencia if. Los operadores ternarios son especialmente útiles si el resultado de una instrucción if tomará una sola línea de código

Si un cliente gasta más de $ 4.00 en sus cafés, se le debe presentar la factura. Luego, se le debe invitar a unirse a la lealtad del café. club de tarjetas. De lo contrario, debe presentarse a la factura. Podríamos usar un operador ternario para verificar el costo de la factura de un cliente:

Nuestro patrón literal contiene dos expresiones integradas. integrar el valor de "total" dentro de nuestra cadena. Luego, usamos un operador ternario para verificar si se debe invitar a un cliente a unirse a la cafetería del club de tarjetas de fidelización

Si el precio total de compra es superior a $4,00, la consola imprimirá el siguiente mensaje:

De lo contrario, nuestro operador ternario devuelve el valor después de los dos puntos (":") .. Este es el valor que se devuelve cuando un expresión se evalúa como Falso.

En nuestro ejemplo, el valor después de los dos puntos es una cadena vacía. Esto significa que si es menos de $ 4.00, solo la compra de un cliente se devuelve la primera oración de nuestra plantilla literal:

Conclusión

Los literales de plantilla le permiten incrustar un valor en una cadena. Puede realizar cálculos en un modelo literal. Declaramos los literales del patrón usando los acentos graves. Las declaraciones a evaluar se indican con un signo de dólar y un par de corchetes dentro de los cuales aparece la declaración

Para obtener sugerencias sobre cómo obtener más información sobre JavaScript, consulte la Guía de aprendizaje de JavaScript .