JavaScript 0 - introductie

• Informatica
• WO
• Studiejaar 4,5

                      JavaScript

Hoofdstuk 7; Interactief

Ontwikkelen met Javascript (JS)

Werk de opdrachten 24 tot en met 31 uit het boekje door (hoofdstuk 7 en 8). Je mag de codes verwerken in je eigen website. Zet de bestanden in een apart mapje en lever het in een .zip file in. 

Leerdoelen:

1. Je kunt uitleggen wat JS is
2. Je kunt uitleggen waar JS voor "is"
3. Je kunt drie voorbeelden geven van waar JS voor wordt gebruikt

Rode achtergrond betekent: klas is stil, dit zijn de leerdoelen en quizzes waarbij niet overlegd mag worden.

Doel van deze les is om het leren zichtbaar te maken voor zowel leerling als docent.

JavaScript - wat is het?

JavaScript (hierna: JS) was vroeger een scripttaal

JS kan geen op zichzelf staand programma maken, daarom zeggen sommigen dat het geen echte programmeertaal is

(maar ik vind het wel een echte programmeertaal)

JS heeft NIETS te maken met Java!

JavaScript - waar is het voor?

JS wordt voornamelijk gebruikt in webomgevingen, net als HTML en CSS

Je kunt JS gebruiken:

• op een website (server-side)
• maar ook lokaal (client-side)

Je kunt Visual Studio Code (VS Code) gebruiken voor JS
Met JS kun je dingen maken zoals: mobiele applicaties, VR, reserveringssystemen, spellen, animaties, datavisualisatie, en meer

Opdracht # 1

1. bekijk de code:
2. Sla het op als:
   index0_1.htm
3. Open het bestand
   in je browser
4. Wat gebeurt er? Welke functie van JS doet dat?

Opdracht # 2

1. Kopieer de code
   rechts
2. Sla het op als:
   index0_2.htm
3. Open het bestand
   in je browser
4. Wat gebeurt er? Waarom?

Opdracht # 3

1. Bekijk de code
   rechts
2. Hoe kan deze code
   efficiënter?
3. Je hebt 1 minuut
   

Opdracht # 4

1. Kopieer de code
   rechts
2. Sla het op als:
   index0_4.htm
3. Open het bestand
   in je browser
4. Hoe verschilt deze code van die van opdracht #3?

Opdracht # 5

1. Bekijk de code
   rechts 
2. Neem 2 minuten
   om de code te
   begrijpen
3. Hoe kan dit
   efficiënter?

JavaScript vs Python

Veel van de logica van Python gaat ook op voor JS, zoals:

• if-statements
• for-loops
• while loops

Maar, ze zijn wel degelijk verschillend!

JavaScript code

Zie de code rechtsonder, komt dat je bekend voor?

JavaScript vs Python

Het verschil zit in een aantal kleine dingen, zoals het gebruik van { } voor code-blokken, en het gebruik van ;

JavaScript vs Python

Ook functies worden anders gemaakt in JS:

JavaScript vs Python

Het aanroepen gaat echter wel hetzelfde:

JavaScript:

                       add()

           Python:

                              add()

JavaScript vs Python

Waar we in Python vaak iets lieten zien via print, gaat dat bij JS via console.log:

JS:                                                  Python:

 console.log("Hello World!");             print("Hello World!")

maarrrrrr...

Nu volgen er enkele vragen

Welke van onderstaande opties is geen netwerk?

1. ARPA
2. LAN
3. WAN
4. PAN

Leerdoelen:

1. Je kunt uitleggen wat JS is
   
2. Je kunt uitleggen waar JS voor "is"
   
3. Je kunt drie overeenkomsten noemen tussen JS en Python
   
4. Je kunt drie verschillen noemen tussen JS en Python
   
5. Je kunt drie voorbeelden geven van waar JS voor wordt gebruikt

Rode achtergrond betekent: klas is stil, dit zijn de leerdoelen en quizzes waarbij niet overlegd mag worden.

Doel van deze les is om het leren zichtbaar te maken voor zowel leerling als docent.

En nu?

Je kunt nu kiezen uit:

• verder werken aan je PO netwerken
• Fundament huiswerk doen
• opzoeken in w3schools hoe je met JavaScript:
  a) met 1 knop tussen blauw en rood toggelt
  b) een dark-modus maakt van een index0_2.html