perjantai 13. marraskuuta 2015

Javascript kieli, ja Notepad++ asennus

JavaScript on alkujaan Netscape communication nimisen yrityksen kehittämä nettiympäristöön tarkoitettu komento, eli scriptikieli. JavaScriptin tekee mahdolliseksi lisätä Web-sivuille  toiminnallisuutta. Enemmän Javascriptistä voi lukea TÄÄLTÄ

Javascript on tavallisimmin osana selainta, tämä tekniikka sallii asiakaspuolen, eli webin katsojan skriptien toiminnan käyttäjän kanssa, selaimen rajoitetun hallinnan ja käyttäjälle näytettävän dokumenttisisällön muokkaamisen. JavaScriptiä voidaan käyttää myös palvelinten verkko-ohjelmoinnissa, pelien kehityksessä ja työpöytä- sekä mobiilisovellusten luomisessa. 

Javascriptillä ei ole mitään suoranaista tekoa Java ohjelmointikielen kanssa, vaikka ne toki jakavat paljon yhteistä kielen syntaksia ja molemmat ovat ns Olio-ohjelmointikieliä. Joten Javascriptillä voidaan opettaa ihan "oikeaa" ohjelmointia.

Javascript on valittu Suomessa ohjelmoinnin opetuksessa käytettäväksi kieleksi. Valinta on loistava, koska Javascript toimii selaimessa "hiekkalaatikossa", eli se ei pääse vaikuttamaan itse tietokoneeseen. Näin MIKÄÄN OHJELMOIJAN TEKEMÄ VIRHE EI VOI VAHINGOITTAA TIETOKONETTA.

Notepad++

Notepad++ on hyvä, ilmainen ja kevyt ohjelmointiympäristö. Voimme käyttää sitä hyvin yhdessä Javascriptin kanssa. Notepadistä löytyy myös Javascript kielen syntaksin tuki, ie se värittää oikein kirjoitetut sanat että koodia on aika helppo lukea. Notepad++ voidaan asentaa suomenkielisenä, joka helpottaa paljon oppilaiden ohjelman käyttöä.


Notepad++ alkusivu
Notepad++ löytyy vaikkapa TÄÄLTÄ. Asennus menee ihan normaalisti Windows koneella *.exe tiedostolla. (Ohjelma on saatavilla ainakin LINUXiin, mutta en käsittele asentamista LINUX ympäristöön.)  Asentaminen vaatii systeemioperaattorin oikeudet asennuksessa, joten sopiva tunnus ja salasana täytyy olla ennen asennusta. 

Kun asennus on saatu läpi ja Notepad++ käynnistetty, pitäisi näyttää suurinpiirtein tältä: 

Sitten täytyy enää valita käytetyksi ohjelmointikieleksi Javascript. Tämä tapahtuu välilehdeltä Koodikieli...J...Javascript


Nyt oikeastaan tarvitsee sitten enää kirjoittaa se perinteinen Hei Maailma ja ajaa se selaimessa, niin tiedämme että kaikki toimii kuin junan vessa.

Tehdään nämä Javascript esimerkit niin, että ne toimivat suoraan HTML-dokumentteina, niin että erillistä dokumenttia ei tarvita kutsumaan itse scriptiä. 

Lisään tähän itse ohjelmakoodin, ja lisäksi laitan kuvat Notepad++ miltä koodin PITÄISI näyttää editorin ohjelmointiympäristössä. 

Koodi tekee ensiksi varoitusikkunan kutsumalla "window.alert" ja kirjoittaa varsinaiseen dokumentin runkoon myös "Hei maailma" käytetty olio ja metodi on "document.write". Kaikki //tässä lukee jotain ovat kommentteja, jotka eivät vaikuta // merkin jälkeen ohjelman toimintaan.


<html> // webdokumentti alkaa
<head> //otsikkotiedot alkavat
<script type="text/javascript" xml:space="preserve">
//<![CDATA[ merkataan koodi XHTML-yhteensopivaksi

window.alert('Hei maailma!');

// CDATA-merkintä loppuu!]]>
</script> 
<title>JavaScript-esimerkki</title> //sivun otsikko siniseen pohjaan ylös
</head>
 <body> //varsinainen websivu alkaa
  <script language="JavaScript"> // ohjelmablokki alkaa, kieli JS
   document.write("Hei, maailma!"); // dokumenttiin kirjoittava osa
  </script>
 </body>
</html>
   
Muuten "ohjelma" on perus HTML-sivunkuvauskieltä. Eli dokumentti alkaa <html> ja päättyy </html>. Samoin kaikki muutkin koodit ovat AINA pareittain, ja aloittava koodi on "korpinnatsojen" sisällä ilman kauttamerkkiä, ja loputusmerkki on aina kauttamerkin kanssa.

Jos lukijalle HTML on tuttua, niin ainoa semmoinen huomionarvoinen seikka on tuo <script lanquage="javaScript"> joka ilmoittaa mitä scriptikieltä muutamasta mahdollisesta käytetään. Huomatkaa että scriptissä JOKAINEN ohjelmarivi päättyy ; merkkiin (puolipisteeseen). Samoin ohjemakoodiblokki päätetään tuolla </script> komennolla.
 
Kun scripti avataan normaaliin selaimeen, tulee ensiksi näkyviin varoitusikkuna jossa lukee hei maailma, ja OK kuittauksen jälkeen myös itse ikkunaan tulee lukemaan Hei maailma. 

Nyt ei muuta kuin testaaamaan..