raylard.pages.dev






Vilken veckodag är jag född javascript

Efter vägen får ni testa dina vingar inom för att notera en par övningsuppgifter. Även angående ni kunna kopiera därför existerar detta betydligt intelligentare för att ni egen skriver in koden inom dina egna exempelprogram. detta existerar utmärkt ifall ni kunna minimalt en programmeringsspråk, gärna numeriskt värde, innan ni ger dig vid denna guide.

Uppdaterad utgåva från artikeln

“Du måste nedteckna koden själv.”

Om detta går åt pipsvängen sålunda finns ständigt kodexempel för att kika på.

#Då kör vi

Sätt dig tillrätta samt titta mot för att ni besitter en par timmar tillgodo.

Detta handling innehåller ett sektion skrivelse samt ett sektion övningar. då ni stöter vid programmeringsövningar därför bör ni ständigt försöka utföra dem egen. detta existerar enstaka massiv skillnad för att egen lyckas erhålla en modell körbart samt för att bara analysera koden samt testköra någon annans kod.

När ni existerar tydlig kommer ni äga ett hel sektion kodexempel vilket ni är kapabel vandra tillbaka mot samt “låna” koden från.

Använd manualerna flitigt. Lär dig slå upp inom dem. Använd Mozilla Developer Network (MDN) liksom .

#Lexikalisk struktur

måste tecknas noggrant därför samt ej .

JS bryr sig ej ifall blanka indikator vilket mellanslag samt tabb. ni förmå nyttja dem såsom ni önskar till för att formatera ditt schema. då ni kör en schema “live” kunna ni ta försvunnen samtliga tomma indikator, detta existerar sålunda likt “minifiering” 12

Semikolon avslutar en “statement”, dock dem existerar valfria.

Därför kunna ni köra schema även ifall dem saknar semikolon. Bäst existerar för att äga koll vid sina semikolon samt ständigt lägga dit dem var dem bör existera. Annars kommer interpretatorn för att gissa sig fram mot ifall detta behövs en semikolon alternativt ej. Gissningar förmå leda mot problem.

Kommentarer existerar identisk likt inom C++, dvs.

på grund av en-rads kommentarer samt till kommentarer såsom spänner ovan flera rader. detta finns även stöd på grund av kommentarer från typen samt då inom samverkan tillsammans med externa verktyg på grund av register 3.

Följande visar hur literaler är kapabel tolkas.

424.2"hello world"'hej'truefalsenull {x:1,y:2} [1,2,3,4,5]

En identifierare existerar ett sträng såsom används på grund av för att att ge ett namn till någon eller något enstaka variabel alternativt funktion.

Reglerna på grund av identifierare liknar andra programmeringsspråk.

En identifierare börjar tillsammans enstaka tecken , understreck alternativt dollartecken samt följs därefter från tecken , understreck , dollartecken alternativt siffror .

Följande existerar giltiga identifierare:

moped $ _ M64 inom

Det finns en antal , dessa kunna existera god för att äga lite koll vid, kika vid dem innan ni går vidare.

Bra, då utför oss en litet testprogram.

#Uppgift

Du är kapabel ta fram typen till ett literal tillsammans hjälp från operatorn.

Så på denna plats blev resultatet till mig.

Får man tjuvkika?

Självklart, detta existerar ju därför jag skrev exemplet.

dock, vänta in inom detta sista för att kika, försök egen inledningsvis. detta existerar samtliga dessa småfel oss lär oss från samt dem måste man utföra egen – samt åtgärda egen. Försök ständigt egen ursprunglig samt kika då ni existerar genomskinlig samt titta hur jag gjorde. Jämför gärna din kod tillsammans min samt tänka vid vilken likt existerar maximalt tilltalande.

Försök ständigt egen, sålunda länge detta går.

Ta enstaka livlina samt kika vid min kod, liksom ett sista utväg samt likt ett dubbelkoll då ni egen löst uppgiften. Då kommer ni för att lära dig maximalt vid denna övning.

#Datatyper samt värden

Följande register ger enstaka översikt.

NamnSyfte
Siffror, anförande, nummer
Strängar samt tecken
Boolska värden, alternativt
Funktioner såsom exekverbar kod
En osorterad inventering från
En sorterad inventering från numrerade värde
Datum samt datumhantering
Reguljära uttryck
Felhantering till syntax samt fel beneath körning
En variabel såsom ej givits en värde besitter värdet undefined såsom existerar enstaka personlig typ.
Null existerar avsaknaden från en värde, dock ändå en medvetet värde liksom blivit tilldelat mot enstaka variabel.

detta existerar ett personlig typ.

Varje datatyp existerar representerad likt en objekt tillsammans medlemsvariabler samt metoder. Dessa används då man jobbar tillsammans med värden såsom existerar från ett viss typ. Objektets medlemmar samt metoder avgör vad man kunna utföra tillsammans med en värde vilket existerar från enstaka viss typ.

Det existerar , , samt Typerna , , , , , samt existerar egentligen enstaka variant, enstaka specialisering, från typen .

Samtliga objekttyper existerar något vilket kallas globala objekt, titta översikten från detta vilket defineras inom “Global Objects

Till dessa tillkommer då även samt .

Vi tar samt kikar lite djupare in inom plats samt ett från dessa, samtidigt vilket oss fullfölja lite övningar.

Då kör vi.

#Nummer samt

Vissa implementationer stödjer även oktala anförande dock detta stödjs ej inom standarden sålunda oss undviker dem liksom literaler.

2424.23.141592657.01e111.4297E-140xff0x1a0f037Math.sqrt(-1) parseInt('no way') toInteger('no way')

När enstaka matematisk funktion alternativt ett parsning från en number misslyckas sålunda returneras värdet såsom betyder “Not a number”.

Läs mer ifall Nan.

När oss jobbar tillsammans siffra därför supportas dem vanliga aritmetiska operatorer likt oss känner igen ifrån andra programmeringsspråk.

Det finns ett katalog matematiska funktioner liksom existerar samlade inom objektet . tillsammans med dessa förmå ni utföra vanliga matematiska beräkningar.

Math.PI Math.random() Math.tan(2)

Det existerar objektet liksom används då ni jobbar tillsammans med siffra.

Konvertering från värden sker automatiskt mellan literal samt objekt, ofta agerar detta ingen roll dock detta existerar god för att känna till angående man önskar äga lite ytterligare koll. Kika vid objektet Number på grund av för att titta vilka standardfunktioner såsom detta erbjuder.

#Uppgift

Gör en schema vilket skapar anförande från olika typer: integer, float, float tillsammans exponent samt hexadecimalt.

Använd sedan objektet samt objektet på grund av för att utföra nästa beräkningar från samtliga tal.

  • Visa talet inom sin exponentialform (2e7)
  • Visa talet inom sin vanliga struktur tillsammans tre decimaler (42.000)
  • Avrunda mot närmaste heltal.
  • Beräkna kvadratroten (avrunda mot 5 siffror).
  • Beräkna sinus-värdet (avrunda mot 5 siffror).

Leta reda vid samt skriv ut nästa värden:

  • Eulers konstant E
  • PI
  • Värdet vid detta största tänkbara talet såsom förmå representeras
  • Representationen från positiva oändligheten

Så denna plats blev mitt resultat.

#Strängar samt

Strängar omsluts tillsammans enkelfnutt alternativt dubbelfnutt , speciella indikator kunna escapas tillsammans backslash vid identisk sätt likt inom andra programmeringsspråk.

ett tom sträng existerar alternativt . Strängar är kapabel även innehålla unicode indikator i enlighet med var existerar fyra hexadecimala siffror.

Strängkonkatenering sker tillsammans med operatorn alternativt .

Det finns ett möte tillsammans sträng-funktioner liksom existerar samlade inom objektet .

Vill ni äga mer övervakning vid hur konvertering sker är kapabel ni nyttja funktionerna samt på grund av för att konvertera strängar mot siffra samt till för att konvertera siffra mot strängar.

#Uppgift

Skriv en schema vilket utför nästa hantering från strängar.

  • Skapa samt skriv ut strängen: , använd unicode siffran på grund av ©-tecknet.
  • Konkatenera strängen tillsammans med strängen .

    Skriv ut resultatet.

  • Konkatenera strängen tillsammans siffran . Skriv ut resultatet.
  • Lägg mot enstaka punkt inom slutet från strängen. Skriv ut längden från strängen.
  • Skapa enstaka färsk sträng samt ta försvunnen genom för att plocka ut dem numeriskt värde substrängar vilket ej innehåller samt slå samman dem mot enstaka fräsch sträng.

    Skriv ut den nya strängen samt dess längd.

Kontrollera hur typkonvertering sker mellan siffra samt strängar. Utför nästa beräkningar, lagra inom ett variabel, skriv ut resultatet tillsammans tillsammans med värdet vid .

"19" + "42""19" + 4219 + 4219 + "42"

Så denna plats blev mitt testprogam till strängar.

#Boolska värden samt

Det finns en objekt likt automatiskt används nära typkonvertering från formulering mot samt .

detta kunna artikel utmärkt för att känna till för att detta finns en objekt inom bakgrunden dock normalt behöver man ej tänka vid detta utan förmå nyttja samt liksom vanligt.

Det finns ingen anledning för att explicit nyttja objektet ovan huvudtaget. detta räcker god tillsammans literalerna samt . alternativt vilket detta står inom MDN manualen:

“Do not use a Boolean object in place of a Boolean primitive.”

Följande värden existerar falska: , 0, den tomma strängen (“”), , , samt .

samtliga andra värden existerar sanna, .

Ett sätt för att omvandla godtyckligt värde mot en boolskt värde existerar för att nyttja dubbla utropstecken.

!(newNumber(42)) !!(newNumber(42))

#Funktioner

Först tar oss grunderna.

Funktioner är kapabel skapas vid olika sätt, jämför nästa sätt för att nyttja samt producera ett funktion.

functionsquare (x) { return x*x; } omröstning = square(x) fanns square = function (x) { return x*x; } omröstning = square(x); element.onclick = function () { alert('Hello'); }

Funktioner besitter ett argumentlista.

angående man anropar funktionen tillsammans färre argument än listan sålunda får dem kvarvarande argumenten värdet .

functionsum(a, b, c) { return a + b + c; } sum(1, 2, 3); sum(1, 2);

Man kunna nyttja detta på grund av för att ge “default”-värden vid en argument tillsammans med hjälp från operatorn . analysera nästa funktion.

functionsum(a, b, c) { a = a || 0; b = b || 0; c = c || 0; return a + b + c; } sum(1, 2, 3); sum(1, 2);

Man kunna även hantera ett variabel argument-lista tillsammans identifieraren likt finns tillgänglig inom funktionen.

functionsum() { fanns inom, sum = 0; for(i = 0; inom < arguments.length; i++) { sum += arguments[i]; } return sum; } sum(1, 2, 3); sum(1, 2, 3, 4, 5, 6);

#Uppgift tärning

Du skall utföra en litet tärningsprogram, var ett tärning kastas, snittvärdet beräknas samt framträda tillsammans tillsammans slagserien.

utför således här:

  • Skapa ett funktion såsom returnerar en slumptal mellan samt .
  • Skapa enstaka funktion såsom kastar tärningen gånger samt returnerar enstaka sträng tillsammans med resultatet från varenda slagningar samt medelvärdet.

Så denna plats blev mitt testprogram på grund av tärningen.

#Objekt

Objekt existerar ett grupp från namngivna värden såsom vanligen kallas “properties”.

på grund av för att referera mot en objekts property används punkt. Man skapar enklast en objekt tillsammans med objekt-literalen .

Här existerar en modell vid en objekt såsom innehåller ett foto vid enstaka boll samt ett placering från bollen vid enstaka tvådimensionell yta.

var myBall = {}; myBall.image = 'http://dbwebb.se/img/black_ball_64_64.png'; myBall.position = {x:10, y:10} console.log(myBall.position.x);

Ett objekt innehåller alltså inga properties ifrån start, dem förmå defineras beneath resans gång, detta existerar både utmärkt samt uselt.

Smidigt för att ej behöva äga ett spec vid objektet utan för att detta går för att modifiera dynamiskt beneath körningen, ej sålunda god då man skriver fel vid namnet vid enstaka property samt tror för att man läser ett befintlig property dock istället definerar man ett ny.

I nedan modell besitter jag stavat fel vid propertyn till . Jag tror jag ändrar bostadsort objektet mot position 27 dock detta fullfölja jag ej.

Jag definerar ett färsk property tillsammans med namnet . Sådant är kapabel artikel lurigt för att felsöka.

myBall.position.X = 27; console.log('The x-position of my ball is: ' + myBall.position.x);

Läs ifall mutable objekt vid Wikipedia.

Nu då oss äger en enkelt objekt förmå oss lägga mot metoder mot detta, vilket sägs ifall ett teknik till för att rita ut objektet vid skärmen?

oss kallar detta metoder då funktioner existerar kopplade mot en objekt.

myBall.HTMLelement = document.getElementById('ball'); myBall.draw = function () { this.HTMLelement.style.backgroundImage = 'url(' + this.image + ')'; this.HTMLelement.style.top = this.position.y + 'px'; this.HTMLelement.style.left = this.position.x + 'px'; console.log('Drawing ball.'); } myBall.draw();

När man exekverar ett funktion inom en objekt förmå man nyttja till för att referera mot detta objekt (eller funktion) såsom äger funktionen 45.

Låt oss lägga mot enstaka eventhanterare till klick vid bollen samt kolla vilket såsom existerar inom enstaka eventhanterare.

myBall.HTMLelement.addEventListener('click', function (event) { console.log('Clicked on: ' + event.clientX + ' x ' + event.clientY); console.log(this); });

Om ni testkör ovanstående kod således kommer ni för att titta för att pekar vid , alltså detta objekt/funktion likt existerar ägare mot funktionen.

utmärkt, då besitter oss koll vid detta. oss måste dock artikel lite uppmärksamma vid vilket objekt liksom verkligen existerar inom olika kontext. dock på denna plats gick detta bra.

metoder den erbjuder. samtliga nya objekt skapas tillsammans med ett köpcentrum såsom kallas Object.prototype. Därför får samtliga nya objekt passage mot dem metoder samt properties såsom definieras inom Object.prototype.

Fint, då äger oss lite koll vid hur objekt fungerar.

för tillfället tar oss enstaka små kodningsuppgift vid detta.

#Uppgift flytta bollen

Du besitter ett boll samt ni är kapabel klicka vid den. utför för tillfället sålunda för att ni är kapabel putta vid bollen tillsammans med musklick sålunda för att bollen ändrar bostadsort sig varenda gång ni klickar tillsammans med musen vid den.

ifall ni kunna din matematik därför förmå ni låta bollen flytta inom olika riktningar beroende vid fanns ni klickar vid bollen, annars är kapabel ni bara låta bollen flytta sig lite random, bestäm själv.

EXTRAUPPGIFT

Kan ni utföra därför för att ni klickar tillsammans musen vid bollen, håller nere musknappen samt drar den åt en hållet samt släpper.

Resultatet skall bli för att bollen gård iväg åt motsatt håll tillsammans enstaka hastighet liksom motsvaras från hur långt ni drog musen?

Så denna plats blev exempelprogrammet till mig.

#Array

En existerar enstaka numrerad inventering tillsammans värden.

ett array äger ett längd. detta finns en antal metoder likt hjälper dig för att arbeta tillsammans med arrayer.

Det finns inga associativa arrayer

Du är kapabel nyttja array-literalen till för att producera samt arbeta tillsammans arrayer vid nästa sätt.

var notMuch = []; fanns course = ['htmlphp', 'oophp', 'phpmvc', ]; console.log(notMuch.length); console.log(course.length); console.log(course[0]); course[9] = 'mobile'; console.log(course.length); console.log(course[8]); console.log(course[9]); course.length = 4; console.log(course.length); console.log(course[9]);

Du är kapabel utöka arrayen dynamisk genom för att tilldela den fler element vid vissa positioner, enstaka position vilket ej fått en värde tilldelat äger värdet .

då ni sätter längden vid ett array är kapabel ni förkorta den, såsom inom exemplet ovan var detta finns en element vid position 9 liksom försvinner då oss sätter arrayens längd mot 4.

Objektet Array innehåller ett hel sektion metoder såsom ni kunna äga nytta från då ni jobbar tillsammans arrayer. Kika vid manualsidan samt titta ifall ni känner igen några från metoderna.

#Uppgift Boulder Dash

Låt oss nyttja arrayer till för att utföra en spel influerat från Boulder Dash, alternativt ja, ett bräda iallafall.

När man bygger spel behövs ett fin bakgrund samt detta förmå man producera tillsammans med texturer alternativt tiles.

detta finns webbplatser var man är kapabel hitta denna typen från grafik. OpenGameArt, enstaka webbplats tillsammans med fri grafik mot spel, var hittade jag dem tiles jag använde mot min spelplan.

De tiles vilket jag använde finns även via nästa länk.

Jag gjorde ett bräda angående 24x24 rutor var varenda fyrkant plats 32x32 pixlar.

Så denna plats blev detta på grund av mig, ni kunna flytta runt tillsammans piltangenterna dock sen sker detta ej många mer. förmå ni utföra bättre? alternativt rangordna samt nöj dig tillsammans för att rita upp enstaka enklare bräda såsom ni lagrat inom enstaka array.

Kika gärna vid mitt modell dock tänkt ursprunglig mot egen, klara ni för att åtgärda detta vid personlig hand?

TIPS

Syntax till loopar samt liknande hittar ni inom delen angående Statements inom refmanualen.

#Variabler utan värde,

En variabel vilket ej besitter tilldelats en värde får automatiskt värdet .

detta existerar en odefinerat värde.

var i; if(i === undefined) { } if(typeof inom === 'undefined') { }

#Ett icke-värde,

liksom existerar en icke-värde samt likt existerar avsaknaden från en värde. Man använder på grund av för att ge enstaka variabel värdet , tillsammans fras. då värdet dyker upp således innebär detta oftast för att man ej initierat enstaka variabel tillsammans med en värde.

var i; fanns j = null; if(i === j) { } if(i == j) { } if(j === null) { }

#Datumhantering tillsammans objektet

Med objektet får oss enstaka större mängd metoder på grund av för att arbeta tillsammans datum samt tid.

var today = newDate(); console.log(today.getMonth()); today.setMonth(2); console.log(today.getMonth());

Pröva egen för att utföra en enkelt exempelprogram tillsammans datumhantering.

#Reguljära formulering tillsammans objektet

Det finns en särskilt objekt, , vilket hjälper oss för att arbeta tillsammans med literaler på grund av reguljära formulering.

säga för att oss önskar validera ifall användaren matat in enstaka rätt mailadress. sålunda på denna plats är kapabel ett funktion till detta titta ut.

functionvalidateEmail(email) { fanns re = /^.+@.+\..+$/; return re.test(email); }

Själva principen på grund av detta reguljära uttrycket existerar för att enstaka mailadress består från minimalt en indikator följt från en , därefter minimalt en indikator såsom följs från ett punkt samt därefter ytterligare minimalt en tecken.

Så denna plats ser detta ut då man provar funktionen inom Firebug.

Om ni önskar äga en mer rätt reguljärt formulering till emailadresser således är kapabel ni testa detta: 6

/^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/

Pröva egen för att utföra en enkelt exempelprogram tillsammans med reguljära uttryck.

#Objekt till felhantering,

samt hantering samt detta finns en antal objekt likt är kapabel användas inom detta sammanhang.

functionmy(i) { if(i === undefined) { thrownewTypeError('Value was undefined.'); } elseif(typeof inom === 'number' && inom < 0) { thrownewRangeError('Only positiv values allowed.') } } try { my(); } catch(e) { console.log(e.name); console.log(e.message); } try { my(-1); } catch(e) { console.log(e.name); console.log(e.message); }

Pröva egen för att utföra en enkelt exempelprogram tillsammans felhantering.

#Funktioner, scope, closure samt callbacks

Låt oss ta ett djupare titt vid funktioner samt hur dem är kapabel användas.

oss avslutar detta stycke tillsammans enstaka lite större programmeringsövning.

#Funktioner samt scope

I en programmeringsspråk innebär “scope” den siktbarhet samt levnadstid såsom variabler samt parameterar äger. detta handlar ifall minneshantering samt namnkonflikter. dem flesta C-liknande programmeringsspråk besitter “block”-scope, samtliga variabler existerar synliga inom detta blocket dem existerar definierade samt försvinner ur scoopet då man går ur blocket.

functionf1 (a) { plats b = a + 1; functionf2 (c) { fanns d = c + 1; return a + b + c + d - 2; } return f2(b); } f1(10); f2();

Många programmeringsspråk säger för att variabler skall definieras sålunda sent vilket möjligt, noggrann innan dem används.

-deklaration separerade tillsammans med kommatecken.

#Closure

I exemplet ovan besitter den inre funktionen resurser mot allt liksom existerar definierat inom funktionen . Detta kallas på grund av “closure” vilket existerar en välkänt term inom programmeringspråk liksom stödjer funktionell programmering, programmeringsspråket Lisp existerar en sådant språk.

Här existerar en modell vid ett closure var den inre funktionen äger resurs mot dem icke lokala variabler såsom fanns då funktionen definierades.

window.accessToInner = (function() { fanns a = 1; functioninner (b) { a += b; return a; } return inner; })(); accessToInner(1) accessToInner(1) accessToInner(1) accessToInner(1)

En funktion äger detta scope såsom finns då den definieras, oavsett fanns den exekveras.

Man kunna alltså definiera ett funktion inom ett miljö samt sedan förutsätta för att funktionen exekveras inom identisk miljö. Detta ger möjligheter mot inkapsling samt låter oss undvika globala variabler.

#Moduler – “Module pattern”

Man lägger enstaka hel enhet inom enstaka funktion, var finns bota scopet, en eget closure.

inom denna funktion definieras allt likt behövs inom modulen, variabler såsom funktioner. mot senaste returneras ett objekt-literal var man anger modulens publika interface. titta nästa modell var jag skapat enstaka enhet vilket existerar tänkt för att innehålla lite bra-att-ha saker.

window.Mos = (function(window, undefined) { fanns private, Mos = {}; Mos.dump = function (obj) { for (var prop in obj) { if (obj.hasOwnProperty(prop)) { console.log(prop); } } }; Mos.random = function (min, max) { returnMath.floor(Math.random()*(max+1-min)+min); }; return Mos; })(window); Mos.random(1, 6); Mos.dump(window.localStorage);

Funktionen definierar en objekt liksom innehåller numeriskt värde metoder, funktionen exekveras direkt eftersom den omsluts från parenteser samt returnerar därmed objektet liksom tilldelas .

enstaka poäng tillsammans detta existerar för att variabeln såsom definieras inom funktion, existerar tillgänglig varenda gång enstaka teknik inom objektet anropas. Man får alltså ett struktur såsom liknar en objekt tillsammans med publikt interface samt tillsammans privata delar.

Ser ni för att dem använde closure båda två?

analysera hur inledande raden samt sista raden inom koden ser ut. detta existerar alltså ett anonym funktion likt exekveras, tillsammans argument, samt returnerar en objekt tillsammans dem delar såsom skall artikel publika.

Closure till Modernizr.

window.Modernizr = (function( öppning, document, undefined ) { return Modernizr; })(this, this.document);

Closure till jQuery.

(function( öppning, undefined ) { window.jQuery = window.$ = jQuery; })( fönster );

I båda fallen skapas en objekt, ett enhet, tillsammans med dem funktioner likt skall existera tillgängliga, samt modulen kopplas mot window-objektet.

Här existerar en mindre modell vid identisk tema.

window.Mumin = (function (name) { return { myNameIs: function () { return name; } }; })('Mumintrollet'); Mumin.myNameIs();

#Callbacks

En funktion utan namn kallas ibland till anonym funktion alternativt lambda-funktioner7.

Lambda kommer ifrån matematiken,

Ett vanligt sätt för att nyttja anonyma funktioner existerar på grund av callbacks, nästa modell visar enstaka event-hanterare, skapad tillsammans vilket tar grabb ifall en klick vid ett knapp tillsammans ett anonym funktion.

var button = document.getElementById('button'); button.addEventListener('click', function () { console.log('Great - you clicked the button!'); }, false);

Enda gången liksom funktionen kommer anropas existerar inom samband tillsammans för att någon klickar vid ett knapp.

detta finns ingen anledning för att spara undan funktionen inom ett variabel någonstans. detta räcker god tillsammans för att definiera funktionen noggrann var den används.

Ett liknande modell existerar ifall man önskar animera ett incident tillsammans jämna tidsintervall. alternativt . Låt titta hur detta kunna titta ut.

var button = document.getElementById('button'); button.addEventListener('click', function () { plats colors = ['green', 'yellow', 'red', 'blue', 'pink'], step = 0, animateFunction = function () { if (step === colors.length) { button.style.backgroundColor = ''; } else { button.style.backgroundColor = colors[step]; step += 1; window.setTimeout(animateFunction, 500); } }; window.setTimeout(animateFunction, 500); }, false);

Principen existerar för att utföra ett funktion samt sätta enstaka timer för att anropa funktionen tillsammans med jämna intervall.

inom exemplet skapar jag funktionen liksom jag anropar tillsammans en intervall från 0.5s. Processen startar då någon klickar vid knappen samt återkomma lika flera gånger liksom detta finns färger inom arrayen .

Fortsätt öva.

Här är kapabel ni testa mitt exempel.

#Uppgift roulette

Vi äger kommit lite mer än halvvägs inom denna övning, detta existerar dags till enstaka små större arbetsuppgift.

ni skall utföra en Roulette-spel. Lycka till!

Det finns ett katalog populära spelsystem såsom kom fram inom land i västeuropa vid 1700-talet. dem gick beneath namnet Martingale samt dem enklaste spelsystemen utgår ifrån spel liksom liknar singla slant samt föreslår enstaka satsningsstrategi såsom ökar chansen mot vinst.

Låt oss testa principen vid spelet Roulette

Roulette-bordet besitter 37 siffra, 0-36.

Hälften från numren existerar svarta samt hälften existerar röda, nollan existerar smaragdgrön. på denna plats följer enstaka array liksom anger egenskap som beskriver ett objekts utseende i olika nyanser per siffra (0=grön, 1=svart, 2=röd).

var colors = ['green', 'black', 'red'], table = [0,2,1,2,1,2,1,2,1,2,1,1,2,1,2,1,2,1,2,2,1,2,1,2,1,2,1,2,1,1,2,1,2,1,2,1,2];

För för att spela i enlighet med Martingale vid Roulettebordet fullfölja ni sålunda här:

  • Satsa 1 spelmarker vid valfri färg.
  • Förlorar ni sålunda dubblar ni insatsen samt agerar igen vid identisk färg.
  • Fortsätt mot ni vinner.

    Då börjar ni ifall ifrån start igen samt byter färg (röd/svart).

Rent teoretiskt fungerar systemet förutsatt för att man besitter ingång mot oändligt antal valuta, samt detta besitter man ju ej. Casinona äger dessutom max-gränser på grund av bidrag per runda vilket påverkar systemet mer. alternativt vilket Einstein sa:

“You cannot beat a roulette table unless you stjäla money from it.

Albert Einstein”

Gör idag en roulette spel var ni kunna testa Martingale-systemet. titta mot för att resultatet blir god samt fungerar väl. ni förmå utföra minimalt lika god liksom jag gjort. Använd dina kunskaper ni lärt dig därför på denna plats långt samt sök inom manualerna efter detta ni saknar. Glöm ej för att köra din kod inom JSLint då ni existerar genomskinlig.

oss kunna lära oss enstaka hel sektion från kommentarerna oss får ifrån detta verktyget.

Du förmå kika vid mitt roulette-spel.

#Prototyper samt arv

Programmeringssättet kallas “Prototype-based programmering” samt ni kunna tjäna vid för att studera vid angående vad liksom skiljer mellan klass-baserade arv samt prototyp-baserad programmering 8.

Läs gärna Douglas Crockfords produkt angående .

Men oss avvaktar mot senare inom kursen tillsammans för att kika vid detta.

Glöm ej det.

Anamma detta funktionella programmeringssättet tills vidare. således återkommer oss mot prototypbaserad programmering lite senare inom kursen.

#Avslutningsvis

Bra jobbat! Förvalta detta väl samt glöm ej för att notera egna schema på grund av för att öva. Använd Firebugs konsol på grund av för att snabbt testa konstruktioner liksom ni existerar osäker på.

#Revisionshistoria

2013-11-12 (C, mos) översyn samt ett sektion justeringar inför ht13.
2012-11-15 (B, mos) Justeringar nära översyn.

La mot avsnitt ifall Moduler.
2012-11-03 (A, mos) inledande utgåvan.

Att göra

  1. Eget avsnitt ifall Siaf, self-invoking-anonymous-function, including its parameters. http://stackoverflow.com/questions/6287511/reason-behind-this-self-invoking-anonymous-function-variant

  2. En förklaring angående this, that/self. http://stackoverflow.

#Referenser

Följande existerar referenser likt använts likt fotnötter inom texten.