JahveScript

Den kabbalistiske version af JavaScript. Vi siger tak til min telefon og dens dårlige tastatur.

Events

Events sker hele tiden - siden loader, musen føres hen over noget eller brugeren klikker på et eller andet.
Event handlers bruges til at styre hvad der skal ske i tilfælde af et event. Her er nogle event-navne:

onload

onclick

onmouseover

onblur

onfocus

Her er et helt simpelt eksempel på brug af en event:

onclick="alert('Hej med dig');"

Her er et lidt mere kompliceret eksempel med event handlersne onblur og onfocus:

var emailField = document.getElementById("email");

emailField.onfocus = function() {

   if ( emailField.value=="your email") {
   };

emailField.onblur = function() {
   if (emailField.value == "") {
   emailField.value = "your email";
   }
};

Timers

Der er tre forskellige timers:

setTimeout: Denne funktion gør, at man kan indsætte en enkelt event efter et stykke tid er gået. 

setInterval: Denne funktion skaber et loop, hvor en event indtræffer hver gang et antal sekunder er gået. 

clearInterval: Denne funktion "resetter" setInterval.

Tid angives i millisekunder.

Her er et eksempel fra Lynda.com på en billedserie med timer:

var myImage = document.getElementById("mainImage");


var imageArray = ["_images/overlook.jpg", "_images/winery.jpg", "_images/lunch.jpg"];


var imageIndex = 0;

function changeImage() {
   myImage.setAttribute("src", imageArray[imageIndex]);

   imageIndex++;

   if (imageIndex >= imageArray.length) {

        imageIndex = 0;
   }

}


setInterval(changeImage,5000);

Scriptet her henter altså et billede fra en lille array af billeder. 

Linking

Det er egentlig ret intuitivt, når man har arbejdet med CSS, men bare som en reminder til mig selv:
JavaScript kan skrives inline, det kan skrives i header eller man kan linke til det i et separat dokument.
Det sidste gøres sådan her:

<script src="path/myscript.js" type="text/javascript"></script>

Type er ikke strengt nødvendigt, men bare meget god stil. 

Lynda.com-instruktøren anbefaler, at man indsætter scriptet nederst på siden, så hele siden når at indlæse inden scriptet kommer med. 

Hvad er et objekt?

Lad os sige for nemheds skyld, at et objekt er en slags beholder, der samler koncept og handling. 

Et objekt giver mulighed for at samle funktioner og variable, og give dem et fælles navn.

Her er nogle eksempler på objekter:

Math object

Array object

Date object

Window object

Jeg kan også lave mine egne objekter. Hvis jeg fx ikke har lyst til at bruge en array, kan jeg lave et objekt, der ikke benytter sig af et indeks. Jeg bruger "dot"-systemet, hvor første ord (foran punktum) er mit objekt, og ordet derefter er min variable. Der er altså to niveauer angivet i sætningen.

Når en variabel står inde i et objekt, kaldes den for en "property".

Fx sådan her:

var player = new Object();

player.name = "Fred";

player.score = 10000;

player.rank = 1;

Dette kan også skrives i shorthand:

var player1 = { name: "Fred", score: 1000, rank: 1 };

var player2 = { name: "Sam", score: 1000, rank: 5 };

Dagens link

https://www.zoho.com/creator/

Zoho er en online databaseservices, som jeg glæder mig til at se nærmere på.

JavaScriptordforråd

Dette skulle være en god ressource:

http://developer.mozilla.org/en/JavaScript/Reference

Men jeg synes ikke den er specielt overskuelig - i hvert fald ikke for en nybegynder som mig.

Her er hvad jeg selv har skrevet ned so far:

Values

-numericals (tal)
-Strings (skrives inden i gåseøjne, og kan være en hvilken som helst tekst)

Hvert bogstav har en værdi. Store bogstaver har mindre værdi end små.

Boolean values: 
-true (fx 2<3 vil give outputtet "true")
-false (fx 2>3)

Man kan desuden lave sine egne values.
Et stykke kode, der producerer en value, hedder et expression.
Et statement er sat sammen af expressions. Programmer består af statements. Det mindste program er et expression med et semikolon efter, fx:
1;
!false;

Operatorer:

-: Trækker fra
*: ganger
/: Dividerer
+: lægger til
typeof: siger hvilken type value man har tastet ind
>= : Betyder 'er større end eller lig med'
<= : Er mindre end eller det samme som
== : Er lig med
===: Er præcis lig med
!= : Er ikke lig med
+= : Læg dette nr til denne variable


3 operatorer, der bruges sammen med boolean values:

and, skrives &&: linker to values

or, skrives | |: bruges hvis en af to values er "true"

not, skrives ! : (fx "grass" != "green")

Variable: 

Variable, var, er et navn på en eller anden enhed, ligesom x og y i en ligning. Man kan selv definere hvad den hedder. Et environment er samlingen af variables og values, som ligger indbygget i browseren.

Eksempler på indbyggede variable:
alert : er en variabel, der åbner et lille dialogvindue i browseren

confirm : stiller brugeren et ok/cancel- spørgsmål

prompt : stil et åbent spørgsmål, som brugeren selv besvarer i et tekstfelt

while : skaber et loop. Skriv derfor et expression bagefter, der definerer hvor længe loopen kører

Invoke/call/apply: når man aktiverer koden. Dette skriver man i paranteser, fx alert("Sanne");