Ohjelmoinnin perusrakenteet javascriptillä

Sorakuilu

Sisältö

  1. Alkuun
  2. Työvälineet ja ympäristö, Javascriptin kirjoittaminen
  3. Muuttujat ja tietotyypit
  4. Operaattorit
  5. Ehtolauseet, boolean
  6. Funktiot (lohkot)
  7. Taulukot ja toistorakenteet
  8. Muut toistorakenteet

Javascript, työvälineet ja ympäristö

Javascript on kehitetty luettavaksi selain-ohjelmilla (esim. Chrome, Netscape jne), se voi muuttaa sivun ulkoasua tai lisätä toiminnallisuutta sivun sisältöön. Aikaisemmissa versioissa jokaista selainta varten oli oma skriptikielensä, nykyään käytettävät versiot toimivat kaikissa uusisa selaimissa. Javascript on nimensä mukaisesti skriptikieli, selain lukee ihmisenkin ymmärtämää koodia ylhäältä alas ja tulkitsee sitä. Java-ohjelmointikieli on eri asia kuin Javascript, Java käännetään virtuaalikoneen suoritettavaksi lähdekoodiksi, jota ihminen ei voi lukea.

Työvälineet

VSCode

konsoli

Kuinka toimit

Käytä kahta tiedostoa:

1. html-tiedosto, jossa on seuraava runko:

runko.html

<!DOCTYPE html>
<html lang="fi">
<head>
<meta charset="UTF-8">
<title>Mallipohja</title>
<script type="text/javascript" src="js1.js"></script>
</head>
<body>
</body>
</html>
1

head-elementissä oleva lause <script type="text/Javascript" src="jotain.js"></script> liittää Javascriptin html-tiedostoon.

Javascript-tiedosto, jolla tulostamme komennolla console.log konsoliin tuloksen:

js1.js

//demo 1
console.log('Hei!');

Nimeä rungot ja Javascript -tiedostot tehtävän mukaan:
harjoitus 1: harj1.html ja harj1.js
HTML-osasta vaihtuu kohta src eli viitataan siihen harjoitukseen kuuluvaan Javascript-tiedostoon.

Avaa html-tiedosto web-selaimessa - sen voi raahata sinne, avata tai tiedoston ollessa auki VSCoden ikkunassa välilehdeltä Terminal - Run Active File. Konsolista näet ohjelman tulostuksen.

Javascriptin kirjoittaminen

Pelkällä Javascriptillä ei siis voi tulostaa mitään. Tietojen syöttämiseen ja vastausten tulostamiseen käytetään tavallisesti HTML:ää (DOM). Tässä jaksossa käytämme tulostamiseen HTML-sivua ja katsomme vastaukset konsolilta (Ctrl + Shift + I).

Kirjoittamisen sääntöjä