You are on page 1of 95

HTML, CSS, JavaScript, jQuery, PHP & MySQL

•  Analizë  
•  Skice  (Cacoo,  illustrator)  
•  Dizajn  (photoshop)  
•  HTML,  HTML5  (Notepad++,  SublimeText2)  
•  CSS,  CSS3  
•  Responsive  
•  Bazat  e  programimit  
•  KupLmi  i  Programimit  të  Orientuar  në  Objekte  
•  JavaScript,  DOM,  jQuery,  AJAX,  jSON,  jQueryMobile  
•  PHP  
•  MySQL,  XML  
•  Instalimi  i  serverit  Apache  
•  Lansimi  online  

kanuni i programimit në ueb
driton haxhiu

12
Programimi
Hyrje
Driton Haxhiu

Një program kompjuterik është një grup i udhëzimeve

Një program kompjuterik është një seri e udhëzimeve

ndaj per te pershkruar rrugen deri ne shtepin tuaj. njejt sikurse miku juaj.Shembull i programimit ne jeten reale B Shembull nga programimi: Ju jeni ne nje qytet (Ferizaj) dhe po pritni nje telefonate nga nje mik i juaji I cili gjendet ne nje qytet tjeter (Prishtine). ka pesuar aksident. Kjo eshte edhe arsyeja pse themi se nje program eshte crash-irat. Mirepo gjerat sikurse ne jeten reale. Miku juaj nuk ka qen asnjehere ne qytetin tuaj. mikut I duhen instruksione te sakta per te arritur deri tek ju. perndryshe programi mund te ndeshet. ne qytetin e mikut tuaj. Ne menyre te njejte edhe ne programim duhet te japim informata te sakta. Gjeja e pare qe ju vjen A ndermend eshte nje trajektore e drejte nga qyteti juaj. . ndaj ai kerkon nje shpjegim te rruges qe do te beje. ashtu edhe ne programim nuk funksionojne ne jete menyre.

eshte analiza. nese semafori eshte ne ngjyre te kuqe. per cdo kthese per cdo semafor qe gjendet ne rruge.Shembull i programimit ne jeten reale B Puna e pare qe bejme per ti ndihmuar mikut tuaj per te arritur tek ju. perndryshe menjehere vazhdo drejte. se fillimisht niset djathtas. Pas 17 km tjera keni nje rreth. pastaj vazhdo drejte. pastaj ju filloni ti jepni instruksionet. Nese ne nuk i kemi dhene instruksionet mire. ate duhet analizuar. ndaleni dhe ju jeni prane shtepise sime. pastaj kthehet djathtas perseri. atehere prit derisa te ndezet e gjelberta. pastaj mas 13 km. atehere mikun shume leht mund ta shohim te perplasur ne ndonje pem. Ju mund ti thoni atij. vazhdon 2 km. Duhet te jeni te sigurt nese ju jeni ne dijeni per rrugen e sakt. A . Qoft edhe pran shtepise. Pas 500 m ka nje semafor. derisa te lirohet trafiku. Eshte rregull qe ne rreth te silleni 3 here.

pastaj ato dy vlera ti llogaritmi Kontrollo nese perdoruesi e ka shtypur tastin ENTER Ndrysho ngjyren e nje pikseli te vetem ne ekran . shko djathtas Ne programim shembull mund ti krijojme dy vlera.Disa shembuj cfare mund te bejme me ane te programimit Programimi nuk eshte vetem shko majtas.

Deklarimet (Statements) BASIC LET Balance = 500 AppleScript
 Set balanbe to 500
 
 
 Java
 balance = 500.
 
 
 COBOL MOVE 500 TO BALANCE Driton Haxhiu .

Definicioni •  Programimi ne esence eshte qe nje ide tuaj. ta ndani ne pjese dhe keto pjese te dini ti shkruani ne sintaksen e gjuhes programuese qe ju keni zgjedhur .

Gjuha 13 Programuese Driton Haxhiu .

atehere pse nuk ekziston vetem nje gjuhe programuese? Ruby
 Visual Basic . Ne anen C++ e djathte jane dhene disa gjuhe te cilat sote C# jane me te popullarizuarat. JavaScript Perl PHP Python
 Meqense me te gjitha mund te kryejme Objective-C pune te njejte.Gjuhet programuese Ekzistojne qindra gjuhe programuese. per disa arsye disa jane me te njohura e disa jo. qysh C prej ka fillu te programohet. Shumica prej tyre jane te bazuara ne gjuhen Java
 programuese C.

ose gjuha e makines.
 Te vetmen gjuhe qe njeh Qipi eshte kodi I C# makines. mirepo jo.Truri I cdo paisje nuk kupton asnjeren nga gjuhet qe shihen ne anen e djathte.Kodi i makines CPU. ngase nuk eshte per njerezim por Ruby
 per makina Visual Basic . e cila lidhet Java
 direkt me hardware-in JavaScript Pse nuk shkruajme kod te makines?
 Perl Ngase eshte e pamundur dhe humbje kohe PHP 6A 00 89 48 E4 F0 45 Python
 C1 08 E2 90 72 1C 00 34  E9 53 00 20 00 FC Objective-C Edhe nese e shkruani. Ne mendojme qe Qipi (CPU) lexon kodin C ton qe kemi shkruar ne nje gjuhe C++ programuese. nuk mund ta lexoje askush.

 Paython.  AcLonScript   Gjuhet  e  larta  programuese   Ruby.NET     ObjecLve-­‐C   C++       C     Gjuhet  e  ulta  programuese   Assembly  Language   Kodi  i  makines   CPU   .  PHP   Java.  VB.JavaScript.  C#.

Kodimi Kur te themi. po shkruaj kod. ku t’ja fillojme me shkru C# 2. mirepo duhet ti kuptojme tri gjera: C++ 1.  Si te shkruajme. C eshte e njejta gje. po programoje. do te konvertohet ne kod te makines 3. Si ta ekzekutojme kete program Java
 JavaScript Perl PHP Python
 Objective-C Ruby
 Visual Basic . Qysh ai kod. po kodoj.

C++ C# Nuk ka asgje magjike ne programim.Te shkruaj kod source (programojme) Kodi I programimit shkruhet ne plain text. dhe te filloni me shkru nje odin tuaj. njejt sikur te shkruash nje poezi Java
 JavaScript Perl PHP Python
 Objective-C Ruby
 Visual Basic . Mund ta hapni C nje editor te thjeshte ne modin plain text dhe jo rich text. eshte thjesht nje text.

js   JavaScript   alert(“Hello.groovy   Groovy   say “Hello. World!”).Shembuj   shembull.ruby   ruby   puts ‘Hello. shembull. Driton Haxhiu . World!”. World!”. World!’ shembull.pl   perl   say “Hello. shembull.

nje shembull klasik print (“Hello. world!”) ALGOL68   Paython     Lua   .Hello world.

Ne  gjuhet  programuese  qe   C#   jane  te  bazuara  ne  C. Perdoren  kllapat  gjarprore       {   Class Shembulli       { }   static void Main(string[] args) { A  duhet  me  I  mbajte  mend  gjitha   console.WriteLine(“Hello.   DISPLAY (“Hello.  duhet  patjeter  te  tregojme  ku  eshte  fillomi  dhe  fundi. world!”). keto???   }   } Jo  bash   . END.  Java   Using System.  C#. Kur  fillojme  me  deklaru  nje  kod.  eshte  perdorur   BEGIN BEGIN  dhe  END.  C++.   shmebull  C.       ALGOL60   Ne  gjuhen  programuese   ALGOL60. world!”).

me tipare extra •  Disa jane falas.Text Editor-et per Programera •  Plain Text Editor. sikurse kontrollimi I fjaleve Disa text editor I perkrahin vetem nje gjuhe programuese e disa edhe te tjera . nuk eshte I formatum. por na ndihmon per me I lexu dhe me I shkru pjese te ndryshme te kodit Kontrollimi I sintakses. disa komercial •  Na tregojne per numrin e rreshtave •  Kodin e ngjyrave (Color Code).

 dhe  kane  ediLm  te  mire   •  Kan  shume  Lpare  per  zhvillim  profesional       Shembull  I  IDE-­‐ve  jane:   •  Xcode  per  MAC   •  VisualStudio  per  PC   •  Ecplipse  Cross  pladorm   .IDE (Integradet Development Eniorements) •  Jane  programe  te  mdhaje.

  world”).   world”).   lo.     alert(“Hello.  world!   Programeri   Klien-   .   world”).   interpreteri   lo.  world!”).Gjuhet e kompajlluara dhe te interpretuara Gjuha  e  interpretuar   Script     Script     alert(“Hel Script     Script     alert(“Hel lo.   Hello.   world”).   alert(“Hel alert(“Hel lo.

 world!”.   01001101 01001101 world!”.Gjuhet e kompajlluara dhe te interpretuara Gjuha  e  kompajlluar   Cout<<“H 10111001 10111001 ello.   00100100   00100100   kompajlleri     cout<<“Hello.  world!   Programeri   Klien-   .   Hello.

Perparesit dhe mangesit Gj.  e  Kompajlluara   Gj.  e  interpretuara   Perparsite   Mangesite   Perparsite   Mangesite   Ga-  per  perdorim   Jo  Cros-­‐pla8orm   Cros-­‐pla8orm   Kerkohet  interpreter   Shpesh  me  e  shpejte   Jo  fleksibile   Thjesht  per  test   Shpesh  e  ngadalshme   Kodi  privat   Hapa  shtese   Thjesht  per  kontroll   Kodi  eshte  publik   .

  Hello.   01001101 world!”.  world!   Programeri   Klien-   .  world!”.   00100100     cout<<“Hello.Gjuhet e kompajlluara dhe te interpretuara Intermediate  Language  IL   IL   10111001 IL   Cout<<“H ello.

NET. VB. Python .Shembull te gjuheve programuese Te Kompajluara: C. JavaScript Hybrid: C#. Java. C++. Objective C Te interpretuara: PHP.

Hyrje ne 14 JavaScript Driton Haxhiu .

JavaScript  
javascript  
Pse  JavaScript?  
  alert(“Hello, world!”);
JavaScript  nuk  eshte  nje  prej  
gjuheve  me  fleksibile,  mirepo  
eshte  gjuhe  programuese  
shume  e  pershtatshme  per  
fillestare  dhe  perdoret  per   ReultaL  
uebprogramim.  
Hello, world!
 
JavaScript  eshte  gjuhe  
programuese  e  interpretuar  
dhe  eshte  “case  sensiLve”,  
pra  e  ndjeshme  ndaj  
rregullave  te  shkronjave  

Ku dhe si ta vendosmi JavaScripten
JavaScripti mund te thirret nga nje
file tjeter I jashtem (external). Dhe javascript  
mund te shkruhet brenda fajllit
HTML. Per arsye qe te njejtin fajll te <!DOKTYPE HTML>
mund t’a therrasim edhe ne fajlla <html>
te tjere, atehere preferohet qe te <head>
shkruhet ne nje fajll te jashtem. <title>Miresevini</title>
Nese bejme ndonje ndryshim, </head>
atehere te gjitha faqet tjera e <body>
marrin ate ndryshim. <!– JavaScript Enternal -->
JavaScript mund te thirret ne <script>
Header por edhe brenda bodyt. alert(“Hello, world”);
Per arsye te performances </script>
zakonisht therrasim ne fund te
bodyt, veq ne raste te caktuara kur <! JavaScript External -->
na nevoitet ne fillim. <script src=“inc/js/script.js”></script>
</body>
Atributi type </html>
type = “text/javascript”
Kerkohet per HTML 4, XHTML ose me poshte

Variablat
15
Driton Haxhiu

  var  vleraA  =  3.Variablat ne JavaSript Driton   3   9   12   emri   vleraA   vleraB   rezultaL   var  emri  =  “Driton”.   .   var  vleraB  =  9.   alert(“RezultaL:  ”  +  rezultaL).   var  rezultaL  =  vleraA  +  vleraB.

. EmerLmi  i  variavles   vlera  e  inicializuar   var emri = “Driton”.

16 Operatoret Driton Haxhiu .

 prompt  dhe  confirm.   }   else{    alert  ("Jo.   prompt  (“Jepeni  emrin:  ”).  ne  na   alert  (“Pershendetje”).   }.    alert("Po.   A  pajtoheni?   confirm  (“Jepeni  emrin:  ”).  nuk  pajtohem!").   interpretohen  si  PopUp.  “vlera  e  nenkuptuar”).   confirm  (“Stringu”  +  variabla).   .Operatoret Alert.   cancel   OK   if  (confirm("A  pajtoheni?"))  {   prompt  (“Jepeni  emrin:  ”.  pajtohem!").

  Tani  a  =  4   -­‐-­‐   Zvoglohet  vlera  per  1   a  =  3.   a++.Operatoret aritmetik Operatori   Pershkrimi   Shembulli   ++   Rritet  vlera  per  1   a  =  3.   Tani  a  =  2   %   Modular   a=8  %  3.   a    -­‐-­‐  .   +   Mbledhje  dhe  shLm   -­‐   Zbritje   *   Shumezim   /   PjesLm   .

a alert(++a). --a. a += 1. Prefiks dhe postfiks var a = 5. a--. a = a .1. a -= 1. 5 Rezultati shfaqet: 6 Rezultati shfaqet: 5 . a var a = 5. ++a. 5 alert(a++). a++.Rritjet / zvoglimet a = a + 1.

Operatori ternary (tresh) kushti ? true: false var lojtari1 = 230. var lojtari2 = 378. var fituesi = (lojtari1 > lojtari2) ? fituesi1 : fituesi2. if (lojtari1 > lojtari2){ fituesi = lojtari1. } else{ fituesi = lojtari2. } .

Operatoret krahasues Operatori   Pershkrimi   Shembulli   =   E  barabart   ==   Krahasuese   ===   Strikt  krahasuese   <=   Me  e  vogel  ose  baraz   >=   Me  e  madhe  ose  baraz   <   Me  e  vogel   >   Me  e  madhe   !=   Jo  e  barabarte   !==   Strikt  jo  e  barabart   .

Operatoret logjik Operatori   Pershkrimi   Shembulli   &&   Dhe   ||   Ose   javascript   if ( a<10 && b === 20 ){ … if ( a<10 || b ===20 ){ … if ((a<10) && (b===20)){ … if( (a < 10) && (b === 20) ) .

b=3. var rezultati. alert("rezultati eshte: " + rezultati).Detyre  per  ushtrime  1   javascript   var a = 5. ReultaL   Rezultati eshte: 8 . rezultati = a+b. var b.

Kushtet 17 Driton Haxhiu .

Kushtet if ( …kushti… ){ //…deklarimi I kodimit tuaj ne baze te kushtit shkruhet ketu… . //… } else if( …kushti tjeter… ){ //perndryshe ekzekutohet kodi qe shkruhet ketu } Else{ //perndryshe ekzekutohet kodi qe shkruhet ketu } .

Perndryshe shfaqe mesazhin -.   Nese a eshte e barabart me b. }  else  {   atehere ekzekutohe –Vlerat jane te  alert(”a  eshte  me  madhe”).   inicializuara njera me vkere 4 dhe if  (a  ==  b){   tjetra me vlere 346.   djathte jane dhene dy variabla te var  b  =  346. ekzekutoje mesazhin –a eshte me e vogel--. } Perndryshe nese a eshte me e vogel ose baraz me b.
  alert(”Vlerat  jane  te  barabarta:  ”).a eshte me e madhe -- .Detyre  nga  kushL   javascript   Ne kodin qe shihni ne anen e var  a  =  4.   barabarta--.   
 }   Ne kushtin e me poshtem kemi else  if(a<=  b){   thene:  alert(”a  eshte  me  e  vogel”).

   alert("Zbritja:  "  +  rez  ).    alert("Shuma:  "  +  rez  ).    alert("Shumezimi:  "  +  rez  ).   var  emri  =  prompt("si  quheni?  ").   var  oper  =  prompt("Operatori?  ").Detyre  per  ushtrime  2   javascript   javascript   var  a  =  4.   } .   alert("Emri  juaj  eshte:  "  +  emri  ).   var  b  =  346.   if  (oper  ==  1){    rez  =  a  +  b.   }   else  if(oper  ==  2){    rez  =  a  -­‐  b.     var  rez.   }  else  {    rez  =  a  *  b.

18 Unazat (loops) Driton Haxhiu .

Deklarimi  i  dyte     Per te krijuar nje unaze. 
   Shembull konkret: Permes unazave ne Deklarimi  i  pare   mund ti gjenerojme numrat personal te Deklarimi  i  dyte   qytetareve te vendit. madje ne mund ti kufizojme Deklarimi  i  pare   disa numra te rezervuar. Per te mos I   perseritur manualisht keto te dhena Deklarimi  i  pare   atehere ne perdorim unazat (loop) per te Deklarimi  i  dyte   kryer nje pune te tille. ose tabelat e   veturave. while (beje.Unazat (Loops) Ka raste kur neve na nevoitet qe te Deklarimi   Deklarimi  ii    ppare   are   Deklarimi  i  pare   kryejme nje pune te njejte shume here Deklarimi   Deklarimi  ii    ddyte   yte   Deklarimi  i  dyte   (2. 5 ose 500 deri ne infinit). kemi tri menyra: Deklarimi  i  pare   •  While (gjersa) Deklarimi  i  dyte   •  Do. gjersa)   •  For (per) .

While  (Gjersa)  
Njejte  sikurse  tek  kushtet  qe  kemi  
If(  a<  10){   javascript  
 //…  beje  dicka  …  
var  a  =  1;    
}  
Mirepo  ne  kete  rast  ne  zevendesojme  if   while(  a<  10){  
me  while.    console.log(a);  
   a++;  
While  (a  <  10){   }
 //…  beje  dicka  …  
}  

Do…  While  (Beje…  Gjersa)  
javascript  
var  a  =  1;    
do  {  
 console.log(a);  
 a++;  
}    
while(  a<  10);

For  (per)  
Kontrollo  kushCn  

Vendosja  e  indexit   Rrit  vleren  per  1  
Vendosja  e  indexit  

var  a  =  1;   Kontrollo  kushCn   for  (i  =  1;  i  <  10;  i++){  
     //  …bej  disa  gjera  …  
while(  a<  10){   }
 console.log(a);  
 a++;  
} Rrit  vleren  per  1  
 

Shembull nga unaza
javascript  
for  (i  =  1;  i  <  10;  i++){  
   console.log(i);  
   i++;    
}

Break Continue
javascript   javascript  
for  (i  =  1;  i  <  10;  i++){   for  (i  =  1;  i  <  10;  i++){  
“Break”, nese “Break”, nese
   console.log(i);      console.log(i);  
   i++;     plotesohet    i++;     plotesohet kushti
   if  (i  ==  98){   kushti brenda    if  (i  ==  98){   brenda unazes
     break;   unazes atehere      conLnue;   atehere na qet
   }   na qet jasht    }   jasht unazes.
} unazes. }

19 Funksionet Driton Haxhiu .

mirepo ne JavaScript thjesht Funksione. Ne gjuhet tjera programuese i gjejme si sub rutin ose si module. javascript   function myFunction(){ console.Per te bere kodin me te lexueshem dhe per te bere me te lehte manipulimin me te. world!”). } .log(“Hello. funksione. atehere ne krijojme.

. return x. myFunction(543.log(shuma). console.y){ var shuma = x+y.65). Emertimi Parametri function myFunction(x.98). } myFunction(12.

“Driton Haxhiu”. 36. 36. emri){ //Pjese e kodit } llogariaBankare(1200. muaji. Duhet te keni kujdese . interesi. 12. llogariaBankare(1200. 12. // Vlerat tjera do te zevendesohen me undefinde. // Nuk do me thene qe funksionon. “Programer”).Parametrat mosperputhes function llogariabankare(shuma. 36). por as nuk do te thot qe funksionon. “Driton Haxhiu”). //Parametrat shtese do te injorohen llogariaBankare(1200.

} shembull().log(foo). // Variabel globale function shembull(){ foo = 342. console.log(foo). // UNDEFINED var foo. // 342 .log(foo).log(foo). // 342 console.Variable Scope (fushat qe shihen) function shembull(){ var foo = 342. } shembull(). // 342 console. console.

log(i). } gjeneratori(9). .log(i). i++) console. i<=n. i++) console. } z = prompt(”Jepeni vleren: "). i<=n. function gjeneratori(n){ for (i=0.Shembull nga Funksionet function gjeneratori(n){ for (i=0. gjeneratori(z).

Ne oren e ardhshme: • Vektoret • Numrat • Stringjet • Datat • Objektet .

20 Tipet dhe objektet Vargjet (vektoret) Ang. Arrays Driton Haxhiu .

vargu   vetme. Vlera e variables 87   mund te jete. e cila permban shume vlera numerike dhe vargu[0] = 45. JavaScriptes qe po krijojme Vargu[2] = “Driton”. Kemi krijuar nje variabel njeVlere   njeVlere = 87. dhe e kemi inicializuar me nje vlere. atehere shenojme “[ ]” [2] Driton   Fillon nga 0 (zero) alert ( vargu[2] ) .Krijojme vargje var njeVlere. [1] 76   nje varg. numer. [0] 45   tekstuale per ti treguar Vargu[1] = 76. string dhe bulean Vargu eshte nje variabel e var vargu = []. .

76. Fillon nga 0 (zero) [2] Driton   var vargu = [ 45. Vargu[1] = 76. [0] [1] [2] alert ( vargu[2] ) .Krijojme vargje ne rruge te shkurter vargu   var vargu = []. [1] 76   Vargu[2] = “Driton”. “Driton” ]. [0] 45   vargu[0] = 45. .

Kjo eshte menyra ime qe preferoje var vargu = new Array(). Ne JavaScript vargjet gjithmon jane dinamike alert ( vargu[2] ) . . Vargjet jane objekte var vargu = Array().Krijojme vargje ne rruge te gajte var vargu = []. var vargu = Array(5).

Tiparet e vargjeve (properties) Me qenese vargjet jane objekte. Console. 34 ].log( vargu. 78. metodat dhe te tjerat me gjeresisht do ti mesojme ne Programim te Orientuar ne Objekte) var vargu = [ 45. atehere ato kan veti dhe metoda (Vetit.length) . 76. // gjatesia e vargut eshte: 4 //indeksi me I lart eshte [3] //Highest index Metodat paraqesin informatat qe i posedon .

”40. console. var vleraRevers = vleraVargut.Metodat e vargjeve (properties) Vargjet gjithashtu kan metoda.20.disaMetoda (parametrat).reverse().join().log(vleraRevers. 30. Krojon varg tjeter . 40]. . //thirja e nje metode var vleraVargut = [ 10.10” . //thirja e nje funksioni Metodat jane funksione qe I perkasin nje objekti disaObjekte.join) . 20.30. disaFunksione (parametrat).sort().

atehere thrrasim te gjitha linqet var varguILinqeve= document.html>…   [2] <a  href=“kontakL. varguILinqeve   [0] <a  href=“index.getElementByTagName(“a”).Vargjet jane cdokund Nese duam te dijme sa linqe kemi ne faqen tone.html>…   [1] <a  href=“rrethnesh.html>…   .

21 Tipet dhe objektet Numrat Driton Haxhiu .

.3.Numrat njeVlere   var x = 87. 87   Numrat ne JavaScript jane 64-bit float var x = 87.

log(x+y).Mbledhja kunder shtimit (+) var x = 5. console. // 11 var x = “5”. vlerat e x dhe y Stringjet console. // 56 . Numrat Ketu mblidhen vlerat e x dhe y var y = 6.log(x+y). Ketu behen bashk var x = “6”.

log(x*y). var y = ”6”. console. // 56 – njera vlere eshte string var x = 5. console.log(x+y). var y = ”6”.Mbledhja kunder shtimit (+) Cka ndodhe kur njera vlere eshte numer. tjetra string? var x = 5. // NaN Not a Number (Nuk eshte nje Numer) .

Si ta bejme kete? var x = ”36”.Nuk eshte nje numer (NaN) Nganjehere na nevoitet nje vlere ta bejme numer. Si ta bejme kete? . // mund te jete “abc” var numriIm = Number(x). nese ai eshte string. // Beje numer Nganjehere na nevoitet me dite. per nje vlere eshte numer apo string.

round(x).c).Objektet matematikore Krijojme nje variebel x me presje dhjetore.c).min(a. var vleraMaksimale = Math. var vleraMinimale = Math.log() .random() . // 53 Nese duam te gjeme vleren maksimale dhe/ose minimale te dy ose me shume variablave atehere shkruajme: var a = 220. Nese duam qe kete vlere ta fiksojme duke marr parasysh presjen dhetore atehere shkruajme var x = 52. b = 35544. Math. var y = Math.sqrt() .max(a. c = 2.b.b.6.PI Math.

22 Tipet dhe objektet Stringjet Driton Haxhiu .

. var stringu = ‘String tjeter”.Stringjet var stringu = ”Thojza te dyfishta”. var stringu = ‘Thojza te njefishta’.

. var stringu = “S’eshte keq”.Thojzat brenda thojzave var stringu = ‘S’lejohen miksimet’. var stringu = “Thenja: \” Pune pune…\””. var stringu = “Thenja:” Pune pune…””.

emrin e variables se stringut. // 18 – .Tiparet e stringjeve . var stringu = ‘Nje fraze testuese’.log(stringu.length Shpeshe here ne JavaScript na nevoitet te marrim gjatesine e nje stringu. console. atehere ne perdorim. te cfardo teksti. Ne kete rast na shfaqet numri I karaktereve ne ate string. Per te marrur gjatesine e tekstit.length). pastaj length.

split(“ ”). Nje string mund ta paraqesmi me te gjitha karakteret e mdha ose te vogla duke perdorur .”) ose … .toLowerCase() console.”) var stringu = ‘Nje fraze testuese. naj ndaj tekstin per cdo hapsire te bardh qe ka.Metodat e stringjeve . duke e vendosur ate brenda kllapave si ne shembullin e meposhtem … .split(“. pikepresje apo ndonje karakteri tjeter. pastaj ne mund ta therrasim cilindo pjese te tij.split(“. 0 Nje 1 fraze 2 testuese.split Ne JavaScript ne mund ta ndajme nje string ne copa dhe me ane te tij krijojme nje varg.’. var fjalet = stringu.log(stringu.toUpperCase). Stringun mund ta ndajme edhe pas cdo pike. Ne rastin e meposhtem I kemi thene. // NJE FRAZE TESTUESE .toUpperCase() dhe .

indexOf(“FjalaQeIndeksohet”) var stringu = ‘Nje fraze testuese. Shembull mund ta paraqesmi ne ekran.’. var fjalet = stringu.indexOf(“fraze”). mund ti japim veti tjera ne CSS… Indeksimi I tekstit ne JS behet sikur me poshte emriStringut. .Metodat e stringjeve .indexof Ne mund te indeksojme nje pjese te caktuar te teksit pastaj me ate pjese mund te bejme cfardo qe duam.

substr(). // fraze .substring() edhe me .’.slice Ne raste te caktuara neve na nevoitet qe te prejme nje cope te caktuar te tekstit. ku ate permbajtje e prejme dhe e vendosim si lajme te shkurter.9. eshte fjala qe ruhet ne variablen segmenti Ne JavaScript prerja e tekstit mund te behet . mund ti presmi vetem disa rreshta te lajmit. Atehere do te vij fjala “Nje fraze” var stringu = ‘Nje fraze testuese.substr() . // 0123456789 var segmenti = stringu. Nje shembull tipik do te ishte permbajtja e nje artikulli te nje uebfaqe. pastaj ta paraqesmi ate. duke filluar nga 0. kaloj 4 karaktere. Shpesh mund ta gjeni edhe keshtu . Ne rastin tone I kemi thene.substring() dhe . pastaj merri 5 karaktere te tjera. Nese ne rastin tone i themi 0. ku fundi I tyre eshte 9.9). Me poshte eshte shembulli se si behet prerja e stringut.slice(4.Metodat e stringjeve .

23 Tipet dhe objektet Datat Driton Haxhiu .

aktual var data = New. sekondat aktual .2000.0. muaji viti . viti. perveq qe ka objektet e stringjeve dhe ato matematikore.Datat dhe koha JavaScript.0. // Data.Date(1.Date().0.0. minutat. ora.Date(1.2000). ato na nevoiten pothuajse cdo kund var sot = New.0). muaji. // Data dhe koha aktuale var data = New. Datat perdoren shume ne programim.0. gjithashtu ka dhe objektet e datave. // Data.

Metodat e datave .get (merr) Nese duam te marrim nje metode te dates atehere kemi: var sot = New.getDate(). // 1-31 dite te muajit sot. // 0-11 (0-janar -11 dhjetor) sot. // Data dhe koha aktuale sot.getTime(). // 0-23 dite te javes(0 == e Diele) sot. // milisekondat qe nga 1/1/1970 . // YYYY (baza nuk eshte 0) sot.Date(). // 0-6 dite te javes(0 == e Diele) sot.getFullYear().getHour().getMonth().getDay().

getDay() ).5. .Shembull Nese duam te marrim nje metode te dates atehere kemi: var diteLindja = new Date(16.diteLindja. console.1987).log("Driton Haxhiu ka lindur ne diten e: " .

setMonth(5). sot. sot. sot.setFullYear(2012). // Data dhe koha aktuale sot.setDay(). apo cfaredo kohe.Date(). sot. ore muaj.Metodat e datave . kemi: var sot = New. sot. .setHour().setDate().setTime().set (shto) Nese duam te shtojme nje date.

(d.Date(2000.0.1).Date(2000.m.getTime() == data2.getTime()) { // vlera do te jete True . if (data1 == data2){ // False Pamarr parasysh nese kemi perdor dy ose tri barazime rezultati eshte fals.Krahasimi i datave Kemi deklaruar dy variabla dhe i krahasojme ato var data1 = New. Krej kjo ngase data eshte nje objekt.0. var data1 = New.th. if (data1. pra I marrim dhe i krahasojme me milisekonda. Nuk jane te barabarta. Krejt cka na duhet neve eshte ti marrim data si dy vlera numerike.).1).

24 OOP Hyrje ne OOP Programim I orientuar ne objekte Driton Haxhiu .

Keshtu nuk ishte gjithmon. Cobol. nen rutina (sub- routin)ose module. para shume viteve eshte programuar ne menyre procedurale ne Assembly. te kombinuara ne logjike dhe te dhena dhe krejt keto kan qen te perziera bashk . Fortrain. keto jane gjuhe procedurale dhe programi eshte shkruar ne nje procedure te gjate edhe pse ka permbajt funksione.Hyrje ne OOP Shumica e gjuheve programuese te cilat jane zhvillu ne 30 vitet e fundit jan quajtur Gjuhe te Orentuara ne Objekte. Keto gjuhe nuk jane OOP.

Secili objekt reprezenton pjese te ndryshe te aplikacionit dhe secili objekt permban te dhenat e tij (data) dhe logjikat e tij (logics) dhe pastaj ato komunikojne mes veti Objekti 2 Objekti 1 data   data   Objekti … logic   logic   data   logic   . eshte ndare ne pjese te cilat quhen Objekte.Pershkrim Ne OOP. me nje fjale mund ti quajme edhe mini-programe. krejt kodi I cili eshte skruar ne nje procedure te gjate.

mund te jete cfaredo objekti edhe I botes reale. e cila eshte perkrahur ne shume gjuhe programuese. OOP eshte nje ide. Para se me vazhdu tutje ne duhet ti dijme disa terme Objekti 2 Objekti 1 data   data   Objekti … logic   logic   data   logic   . nje veture apo nje shtepi.Cka permban nje objekt Nje objekt nuk eshte dicka imaxhinare. nje objekt mund te jete nje lojtar. nje llogari bankare.

e cila pershkrun nje gje cfare eshte.Class (Klasa) Klasa eshte nje skice. Shembull mund te jete skica e shtepise. nje pershkrim. nje definim. por nuk eshte vete ajo gje. Cdo klase permban dhe definon dy gjera: •  Atributet •  Sjelljet .

Cka definon nje klase? Disa gjera qe permban nje klase Atributet dhe sjelljet ne shumicen e jane karakteristikat (atributet) gjuheve programuese i gjeni si dhe disa jane sjelljet Tipare (veti) ang.Proporties dhe Sjelljet si Metoda. Methods Class Class ATRIBUTET SJELLJET VETIT METODAT emri ece emri ece gjatesia vrapon gjatesia vrapon pesha kercen pesha kercen gjinia flet gjinia flet mosha flen mosha flen … … … … Pershkrimi i nje personi Pershkrimi i nje personi . ang.

ashtu edhe ne programim.Objekti (Object) Njejt sikur e bejme nje skice per shtepi dhe ne nuk e ndertojme ate. 1). 2) Nje shtepi e bazuar ne nje skice
 Shume shtepi te bazuara ne nje plan (skice)
 fig. prej nje klase mund te krijojme shume objekte. sikurse nje shtepi qe mund ta ndertojme duke u bazuar ne skice (fig. Jo vetem kaq. 1 fig. (fig. Pra nje objekt krijohet duke u bazuar ne klase. ashtu edhe ne programim klasa pa objekt eshte e panevojshme. sikurse nga nje skice ne mund te ndertojme shume shtepi.2 .

•  Sjelljet Pra shprehja po krijoje nje objekte mund te thuhet po krijoje nje instance.” llogariaBankare Dritoni Trimi numriLlogarise 2173512077 5457585 bilanci 270$ 320$ dataHapjes 15/05/2013 04/11/2010 tipiLlogarise Rrjedhse Rrjedhse hape() hape() hape() mbylle() mbylle() mbylle() depozito() depozito() depozito() terheq() terheq() terheq() Klasa Objektet (instancat) .Cka definon nje Objekt? Nje objekt nuk eshte asgje tjeter perveqse nje klase e inicializuar me vlera. Nje objekt dallon nga nje objekt tjeter permes tri gjerave: •  Identiteti ID •  Vetite “Objektet ndryshe I gjeme edhe si instanca.

atehere nuk eshte veture. Nje objekt mund ta pershkruajme me tri gjera: Identiteti. Atributet dhe sjellja (gjerat qe bene objekti). mirepo ato dallohen permes identitetit. Pra shpesh here nje objekt mund te kete atribute te njejta me nje tjeter. Ne kete rast ne kemi krijuar nje objekt (mjet udhetimi) dhe mund ta perdorim sa here qe na nevojitet. ka apo nuk ka drita. pastaj ku duhet te kthehemi djathtas. nese noton. ku majtas. ashtu edhe ne programim nuk shkojne ne kete menyre.
 Ne duhet te percjellim rregulla. Nese na duhet te krijojme nje veture atehere nga skica plotesojme: Atributet dhe sjelljet e tije qe bene nje veture. Permes krejt ketyre ne kemi krijuar skicen qe ne prgramim quhet klase. per te arritur nga pika A ne piken B eshte nje rruge e cila pershkruhet me gjatesi dhe ka nje mori kushtesh per te arritur deri ne destinacionin e duhur. momentin qe nisemi sa duhet te vazhdojme drejte. Po e zeme qe nuk ekzistone nje mjet i tille ndaj ne duhet ta krijojme se pari. I themi se objekti ka nje ngjyre. Perveq ketyre ne duhet ti vendosim edhe per gjerat qe do te beje mjeti: Leviz apo nuk levize. Gjeja e pare qe bejme kur fillojme te zhvillojme nje ide. ka apo nuk ka krah.Pershkrimi i OOP-s? Per te pershkruar programimin e orientuar ne objekte. atributet tjera mund ti kene te njejta apo te ndryshme. Ne kuader te kesaje ne krijojme nje ose me shume objekte.   . ka apo nuk ka rrota. atehere nuk eshte veture. nese eshte e gjelbert atehere ka duhet vazhdojme. Gjeja e pare qe na vjene ne mendje eshte nje trajektore nga pika A ne piken B. sa kilometra. Njejte sikur nje arkitet qe krijon skicen e tije dhe pastaj duke u bazuar ne te krijon objekte banimi ashtu edhe ne duke u bazuar ne skicen tone krijojme objekte udhetimi. Shembull: Nese gjindemi ne qytetin e Ferizajt dhe ne nje moment na kerkon dikush qe te shkojme ne Prishtine. Per te dalluar nje veture prej nje anije apo nje aeroplani atehere ne tregojme edhe sjelljet e tij. mirepo gjerat sikurse ne jeten reale. Vetura mund te kete shume. eshte skica qe ne programim paraqitet si klase. Per kete arsye programeret krijojne library me mori klasash dhe objektesh dhe ato I perdorin sa here qe ju duhen. noton apo nuk noton. ka timon. mirepo sjelljet mund ti kete tjera ose e kunderta. Ne rastin ton mjetit te udhetimit I japim nje identitet. fluturon apo nuk fluturon. Perveq qe duhet ti plotesojme te gjitha keto kushte neve na nevoitet edhe nje mjet udhetimi per te arritur deri tek vendi. mandej e pershkruajme permes atributeve. ne rastin ton mjete udhetimi si: Veture. si shembull me I mire do te ishte trafiku dhe mjetet motorike. Nese hasim ne semafor dhe semafori eshte ne te kuqen atehere duhet te presim disa caste. Aeroplan etj. Tren. Anije. Nese fluturon. ka apo nuk ka dritare.

25 Tipet dhe objektet Objektet Driton Haxhiu .

dime si te krijojme funksione.Krijimi i nje objektit Eshte shume e thjeshte per te krijuar nje objekt ne JS. 1   niveli   .emri = “Driton”. 234   rezultaL   var niveliLojtarit = 1. te gjitha se bashku. Driton   emri   var rezultatiLojtarit= 234. Ne krejt cka duhet te bejme. Lojtari.niveli = 1. 1   niveli   Ve-t  (propor-es)   lojtari   var lojtari= new Object(). Driton   emri   Lojtari. 234   rezultaL   Lojtari. Variabla   var emriLojtarit = “Driton”. Ne e dime se si te krijojme variabla.rezultati = 234. eshte ti fusim ne nje kontinier (vend).

emri  +  ". alert("Lojtari  me  emrin:  "  +  lojtari1.niveli).  ka  mbledhur  "  +  lojtari1. console.emri).Krijimi i nje objektit ne rruge te shkurte var lojtari1= { emri:“Driton”.rezultaL  +  "  pike").log(lojtari1.lojtari1. lojtari1. niveli:5} lojtari1   lojtari2   Driton   emri   Lena   emri   234   rezultaL   349   rezultaL   1   niveli   5   niveli   Kemi krijuar dy objekte te ndryshme me veti te ndryshme console.emri. rezultati:236. niveli:1} var lojtari2= { emri:“Lena”. . rezultati:349.log(lojtari1.rezultati.

niveli:1} var lojtari2= { emri:“Lena”. lojtari2. rezultati:349.Objekt me i avansuar //Krijojme dy objekte var lojtari1= { emri:“Driton”. .rezultaL  +  "  pike").shfaqDetaje = detajeNgaLojtari. niveli:5} function detajeNgaLojtari(){ //paraqit info per secilin lojtar  alert("Lojtari  me  emrin:  "  +  this. rezultati:236.shfaqDetaje ().  ka  mbledhur  "  +  this. //Therrasmi shfaq detajet lojtari1.emri  +  ".shfaqDetaje = detajeNgaLojtari. } //krijimi i nje metode lojtari1.

26 Tipet dhe objektet DOM Document Object Model Driton Haxhiu .

$(“#menya”).getElementById(“menya”).addClass(“menya-kryesore”). document.JavaScript vs jQuery Ne kete rast do te gjendet elementi me id “menya” dhe do ti shtohet klasa “menya-kryesore”. .className = “menya-kryesore”.