JavaScript
JAVASCRIPTIIN LIITTYVÄÄ KOULUTUSTA VUONNA 2025!
Kurssit saatavilla kautta Suomen. Tule ja varaa oma koulutustapahtumasi heti! Koulutuksen järjestää asiantuntijasi Koulutus- ja konsultointipalvelu KK Mediat.
JavaScriptin peruskäsitteet - tapahtumat, oliot, ominaisuudet ja metodit
JavaScript-ohjelmoinnin ytimessä ovat vuorovaikutus, rakenteet ja toiminnallisuus. Näitä kuvataan neljän käsitteen kautta: tapahtumat, oliot, ominaisuudet ja metodit.
Tapahtumat
JavaScript on tapahtumaohjautunut eli reaktiivinen ohjelmointikieli. Käytännön JavaScript-kehityksestä merkittävä osa rakentuu tapahtumankuuntelijoiden ympärille. Tapahtumankuuntelijoiden avulla JavaScript voi reagoida käyttäjän toimiin tai ympäristössä tapahtuviin muutoksiin, kuten painikkeen klikkaamiseen tai sivun latauksen valmistumiseen. Nämä tapahtumat on määritelty osaksi W3C:n DOM-events spesifikaatioita.
Seuraava koodiesimerkki liittää toiminnon HTML-painikkeeseen. Kun käyttäjä painaa painiketta, JavaScript näyttää ilmoituslaatikon, jossa lukee "JavaScript esimerkki":
<input type="button" onclick="alert('JavaScript esimerkki');" />
Oliot ja ominaisuudet
Olio on ohjelmointirakenne, joka yhdistää tietorakenteen ja siihen liittyvät toiminnot. Olion tunnistaa siitä, että se on asian abstrakti edustaja. Kun oliosta luodaan todellisia vastineita, puhutaan ilmentymistä. Esimerkiksi kuusi (puulaji) on olio, ja kaikki ulkona kasvavat kuusipuut ovat kuusipuu-olion ilmentymiä, joista jokaisella on yksilölliset erityispiirteensä.
Oliopohjainen lähestymistapa on olennainen osa JavaScriptiä.
JavaScriptin hyödyntää useita selainympäristöön sisäänrakenettuja oliomalleja, joista keskeisimmät ovat selainympäristön DOM (Document Object Model)
sekä BOM (Browser Object Model). Esimerkiksi navigator
tarjoaa pääsyn selaimen tietoihin, document
käsiteltävään nettisivuun.
Esimerkiksi Document-olion bgcolor-ominaisuuden avulla voimme muuttaa dokumentin taustavärin dynaamisesti:
<p onclick="document.bgColor='black';">Vaihda taustaväri</p>
JavaScript on nk. prototyyppipohjainen kieli, mikä tarkoittaa, että se ei käytä luokkia – toisin kuin monet muut oliopohjaiset kielet – vaan olioiden periytyminen tapahtuu prototyyppien kautta. Tämä malli tekee JavaScriptistä joustavan ja dynaamisen, sillä olioiden toiminnallisuuksia voi laajentaa ja muokata helposti.
Metodit
JavaScriptin oliot voivat sisältää myös metodeja, jotka ovat olion sisältämiä toimintoja. Metodi määrittelee, mitä olion tulisi tehdä, kun tietty komento annetaan. Esimerkiksi selainikkunan avaaminen tai tekstin lisääminen sivulle voidaan toteuttaa metodeilla. Metodikutsu ketjutetaan osaksi oliota pisteen (.) avulla - muuten metodia kutsutaan samalla syntaksilla kuin JavaScriptin funktiota.
<p onclick="window.open()">Avaa uusi ikkuna</p>