Javascript

Intro

Programiranje?
Javascript?
JQuery?

 

 

Plan i program

1. Uvod, osnovna sintaksa, DOM

2. HTTP/AJAX, uzimanje i manipulacija podacima sa servera

 

if( sveJeOK ) {

    3. Memory Game - Uvod u Objektno orijentisan JS
    4. Uvod u AngularJS/React
} else {
    3. radimo na unapređenju gradiva sa prva dva časa

}

Plan i program

Predavanje

Vežba

Mini projekat

subota

nedelja ... subota

BITNO!

4 nedelje je malo vremena!

Ukoliko je ovo teško, možete da pređete u lakšu grupu

Javascript

Programski jezik

Izvršava se u browseru i na serveru (NodeJs)

Javascript

Promenljive

keyword: var

var imePromenljive = "neka vrednost";

var broj = 5;

var student = {ime: "Dusan", prosek: 9.05};

var polaznici = ["Petar", "Ana", "Milan"];

Javascript

Tipovi podataka

"neka vrednost" - string

5 - broj

{ime: "Dusan", prosek: 9.05} - objekat

["Petar", "Ana", "Milan"] - niz

Javascript

Kontrola toka

keywords: if, else

if (4 < 5) {
   console.log('hello');

} else {
   console.log('nooooo');
}

Javascript

Kontrola toka

keywords: switch

var x = 10;

switch(x){

    case 10: {

        console.log("it's 10");

        break;
    } 

    default:{

        console.log("promenljiva ne zadovoljava ni jedan slucaj");
    }
}

var x = 4;

switch(x){
    case 2: {

        console.log("it's 2");

        break;
    }

    case 4: {

        console.log("it's 4");

        break;
    }

    default:{

        console.log("?!?");
    }
}

Javascript

Petlje

keywords: for

for(var i = 0; i < 10; i ++){

   console.log(i);

}

 

var niz = [1, 1, 2, 3, 5, 8, 13, 21];

for(var i=0; i< niz.length; i++){
    console.log(niz[i]);
}

Javascript

Funkcije

keywords: function

function sabiranje(a,b,c){
    return a+b+c;
}

sabiranje - ime funkcije

return - vraća neku vrednost

var x = sabiranje(1,3,4);

Javascript 

Vežba 1

1. Napisati funkciju koja prima string kao parametar, broji sve njegove samoglasnike i vraća rezultat.

 

2. Napisati funkciju koja prima niz brojeva i vraća zbir svih deljivih sa 7.

Javascript + HTML


<head>
    <script src="app.js" ></script>
</head>

//app.js

alert("Hello world");

JQuery

  • Najčešeće se koristi za manipulaciju DOMom
  • Komunikaciju sa serverom
  • Animacije

JQuery predstalja skup korisnih funkcija- biblioteka.

JQuery

Koristi css selektore za dohvatanje elemenata

 

var header = $(".header");

JQuery

1. Koristeći developer konzolu u browseru i JQuery, otići na sajt https://developer.mozilla.org i promeniti background color na body elementu u crvenu. Takođe, zameniti tekst "Shared knowledge for the Open Web" nekim drugim.

Vežba 2

DOM

Reprezentacija HTML-a u browseru

 

DOM

Vežba 3.

Napraviti input text i dugme. Kada korisnik klikne na dugme, uzeti vrednost input polja i upisati ga u poseban div.  

Mini projekat

Loto listić

Koristeći samo JQuery, izgenerisati loto listić 7/39 (slika). Korisnik može da izabere do 7 brojeva u svakoj koloni. Takođe, brojeve je moguće i odselektovati. 

Javascript-ad-1

By Dušan Stanković

Javascript-ad-1

  • 648
Loading comments...

More from Dušan Stanković