Työskentely merkkijonojen kanssa

Pikakertaus - Mikä olikaan merkkijono?

Merkkijono on käytännössä ohjelmointitermi tekstille. Merkkijonot esitetään yleensä jonkinlaisten merkkien välissä jotka kertovat mistä merkkijono alkaa ja mihin se päätty. JavaScriptissa tähän voidaan käyttää esimerkiksi hipsuja ('...'), lainausmerkkejä ("...").

let tervehdys = "Hei, maailma!";
console.log(tervehdys);  // tulostaa: Hei, maailma!

Merkkijonoilla voi tehdä paljon enemmän kuin vain tulostaa ne. Käydään tässä läpi joitakin yleisempiä käyttötapauksia.

Yleisiä merkkijonoihin liittyviä käyttötapauksia

Yhdistäminen

Yhdistäminen tarkoittaa kahden tai useamman merkkijonon yhdistämistä toisiinsa. JavaScriptissä tämä voidaan tehdä käyttäen + -operaattoria.

Esimerkki:

let etunimi = "Alice";
let sukunimi = "Smith";
let kokoNimi = etunimi + " " + sukunimi;
console.log(kokoNimi);  // tulostaa: Alice Smith

Pituusominaisuus

Jokaisella merkkijonolla on pituus-ominaisuus, joka kertoo merkkijonon merkkien lukumäärän.

Esimerkki:

let viesti = "Hei, maailma!";
console.log(viesti.length);  // tulostaa: 13

toUpperCase() ja toLowerCase()

Nämä metodit muuttavat merkkijonon isoiksi tai pieniksi kirjaimiksi.

Esimerkki:

let pienet = "hello";
console.log(pienet.toUpperCase());  // tulostaa: HELLO

let isot = "WORLD";
console.log(isot.toLowerCase());  // tulostaa: world

trim()

trim()-metodi poistaa kaikki välilyönnit merkkijonon alusta ja lopusta.

Esimerkki:

let sotkuinen = "   paljon tilaa   ";
console.log(sotkuinen.trim());  // tulostaa: "paljon tilaa"

slice()

JavaScriptin slice-metodi palauttaa osan merkkijonosta (tai itseasiassa myös taulukosta!) ilman että alkuperäinen muuttuja muuttuu. Se saa kaksi argumenttia: aloitusindeksi ja lopetusindeksi. Lopetusindeksiä ei ole pakko antaa, ja negatiiviset indeksit lasketaan lopusta käsin.

const teksti = "JavaScript";

// Vain aloitusindeksi: leikataan alusta eteenpäin
console.log(teksti.slice(4));    
// "Script"

// Aloitus- ja lopetusindeksi: leikataan indeksien välinen osa
console.log(teksti.slice(0, 4));  
// "Java"

// Negatiivinen aloitusindeksi: lasketaan lopusta
console.log(teksti.slice(-6));    
// "Script"

// Molemmat negatiivisina: osa lopusta
console.log(teksti.slice(-6, -3)); 
// "Scr"

indexOf()

indexOf()-metodi palauttaa kohdan (indeksin) merkkijonossa jossa haluttu merkkijono esiintyy, tai -1, jos sitä ei löydy.

Esimerkki:

let lause = "Hei, maailma!";
console.log(lause.indexOf("maailma"));  // tulostaa: 5

Templaatimerkkijonot (template strings)

Mikä ovat templaatimerkkijonot (template strings)?

Templaatimerkkijonot ovat uudehko tapa luoda merkkijonoja JavaScriptissä käyttäen "backtickejä" ` hipsujen tai lainausmerkkejen sijaan. Templaatimerkkijonoilla voit:

• Luoda monirivisiä merkkijonoja ilman escape-merkkejä.
• Sisällyttää helposti muuttujia ja lausekkeita merkkijonoon käyttäen syntaksia ${ ... }.
• Kirjoittaa helpommin luettavia merkkijonolausekkeita ilman kömpelöitä yhdistämisiä.

Template string syntaksi

Sen sijaan, että kirjoittaisit merkkijonoja vaikkapa lainausmerkkejä, suljetaan ne backtickeihin (`). Näiden merkkien sisällä voit lisätä lausekkeita ${ } -merkkien sisällä.

Esimerkki:

let nimi = "Alice";
let tervehdys = `Hei, ${nimi}!`; // Muuttuja 'nimi' interpoloidaan merkkijonoon.
console.log(tervehdys); // tulostaa: "Hei, Alice!"

Tässä esimerkissä:

• Merkkijono määritellään käyttäen takaisinlainauksia.
• ${nimi} -syntaksi käskee JavaScriptin evaluoida lauseke aaltosulkeiden sisällä ja lisätä sen arvo merkkijonoon.

Templaatimerkkijonojen edut

Yksinkertaisempi merkkijonon interpolointi

Sen sijaan että käyttäisit yhdistämistä + -operaattorilla (esim. "Hei, " + nimi + "!"), templaatimerkkijonot sallivat lausekkeiden upottamisen suoraan.

Monirivituki

Templaatimerkkijonoilla et tarvitse rivinvaihtoja sisältävien escape-merkkien (\n) käyttöä monirivisten merkkijonojen luomiseen.

Esimerkki:

let monirivi = `Tämä on merkkijono
joka ulottuu yli
useiden rivien.`;
console.log(monirivi);

Harjoitukset