JavaScriptLección 4 de 16

Cadenas y plantillas literales

Casi todo lo que un programa enseña a una persona es una cadena de texto. Las cadenas de JavaScript traen muchos métodos listos, y las plantillas entre comillas invertidas mezclan texto y valores sin un montón de signos más.

Lo esencial

length es la longitud, word[0] el primer carácter y word.at(-1) el último
toUpperCase() y toLowerCase() cambian mayúsculas y minúsculas; trim() quita los espacios de los extremos
slice(0, 3) recorta un trozo; includes("…") comprueba si un texto está dentro
Una plantilla literal: `Hi, ${name}!`, donde ${} admite cualquier expresión
Los métodos no cambian la cadena original: devuelven una nueva

Ejemplo

const word = "JavaScript";console.log(word.length);console.log(word.toUpperCase(), word[0], word.at(-1));console.log(word.slice(0, 4), word.includes("Script"));console.log("  hi  ".trim() + "!"); const user = "Lea";console.log(`Hi, ${user}! 2 + 3 = ${2 + 3}`);

Los métodos se pueden encadenar: primero trim y luego toUpperCase. Dentro de una plantilla, ${2 + 3} se calcula primero y después se inserta.

Tarea

Cómo usar el editor⌘ Enter o Ctrl Enter ejecuta el código, ⇧ ⌘ Enter comprueba la tarea.Tab y Mayús Tab sangran la línea o la selección; Esc y luego Tab sale del editor.La comprobación compara lo que imprimió el programa con la tarea; los espacios al final de línea no cuentan.Tras dos comprobaciones fallidas puedes ver la solución. Tu código se guarda en este navegador.

Una cafetería imprime el ticket del pedido. Limpia el nombre (sin espacios en los extremos y en mayúsculas), arma el código de recogida con las tres primeras letras de la bebida en mayúsculas, un guion y la longitud del nombre, e imprime tres líneas: Order for SAM: flat white, Total: 4.50 USD y Pickup code: FLA-3.

// A coffee app prints the order ticketconst rawName = "  sam  ";const drink = "flat white";const price = 4.5; // TODO: clean the name: no spaces around it, all capital lettersconst name = rawName;// TODO: pickup code = first 3 letters of the drink in capitals + "-" + name lengthconst code = ""; // TODO: print three lines with template literals:// Order for SAM: flat white// Total: 4.50 USD// Pickup code: FLA-3

// A coffee app prints the order ticket
const rawName = "  sam  ";
const drink = "flat white";
const price = 4.5;

// TODO: clean the name: no spaces around it, all capital letters
const name = rawName;
// TODO: pickup code = first 3 letters of the drink in capitals + "-" + name length
const code = "";

// TODO: print three lines with template literals:
// Order for SAM: flat white
// Total: 4.50 USD
// Pickup code: FLA-3

Salida

Aquí aparecerá lo que imprima el programa.