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 (

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 tarkoittaa kahden tai useamman merkkijonon yhdistämistä toisiinsa. JavaScriptissä tämä voidaan tehdä käyttäen 

-ominaisuus, joka kertoo merkkijonon merkkien lukumäärän.

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

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

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.

-metodi palauttaa kohdan (indeksin) merkkijonossa jossa haluttu merkkijono esiintyy, tai 

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ä.

Sen sijaan, että kirjoittaisit merkkijonoja vaikkapa lainausmerkkejä, suljetaan ne backtickeihin (

). Näiden merkkien sisällä voit lisätä 

Merkkijono määritellään käyttäen takaisinlainauksia.

 -syntaksi käskee JavaScriptin evaluoida lauseke aaltosulkeiden sisällä ja lisätä sen arvo merkkijonoon.

Yksinkertaisempi merkkijonon interpolointi

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

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

Tulosta viesti ja sen pituus käyttäen console.logia.

index.js

index.test.js

Luo ja tulosta merkkijono sen pituuden kanssa

Muuttamatta itse name muuttujan arvoa, tulosta sen arvo isoina kirjaimina käyttäen 

Ja samalla tavalla tulosta muuttuja pienillä kirjaimilla käyttäen toLowerCase()-funktiota.

Muuta merkkijonon kirjainkoko

 (ylimääräisillä välilyönneillä alussa ja lopussa; tarkka määrä välilyöntejä ei ole oleellinen).

Trimmaa merkkijono

Alimerkkijonon poiminta slice()-metodilla

 ja anna sille arvoksi joku nimi, vaikka "Jaska".

 käyttäen template stringiä, joka lisää 

 lauseeseen (esimerkiksi: "Hei, Jaska!").

Luo tervehdysviesti

, joka käyttää mallipohjaan sisällytettyä monirivistä merkkijonoa.

Viestisi tulisi sisältää vähintään kolme riviä.

Luo monirivinen viesti

## 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ä (**"..."**).

```javascript
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:

```javascript
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:

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

### toUpperCase() ja toLowerCase()

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

Esimerkki:

```javascript
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:**

```javascript
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.

```javascript
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:**

```javascript
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:**

```javascript
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:**

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

---

## Harjoitukset

@exercise d248fb96f3ba

@exercise fb3a505b8dd6

@exercise e3d6dbe9cd62

@exercise 425d9a7c608b

@exercise 4e9efe301264

@exercise 5f7cc3f768f7


- Luo muuttuja nimeltä **message** ja anna sille arvoksi "Hei, maailma!".
- Tulosta viesti ja sen pituus käyttäen console.logia.

- Luo muuttuja nimeltä **name** ja anna sille arvoksi "Alice".
- Muuttamatta itse name muuttujan arvoa, tulosta sen arvo isoina kirjaimina käyttäen **toUpperCase()**-funktiota.
- Ja samalla tavalla tulosta muuttuja pienillä kirjaimilla käyttäen toLowerCase()-funktiota.

- Luo muuttuja nimeltään **fullText** ja anna sille arvoksi **" Hello "** (ylimääräisillä välilyönneillä alussa ja lopussa; tarkka määrä välilyöntejä ei ole oleellinen).
- Luo toinen muuttuja nimeltään **trimmedText**, joka pitää sisällään **fullText**-muuttujan trimmatun version **trim()**-funktiota käyttäen.
- Tulosta **trimmedText** käyttäen **console.log**-funktiota.

- Määritä muuttuja **message** arvolla **"Hello, JavaScript World!"**.
- Käytä **slice()**-metodia poimiaksesi alimerkkijonon **"JavaScript"**, ja tallenna se muuttujaan **substring**.
- Tulosta se konsoliin.

- Luo muuttuja nimeltä **nimi** ja anna sille arvoksi joku nimi, vaikka "Jaska".
- Luo toinen muuttuja **tervehdys** käyttäen template stringiä, joka lisää **nimen** lauseeseen (esimerkiksi: "Hei, Jaska!").
- Tulosta **tervehdys** käyttäen console.log.

- Luo muuttuja nimeltään **viesti**, joka käyttää mallipohjaan sisällytettyä monirivistä merkkijonoa.
- Viestisi tulisi sisältää vähintään kolme riviä.
- Tulosta viesti käyttäen console.logia.

Työskentely merkkijonojen kanssa

Opi ohjelmointia JavaScriptilla, joka voi hyvinkin olla nykymaailmassa tärkein ja monipuolisin ohjelmointikieli, ainakin web-kehityksessä.

Tervetuloa Hakatemian aloittelijaystävälliselle JavaScript-kurssille, jossa opit ohjelmoinnin perusteet JavaScriptilla.

Nykymaailmassa JavaScript on yksi suosituimmista ja monipuolisimmista ohjelmointikielistä, erityisesti web-kehityksessä jossa JavaScriptilla on ainutlaatuinen asema - mitään muuta ohjelmointikieltä ei voi suorittaa sekä selaimen että palvelimen päässä. Tästä syystä JavaScript on noussut äärimmäisen suosituksi, ja sitä käytetään sekä käyttöliittymien (React, Vue, Angular, Svelte, yms), taustajärjestelmien (NodeJS / Express, HAPI, yms), että molempien yhdistelmien (NextJS, NuxtJS, jne). kehittämiseen.

Näitä JavaScript-kehikoita tullaan käsittelemään Hakatemian myöhemmillä kursseilla, mutta ennen kun päästään sinne asti niin meidän täytyy ensin opetella JavaScript-ohjelmoinnin perusteet, ja sitä varten tämä kurssi on tehty.

Kurssin aikana opit keskeisiä ohjelmointikonsepteja, kuten muuttujat, operaattorit, ehtorakenteet, funktiot, taulukot ja oliot. Jokainen moduuli on jaettu pieniin osiin, joissa on runsaasti käytännön harjoituksia.

Tämä kurssi julkaistaan beta-kokeiluun ensimmäisenä palasena Hakatemian web-kehitys -kokonaisuutta, ja ensimmäisenä kurssina joka käyttää Hakatemian uutta ohjelmointiharjoitusympäristöä. Ilmoitathan sivun alalaidassa olevalla palautenapilla tai Discordissa jos huomaat ongelmia!

Työskentely merkkijonojen kanssa

Pikakertaus - Mikä olikaan merkkijono?

Hakkeroinnin oppiminen alkaa tästä