Strings en sjabloonliteralen

"5" + 3 geeft "53", niet 8. Als één kant van + een string is, voegt JavaScript tekst samen in plaats van getallen op te tellen.

Tekst in een programma

Namen, berichten, adressen, wachtwoorden en hele webpagina's zijn allemaal tekst en JavaScript slaat tekst op als strings. Een string is een reeks tekens tussen aanhalingstekens. JavaScript accepteert drie soorten aanhalingstekens: dubbel "zoals dit", enkel 'zoals dit' en backticks `zoals dit`. De eerste twee gedragen zich hetzelfde. Backticks maken een sjabloonliteral, met extra mogelijkheden die hieronder worden besproken.

Als je tekst één soort aanhalingsteken bevat, zet je de andere eromheen: "It's late" werkt omdat de apostrof geen dubbel aanhalingsteken is. Je kunt ook een backslash vóór een aanhalingsteken zetten om te zeggen ‘dit hoort bij de tekst’: 'It\'s late'. Een backslash gevolgd door n, geschreven als \n, betekent een regeleinde binnen de string.

Lengte en posities

Elke string weet hoeveel tekens hij heeft: "JavaScript".length is 10. Elk teken heeft ook een positie, de index, en tellen begint bij 0, niet bij 1. Dus in "JavaScript" is index 0 de J, index 4 de S en de laatste index 9, één minder dan de lengte. Je leest één teken met vierkante haken: word[0]. Beginnen bij 0 voelt eerst vreemd, maar de meeste programmeertalen tellen zo en je ziet het terug bij arrays.

const word = "JavaScript";
console.log(word.length);                // 10
console.log(word[0]);                    // J
console.log(word[word.length - 1]);      // t

Handige stringmethoden

Strings hebben ingebouwde hulpmiddelen, methoden, die je aanroept met een punt na de string. toUpperCase() en toLowerCase() geven een kopie in hoofdletters of kleine letters terug. includes("Script") geeft true of false, afhankelijk van of de tekst erin voorkomt. slice(0, 4) geeft de tekens vanaf index 0 tot, maar niet inclusief, index 4, wat in "JavaScript" gelijk is aan "Java". trim() verwijdert spaties aan beide uiteinden, handig om invoer op te schonen. Geen hiervan verandert de oorspronkelijke string. Strings in JavaScript kun je niet ter plekke veranderen; methoden geven altijd een nieuwe string terug.

Strings samenvoegen met +

De operator + voegt strings achter elkaar samen, wat concatenatie heet. "Hello, " + "Mina" geeft "Hello, Mina". Spaties worden niet automatisch toegevoegd, dus zet ze zelf tussen de aanhalingstekens. Hier is de valkuil uit de inleiding: als één kant van + een string is, zet JavaScript de andere kant ook om in een string en voegt ze samen. "5" + 3 is "53". De andere rekenoperatoren voegen geen tekst samen, dus "5" * 2 zet "5" om in een getal en geeft 10. Gebruik Number("5") om een string met cijfers om te zetten in een echt getal.

Sjabloonliteralen

Een zin bouwen met + wordt snel rommelig: name + " is " + age + " years old." vraagt zorgvuldige spaties en aanhalingstekens. Met een sjabloonliteral, geschreven met backticks, kun je waarden direct in de tekst zetten met ${ }. Wat tussen de accolades staat, wordt als expressie geëvalueerd en het resultaat komt in de string. Sjabloonliteralen kunnen ook meerdere regels beslaan.

const name = "Mina";
const age = 14;
console.log(`${name} is ${age} years old.`);   // Mina is 14 years old.
console.log(`Next year: ${age + 1}`);           // Next year: 15

Uitgewerkt voorbeeld. Op een winkeletiket moet "3 apples cost 4.5" staan. Met const n = 3, price = 1.5; doet het sjabloon `${n} apples cost ${n * price}` dat op één regel en vindt de vermenigvuldiging binnen de accolades plaats.