+ All Categories
Home > Software > CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Date post: 16-Apr-2017
Category:
Upload: sabin-buraga
View: 400 times
Download: 8 times
Share this document with a friend
156
Dr. Sabin Buragawww.purl.org/net/busaco Dezvoltarea aplicațiilor Web la nivel de client {} programare Web limbajul JavaScript o prezentare general ă
Transcript
Page 1: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Dezvoltarea aplicațiilor Webla nivel de client

{}programare Web

limbajul JavaScript – o prezentare generală

Page 2: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

„Un arcaș bun atinge țintachiar înainte de a trage.”

Ch’Ao Pu-Che

Page 3: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Inventat de Brendan Eich (1995)

denumit inițial Mocha, apoi LiveScript

Page 4: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Implementat în premieră de browser-ulNetscape Navigator

www.w3.org/community/webed/wiki/A_Short_History_of_JavaScript

Page 5: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Adaptat de Microsoft: JScript (1996)

Page 6: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Standardizat în 1997 de ECMAEuropean Computer Manufacturers Association

ECMAScriptECMA-262

www.ecma-international.org/publications/standards/Ecma-262.htm

Page 7: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Standardizat în 1997 de ECMAEuropean Computer Manufacturers Association

ECMAScript

versiunea standardizată în vigoare: 5.1 (iunie 2011)

referința de bază: https://developer.mozilla.org/JavaScript

Page 8: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Standardizat în 1997 de ECMAEuropean Computer Manufacturers Association

ECMAScript

versiunea cea mai recentă: 6.0 – ES6 (ECMAScript 2015)

git.io/es6features detalii într-un curs viitor

Page 9: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Limbaj de tip script (interpretat)

destinat să manipuleze, să automatizezeși să integreze funcționalitățile

oferite de un anumit sistem

Page 10: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Limbaj de tip script (interpretat)

nu necesită intrări/ieșiri în mod implicit

Page 11: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Adoptă diverse paradigme de programare

imperativă

à la C

Page 12: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Adoptă diverse paradigme de programare

funcțională

λ calculfuncții anonime, închideri (closures),…

Page 13: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Adoptă diverse paradigme de programare

pseudo-obiectuală

via prototipuri (obiectele moștenesc alte obiecte, nu clase)

Page 14: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Adoptă diverse paradigme de programare

dinamică

variabilele își pot schimba tipul pe parcursul rulării programului

Page 15: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Cum putem executa programele JavaScript?

Page 16: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Mediu de execuție (host-environment)

navigator Web

permite rularea de aplicații Web la nivelul unei platforme(un sistem de operare)

Page 17: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Mediu de execuție (host-environment)

navigator Web

permite rularea de aplicații Web la nivelul unei platforme(un sistem de operare)

inclusiv pe dispozitive mobile (Android, iOS, Firefox OS, Fire OS (Kindle Fire), Windows Phone,…),

console de jocuri și altele

Page 18: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Mediu de execuție (host-environment)

navigator Web

„injectarea” de cod JavaScriptîn documentele HTML via elementul <script>

Page 19: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Mediu de execuție (host-environment)

navigator Web

„injectarea” de cod JavaScriptîn documentele HTML via elementul <script>

cod extern referit printr-un URL vs. cod inclus direct în pagina Web

Page 20: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Mediu de execuție (host-environment)

independent de navigatorul Web

platforme de dezvoltare de aplicații distribuite: Node.jsservere de baze de date – e.g., Apache CouchDB

componente ale sistemului de operareaplicații de sine-stătătoare – e.g., Adobe Creative Suite

Page 21: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Cuvinte rezervate:

break else new var case finally return void catch

for switch while continue function this with default

if throw delete in try do instanceof typeof

caracteristici: sintaxa

Page 22: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Alte cuvinte rezervate:

abstract enum int short boolean export interface

static byte extends long super char final native

synchronized class float package throws const

goto private transient debugger implements

protected volatile double import public

caracteristici: sintaxa

Page 23: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Number

reprezentare în dublă precizie

stocare pe 64 biți – standardul IEEE 754

caracteristici: tipuri de date

developer.mozilla.org/Web/JavaScript/Reference/Global_Objects/Number

Page 24: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

String

secvențe de caractere Unicode

fiecare caracter ocupă 16 biți (UTF-16)

caracteristici: tipuri de date

developer.mozilla.org/Web/JavaScript/Reference/Global_Objects/String

Page 25: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Boolean

expresii ce se pot evalua ca fiind true/false

caracteristici: tipuri de date

developer.mozilla.org/Web/JavaScript/Reference/Global_Objects/Boolean

Page 26: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Object

aproape totul e considerat ca fiind obiect,inclusiv funcțiile

caracteristici: tipuri de date

Page 27: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Null

semnifică „nicio valoare”

caracteristici: tipuri de date

Page 28: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Undefined

are semnificația „nicio valoare asignată încă”

caracteristici: tipuri de date

Page 29: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Nu există valori întregi

caracteristici: tipuri de date

Page 30: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Nu există valori întregi

convertirea unui șir în număr: parseInt ()

parseInt ("123") 123parseInt ("11", 2) 3

caracteristici: tipuri de date

indică bazade numerație

Page 31: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

„Valoarea” NaN (“not a number”)

parseInt ("Salut") NaNisNaN (NaN + 3) true

caracteristici: tipuri de date

Page 32: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Valori speciale:

Infinity

–Infinity

caracteristici: tipuri de date

Page 33: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Operații avansate cu numere se pot realizavia obiectul predefinit Math

caracteristici: tipuri de date

Page 34: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Operații avansate cu numere se pot realizavia obiectul predefinit Math

constante predefinite:Math.PI

Math.E

Math.LN10

etc.

caracteristici: tipuri de date

Page 35: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Operații avansate cu numere se pot realizavia obiectul predefinit Math

metode: Math.abs(x) Math.ceil(x) Math.cos(x) Math.exp(x) Math.floor(x)

Math.log(x) Math.max(x, ..) Math.min(x, ..) Math.pow(x, y)

Math.random() Math.round(x) Math.sin(x) Math.sqrt(x) etc.

caracteristici: tipuri de date

developer.mozilla.org/Web/JavaScript/Reference/Global_Objects/Math

Page 36: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Un caracter reprezintă un șir de lungime 1

caracteristici: tipuri de date

Page 37: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Șirurile sunt obiecte

"Salut".length 5

caracteristici: tipuri de date

Page 38: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Metode utile pentru procesarea șirurilor de caractere:

String.charAt(pos) String.charCodeAt(pos) String.concat(s1, ..)

String.indexOf(s1, start)

String.match(regexp) String.replace(search, replace)

String.slice(start, end) String.split(separator, limit)

String.substring(start, end)

String.toLowerCase() String.toUpperCase()

etc.

caracteristici: tipuri de date

Page 39: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Valorile 0, "", NaN, null, undefined

sunt interpretate ca fiind false

!!234 true

caracteristici: tipuri de date

Page 40: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Variabilele se declară cu var

var marime;

var numeAnimal = "Tux";

variabilele declarate fără valori asignate, se consideră undefined

caracteristici: variabile

Page 41: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Dacă nu se folosește var,atunci variabila este considerată globală

de evitat așa ceva!

caracteristici: variabile

Page 42: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Valorile sunt „legate” tardiv la variabile(late binding)

caracteristici: variabile

Page 43: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Pentru numere: + – * / %

De asignare: += –= *= /= %=

Incrementare și decrementare: ++ – –

Concatenare de șiruri: "Java" + "Script" "JavaScript"

caracteristici: operatori

Page 44: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Conversia tipurilor se face „din zbor” (dinamic)

"3" + 4 + 5 "345"

3 + 4 + "5" "75"

adăugând un șir vid la o expresie,o convertim pe aceasta la string

caracteristici: operatori

Page 45: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Comparații: < > <= >= (numere și șiruri)

egalitatea valorilor se testează cu == și !=

1 == true true

caracteristici: operatori

Page 46: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Comparații: < > <= >= (numere și șiruri)

egalitatea valorilor se testează cu == și !=

1 == true true

a se folosi: 1 === true false

caracteristici: operatori

inhibă conversiatipurilor de date

Page 47: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Aflarea tipului unei expresii: operatorul typeoftypeof "Tux" string

caracteristici: operatori

operand rezultat

undefined 'undefined'

null 'object'

de tip Boolean 'boolean'

de tip Number 'number'

de tip String 'string'

Function 'function'

orice alte valori 'object'

Page 48: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Operatorii logici && și ||

var nume = unNume || "Implicit";

caracteristici: operatori

Page 49: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Operatorul ternar de test ? :

var prezență = (studenți > 33) ? "Prea mulți" : "Cam puțini…";

caracteristici: operatori

Page 50: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Testare: if … else, switchpentru switch, sunt permise expresii la fiecare case

(testarea se realizează cu operatorul ===)

switch (2 + 3) { /* sunt permise expresii */

case 4 + 1 : egalitate ();

break;

default : absurd (); // nu se apelează niciodată

}

caracteristici: control

Page 51: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Ciclare: while, do … while, for

do {

var nume = preiaNume ();

} while (nume != "");

for (var contor = 0; contor < 33; contor++) {

// de 33 de ori…

}

caracteristici: control

Page 52: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Excepții: try … catch … finally

try { // Linii "periculoase" ce pot cauza excepții

} catch (eroare) {// Linii rulate la apariția unei/unor excepții

} finally {// Linii care se vor executa la final

}

caracteristici: control

Page 53: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Excepții: try … catch … finally

try { // Linii "periculoase" ce pot cauza excepții

} catch (eroare) {// Linii rulate la apariția unei/unor excepții

} finally {// Linii care se vor executa la final

}

emiterea unei excepții: throw

throw new Error ("O eroare de-a noastră...");

caracteristici: control

Page 54: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Perechi nume—valoare

caracteristici: obiecte

Page 55: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Perechi nume—valoare

tabele de dispersie (hash) în C/C++tablouri asociative în Perl, PHP sau Ruby

HashMaps în Java

“everything except primitive values is an object”

caracteristici: obiecte

Page 56: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Perechi nume—valoare

numele este desemnat de un șir de caractere(i.e., expresie de tip String)

valoarea poate fi de orice tip, inclusiv null sau undefined

caracteristici: obiecte

Page 57: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Obiect colecție de proprietăți,având mai multe atribute

caracteristici: obiecte

Page 58: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Obiect colecție de proprietăți,având mai multe atribute

proprietățile pot conține alte obiecte,valori primitive sau metode

caracteristici: obiecte

Page 59: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Obiecte predefinite:

Global Object

Function Array

String RegExp

Boolean Number

Math Date

caracteristici: obiecte

de studiat developer.mozilla.org/JavaScript/Reference/Global_Objects

Page 60: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Obiecte fundamentale vizând gestionarea erorilor

Error

EvalError

RangeError

ReferenceError

SyntaxError

TypeError

URIError

caracteristici: obiecte

Page 61: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Create prin intermediul operatorului new:

var ob = new Object();

var ob = { }; // echivalent cu linia anterioară

caracteristici: obiecte

se preferă această sintaxă

Page 62: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Accesarea proprietăților – operatorul .

ob.nume = "Tux";

var nume = ob.nume;

caracteristici: obiecte

Page 63: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Accesarea proprietăților – operatorul .

ob.nume = "Tux";

var nume = ob.nume;

echivalent cu:

ob["nume"] = "Tux";

var nume = ob["nume"];

caracteristici: obiecte

Page 64: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Declarare + asignare:

var pinguin = {

nume: "Tux",

proprietati: {

culoare: "verde",

marime: 17

}

}

caracteristici: obiecte

Page 65: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Declarare + asignare:

var pinguin = {

nume: "Tux",

proprietati: {

culoare: "verde",

marime: 17

}

}

caracteristici: obiecte

accesare:pinguin.proprietati.marime 17

pinguin["proprietati"]["culoare"] verde

Page 66: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

var facultyContactInfo = {

// numele proprietăților sunt încadrate de ghilimele

"official-phone" : '+40232201090',

city : 'Iasi', // dacă numele e identificator valid, ghilimelele pot fi omise

'street' : 'Berthelot Street',

'number' : 16, // pot fi folosite orice tipuri de date primitive

"class" : "new", // cuvintele rezervate se plasează între ghilimele

coord : { // obiectele pot conține alte obiecte (nested objects)

'geo' : { 'x': 47.176591, 'y': 27.575930 }

},

age : Math.floor ("24.7") // pot fi invocate metode de calcul a valorilor

};

console.log (facultyContactInfo.coord["geo"].y); // obținem 27.57593

adaptare după Sergiu Dumitriu (2012)

Page 67: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Iterarea proprietăților – considerate chei:

var pinguin = { 'nume': 'Tux', 'marime': 17 };

for (var proprietate in pinguin) {

afiseaza (proprietate + ' = ' + pinguin[proprietate]);

}

caracteristici: obiecte

Page 68: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Eliminarea proprietăților se realizează cu delete

var pinguin = { 'nume': 'Tux', 'marime': 17 };

pinguin.nume = undefined; // nu șterge proprietatea

delete pinguin.marime; // eliminare efectivă

for (var prop in pinguin) {

console.log (prop + "=" + pinguin[prop]);

}

// va apărea doar "nume=undefined"

caracteristici: obiecte

Page 69: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Tipuri speciale de obiecte

proprietățile (cheile) sunt numere,nu șiruri de caractere

caracteristici: tablouri

developer.mozilla.org/Web/JavaScript/Reference/Global_Objects/Array

Page 70: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Se poate utiliza sintaxa privitoare la obiecte:

var animale = new Array ();animale[0] = "pinguin";animale[1] = "omida";animale[2] = "pterodactil";

animale.length 3

caracteristici: tablouri

Page 71: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Se poate utiliza sintaxa privitoare la obiecte:

var animale = new Array ();animale[0] = "pinguin";animale[1] = "omida";animale[2] = "pterodactil";

animale.length 3

notație alternativă – preferată:

var animale = ["pinguin", "omida", "pterodactil"];

caracteristici: tablouri

Page 72: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Elementele pot aparțineunor tipuri de date eterogene

var animale = [33, "vierme", false, "gaga"];

caracteristici: tablouri

Page 73: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Tablourile pot avea „găuri” (sparse arrays):

var animale = ["pinguin", "omida", "pterodactil"];

animale[33] = "om";

animale.length 34typeof animale[13] undefined

caracteristici: tablouri

Page 74: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Tablourile pot avea „găuri” (sparse arrays):

var animale = ["pinguin", "omida", "pterodactil"];

animale[33] = "om";

animale.length 34typeof animale[13] undefined

pentru a adăuga elemente putem recurge la:animale[animale.length] = altAnimal;

caracteristici: tablouri

Page 75: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

var vector = [ ];

vector[0] = "zero";

vector[new Date().getTime()] = "now";

vector[3.14] = "pi";

for (var elem in vector) {

console.log ("vector[" + elem + "] = " + vector[elem] +

", typeof( " + elem +") == " + typeof (elem));

}

caracteristici: tablouri – exemplu

adaptare după John Kugelman (2009)

Page 76: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

rezultatul obținut în urma rulării programului JavaScript via aplicația JS Bin

http://jsbin.com/

Page 77: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Interări:

for (var it = 0; it < animale.length; it++) {

// de prelucrat animale[it]

}

caracteristici: tablouri

Page 78: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Interări:

for (var it = 0; it < animale.length; it++) {

// de prelucrat animale[it]

}

// variantă mai bună

for (var it = 0, lung = animale.length; it < lung; it++) {

// de prelucrat animale[it]

}

caracteristici: tablouri

de ce?

Page 79: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Metode utile:

Array.toString() Array.concat(item, ..) Array.join(separator)

Array.pop() Array.push(item, ..) Array.reverse()

Array.shift() Array.unshift([item]..)

Array.sort(cmpfn) Array.splice(start, delcount, [item]..)

etc.

caracteristici: tablouri

Page 80: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

(în loc de) pauză

Page 81: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Definite via function

function transformaPixeliInPuncte (px) {var puncte = px * 300;return puncte;

}

caracteristici: funcții

developer.mozilla.org/Web/JavaScript/Reference/Global_Objects/Function

Page 82: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Dacă nu este întors nimic în mod explicit, valoarea de retur se consideră undefined

caracteristici: funcții

Page 83: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Parametrii de intrare pot lipsi, fiind considerați undefined

caracteristici: funcții

Page 84: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Pot fi transmise mai multe argumente,cele în surplus fiind ignorate

transformaPixeliInPuncte (10, 7) 3000

caracteristici: funcții

Page 85: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Argumentele primite de o funcție se acceseazăvia tabloul arguments – în prezent, a se evita:

function aduna () {

var suma = 0;

for (var i = 0, j = arguments.length; i < j; i++) {

suma += arguments[i];

}

return suma;

}

caracteristici: funcții

Page 86: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Funcțiile sunt tot obiecte

astfel, pot fi specificate funcții anonime

caracteristici: funcții

expresiilambda

Page 87: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Funcțiile sunt tot obiecte

astfel, pot fi specificate funcții anonime

în acest sens, JavaScript este un limbaj funcțional

caracteristici: funcții

expresiilambda

Page 88: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

var media = function () { // calculul mediei a N numere

var suma = 0;

for (var iter = 0,

lung = arguments.length;

iter < lung; iter++) {

suma += arguments[iter];

}

return suma / arguments.length;

};

caracteristici: funcții

Page 89: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

var media = function () { // calculul mediei a N numere

var suma = 0;

for (var iter = 0,

lung = arguments.length;

iter < lung; iter++) {

suma += arguments[iter];

}

return suma / arguments.length;

};

caracteristici: funcții

variabilele declarate în funcție nu vor fi

accesibile din exterior, fiind „închise”

funcție closure

Page 90: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

console.log ( media (9, 10, 7, 8, 7) ) 8.2

Page 91: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

precizați ce efect vor avea liniile de cod următoare:console.log ( typeof (media) );

console.log ( media() );

Page 92: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

variabila media este de tip function

apelul media() întoarce valoarea NaN

Page 93: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

/* determină numărul caracterelor din nodurile text

ale arborelui DOM-ului asociat unui document */

function numaraCaractereDinNoduriText (element) {

if (element.nodeType == 3) { // nod text (din DOM)

return element.nodeValue.length;

}

var contor = 0;

// recursiv, numărăm caracterele fiecărui nod copil

// al arborelui DOM cu rădăcina ‘element’

for (var it = 0, copil; copil = element.childNodes[it]; it++) {

contor += numaraCaractereDinNoduriText (copil);

}

return contor;

}

vezi celediscutate la DOM

funcții recursive în JavaScript

Page 94: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co// varianta folosind funcții anonime

var nrCaractDoc = (function (element) {

if (element.nodeType == 3) { // nod text

return element.nodeValue.length;

}

var contor = 0;

for (var it = 0, copil; copil = element.childNodes[it]; it++) {

contor += arguments.callee (copil);

}

return contor;

}) (xml.root);

furnizează care-i funcția apelantă

Page 95: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Exemplificare:dorim să procesăm – via funcții –

caracteristici ale unor animale

caracteristici: de la funcții la clase

Page 96: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

function creeazaAnimal (nume, marime) {return { nume: nume, marime: marime }

}function oferaNume (animal) {

return animal.nume;}function oferaMarime (animal) {

return animal.marime;}

caracteristici: de la funcții la clase

Page 97: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

function creeazaAnimal (nume, marime) {return { nume: nume, marime: marime }

}function oferaNume (animal) {

return animal.nume;}function oferaMarime (animal) {

return animal.marime;}

var tux = creeazaAnimal ("Tux", 17);

oferaMarime (tux) 17

caracteristici: de la funcții la clase

Page 98: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

O „clasă” referitoare la animale:

function creeazaAnimal (nume, marime) {return {

nume: nume, // date-membremarime: marime,oferaNume: function () { // metodă de furnizare a numelui

return animal.nume;},oferaMarime: function () { // o altă metodăreturn animal.marime;

}

}}

caracteristici: de la funcții la clase

Page 99: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Dorim să apelăm metodele definite:

var tux = creeazaAnimal ("Tux", 17);

tux.oferaMarime ()

ReferenceError: animal is not defined

caracteristici: de la funcții la clase

Page 100: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

function Animal (nume, marime) {

this.nume = nume; // date-membre

this.marime = marime;

this.oferaNume = function () { // metodă

return this.nume;

};

this.oferaMarime = function () { // metodă

return this.marime;

};

}

caracteristici: de la funcții la clase

creational pattern

pseudo-clase(utilizarea

constructorilor)

Page 101: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Operatorul new creează un nou obiect vid șiapelează funcția specificată cu this setat pe acest obiect

aceste funcții se numesc constructori,trebuie apelate via new

și, prin convenție, au numele scris cu literă mare

caracteristici: funcții & obiecte

Page 102: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Față de alte limbaje de programare, obiectul curent – referit cu this –este setat ca fiind obiectul global

de exemplu, în browser, reprezintă fereastra curentăîn care este redat documentul: this window

caracteristici: de la funcții la clase

Page 103: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

caracteristici: de la funcții la clase

trasarea pas-cu-pas a execuției programului, cu inspectarea valorilor variabilelor, via www.pythontutor.com/visualize.html#py=js

// instanțierea unui obiectvar tux = new Animal ("Tux", 17); console.log (tux.oferaNume ());var jox = tux;console.log (jox.oferaNume ());// alt obiectvar pax = new Animal ("Pax", 15); pax.marime = 21;console.log (pax.oferaMarime ());

Page 104: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Metodele pot fi declarate și în exteriorul constructorului

function oferaNumeAnimal () {

return this.nume;

}

function Animal (nume, marime) {

this.nume = nume;

this.marime = marime;

this.oferaNume = oferaNumeAnimal; // referă funcția de mai sus

}

caracteristici: funcții & obiecte

Page 105: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Orice obiect deține trei tipuri de proprietăți:

named data propertyo proprietate având asignată o valoare

named accessor propertyde tip setter/getter pentru a stabili/accesa o valoare

internal propertyfolosită exclusiv de procesorul ECMAScript (JavaScript)

caracteristici: proprietăți

Page 106: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Fiecare proprietate are asociate atributele:

[[Value]] – desemnează valoarea curentă a proprietății[[Writable]] – indică dacă o proprietate

poate să-și modifice valoarea[[Get]] și [[Set]] – funcții opționale pentru a oferi/stabili

valoarea unei proprietăți de tip accessor[[Enumerable]] – specifică dacă numele proprietății

va fi disponibil într-o buclă for-in

[[Configurable]] – indică dacă proprietatea poate fi ștearsă ori redefinită

caracteristici: proprietăți

Page 107: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

proprietăți interne importante (folosite de procesorul ECMAScript, dar inaccesibile la nivel de program)

[[Prototype]] definește ierarhiilor de obiecte

[[Get]] [[Put]] [[CanPut]] pentru accesarea valorilor

[[HasProperty]]

[[DefineOwnProperty]]

[[GetProperty]]

[[GetOwnProperty]]

[[Delete]]

manipularea proprietăților

[[Extensible]] indică obiectele ce pot fi extinse

[[Construct]]

[[Call]]asociate obiectelor executabile

(funcții)

[[Code]]

[[Scope]]desemnează codul și contextul

unei obiect de tip funcție

Page 108: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

// crearea unei proprietăți simple stocând date

// (writable, enumerable, configurabile)

obiect.numeProprietate = 33;

// crearea via API-ul intern a unei proprietăți stocând date

Object.defineProperty (obiect, "numeProprietate", {

value: 33, writable: true, enumerable: true, configurable: true }

)

caracteristici: proprietăți

Page 109: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

proprietățile interne ale obiectelor definitehttp://www.objectplayground.com/

Page 110: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Deoarece orice obiect deține în mod implicit proprietatea prototype,

structura unei clase poate fi extinsă ulterior

caracteristici: prototipuri

developer.mozilla.org/Web/JavaScript/Reference/Global_Objects/Object/prototype

Page 111: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Deoarece orice obiect deține în mod implicit proprietatea prototype,

structura unei clase poate fi extinsă ulterior

un prototip e o proprietate oferind o legătură ascunsă către obiectul de care aparține

caracteristici: prototipuri

Page 112: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Dacă se încearcă accesarea unui element inexistentîn cadrul unui obiect dat,

se va verifica lanțul de prototipuri (prototype chain)

caracteristici: prototipuri

Page 113: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

function Animal (nume, marime) { // definiție inițială

this.nume = nume;

this.marime = marime;

}

// pe baza protipurilor, definim noi metode

Animal.prototype.oferaNume = function () {

return this.nume;

};

Animal.prototype.oferaMarime = function () {

return this.marime;

};

// instanțiem un obiect de tip Animal

var tux = new Animal ("Tux", 17);

Page 114: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Page 115: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Pentru a cunoaște tipul unui obiect(pe baza constructorului și a ierarhiei de prototipuri)

se folosește operatorul instanceof

caracteristici: prototipuri

Page 116: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

var marimi = [17, 20, 7, 14];

marimi instanceof Array true

marimi instanceof Object true

marimi instanceof String false

var tux = new Animal ("Tux", 17);

tux instanceof Object true

tux instanceof Array false

caracteristici: prototipuri

Page 117: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Adăugarea unei metode se realizează via prototype

Animal.prototype.oferaNumeMare = function () {

return this.nume.toUpperCase ();

};

tux.oferaNumeMare () "TUX"

caracteristici: extinderea claselor

Page 118: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Pot fi extinse și obiectele predefinite:

// adăugăm o metodă obiectului String

String.prototype.inverseaza = function () {

var inv = '';

for (var iter = this.length - 1; iter >= 0; iter--) { // inversăm șirul…

inv += this[iter];

}

return inv;

};

"Web".inverseaza () "beW"

caracteristici: extinderea claselor

Page 119: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Cel mai general prototype este cel al lui Object

una dintre metodele disponibile – predefinite –este toString() care poate fi suprascrisă (over-ride)

caracteristici: extinderea claselor

Page 120: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

var tux = new Animal ("Tux", 17);

tux.toString () [object Object]

Animal.prototype.toString = function () {return '<animal>' + this.oferaNume () + '</animal>';

};

tux.toString () "<animal>Tux</animal>"

caracteristici: extinderea claselor

Page 121: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Page 122: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Atenție la pericole!

de exemplu, comportamentul diferit al construcțieifor (var proprietate in obiect)

caracteristici: extinderea claselor

Page 123: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Șablon general:

ClasaDeBaza = function () { /* … */ };

SubClasa = function () { /* … */ };

SubClasa.prototype = new ClasaDeBaza ();

caracteristici: extinderea claselor

Page 124: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Deoarece o funcție reprezintă un obiect, poate fi:

stocată ca valoare (asociată unei variabile)

pasată ca argument al unei alte funcții

întoarsă de o funcție – fiind argument pentru return

caracteristici: funcții de nivel înalt

Page 125: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Dorim să calculăm greutatea unui animal,după formula greutate = marime * 33

varianta clasică:

var marimi = [17, 20, 7, 14];

var greutati = [ ];

for (var contor = 0; contor < marimi.length; contor++) {

greutati[contor] = marimi[contor] * 33;

}

caracteristici: funcții de nivel înalt

Page 126: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Varianta îmbunătățită – mai generală:

function genereazaTablouGreutati (tablou, calcul) {

var rezultat = [ ];

for (var contor = 0; contor < tablou.length; contor++) {

rezultat[contor] = calcul (tablou[contor]);

}

return rezultat;

}

function calculGreutate (marime) {

return marime * 33;

}

var greutati = genereazaTablouGreutati (marimi, calculGreutate);

referim funcțiace va realiza calculul

Page 127: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Varianta îmbunătățită – mai generală:

function genereazaTablouGreutati (tablou, calcul) {

var rezultat = [ ];

for (var contor = 0; contor < tablou.length; contor++) {

rezultat[contor] = calcul (tablou[contor]);

}

return rezultat;

}

function calculGreutate (marime) {

return marime * 33;

}

var greutati = genereazaTablouGreutati (marimi, calculGreutate);

calcul e variabilăde tip funcție

fiind funcție, se poate apela

Page 128: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

a se consulta șiexemplele din arhivaasociată acestui curs

Page 129: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

JavaScript oferă un singur spațiu de nume, la nivel global

conflicte privind denumirea funcțiilor/variabilelorspecificate de programe diferite,

concepute de mai multi dezvoltatori

caracteristici: încapsulare

Page 130: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Nu trebuie afectat spațiul de nume global,păstrându-se codul-sursă la nivel privat

caracteristici: încapsulare

Page 131: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Codul poate fi complet încapsulatvia funcții anonime

care „păstrează” construcțiile la nivel privat

caracteristici: încapsulare

Page 132: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Declararea imbricată – ca expresii de tip funcție –a funcțiilor anonime are denumirea closures

https://developer.mozilla.org/en/JavaScript/Guide/Closures

caracteristici: closures

închideri

Page 133: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

// specificarea unei expresii de tip funcție

( function () {

// variabilele & funcțiile vor fi vizibile doar aici

// variabilele globale pot fi accesate

} ( ) );

caracteristici: closures

Page 134: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

var cod = (function () {var priv = 0; // variabilă privatăfunction start (x) {

// ... poate accesa 'priv' // și funcția 'faCeva'

}function faAia (param) {// ... invizibilă din afară

}

function faCeva (x, y) {// ...

}return { // sunt publice doar// funcțiile 'start' și 'faCeva''start': start, 'faCeva': faCeva

}}) ();

cod.start (arg); // apelăm 'start'

Page 135: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

var cod = (function () {var priv = 0; // variabilă privatăfunction start (x) {

// ... poate accesa 'priv' // și funcția 'faCeva'

}function faAia (param) {// ... invizibilă din afară

}

function faCeva (x, y) {// ...

}return { // sunt publice doar// funcțiile 'start' și 'faCeva''start': start, 'faCeva': faCeva

}}) ();

cod.start (arg); // apelăm 'start'

via closures, simulăm metodele privatemodularizarea codului (module pattern)

Page 136: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

var makeCounter = function () {var contorPrivat = 0; // un contor de valori (inițial, zero)function changeBy (val) { // funcție privată

contorPrivat += val; // ce modifică valoarea contorului}return { // funcții publice (expuse)

increment: function() {changeBy (1);

},decrement: function() {

changeBy (-1);},value: function() {

return contorPrivat;}

}; };

console.log (contor1.value ()); /* 0 */

contor1.increment ();

contor1.increment ();

console.log (contor1.value ()); /* 2 */

contor1.decrement ();

console.log (contor1.value ()); /* 1 */

console.log (contor2.value ()); /* 0 */

Page 137: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Page 138: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Totul în JavaScript este obiect – chiar și funcțiile

de reținut!

Page 139: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Orice obiect este întotdeauna mutabil(poate fi alterat oricând)

proprietățile și metodele sunt disponibileoriunde în program (public scope)

de reținut!

Page 140: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Nu există vizibilitate la nivel de bloc de cod(block scope),

ci doar la nivel global ori la nivel de funcție

de reținut!

Page 141: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Funcțiile ascund orice e definit în interiorul lor

de reținut!

Page 142: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Operatorul “.” este echivalentcu de-referențierea:

ob.prop === ob["prop"]

de reținut!

Page 143: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Operatorul new creează obiecte aparținând„clasei” specificate de funcția constructor

de reținut!

Page 144: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Accesorul this este relativ la contextul execuției, nu al declarării

de reținut!

Page 145: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Accesorul this este relativ la contextul execuției, nu al declarării

de reținut!

Atenție la dependența de mediul de execuție!

Page 146: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Proprietatea prototype are valori modificabile

de reținut!

Page 147: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

JavaScript Object Notation

http://json.org/

json

Page 148: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Format compact pentru interschimb de dateîntre aplicații

biblioteci de procesare și alte resurse de interes:http://jsonauts.github.io/

json

Page 149: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Datele pot fi specificateîn termeni de obiecte și literali

json

Page 150: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

JavaScript Object Notation

{

'nume': 'Tux',

'stoc': 33,

'model': [ 'candid', 'furios', 'vesel' ]

}

json

datele pot fi evaluate direct în JavaScript

Page 151: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Procesare via obiectul predefinit JSON

JSON.parse()

JSON.stringify()

json

Page 152: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

// definim un șir de caractere ce specifică diverse construcții JSON

// (e.g., preluarea datelor via Ajax/WebSocket-uri de la un serviciu Web/API)

var sirTux = '{ "nume": "Tux", "stoc": 33, "model": [ "candid", "viteaz" ] }';

var tux;

try { // procesăm șirul pentru a genera un obiect JS via obiectul JSON

tux = JSON.parse (sirTux);

} catch (e) { console.log (e.message); /* eroare :( */ }

// obiectul 'tux' generat cu JSON.parse

console.log (tux);

// serializare ca șir de caractere

console.log (JSON.stringify (tux));

Page 153: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

suportul actual oferit de browser pentru JSON

http://caniuse.com/#search=json

Page 154: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Ce trăsături specifice – mai rar ori deloc întâlnite la alte limbaje de programare

cunoscute – prezintă ECMAScript?

discuție (pentru acasă)

Page 155: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

Specificați în ECMAScript – la alegere –structurile de date privitoare la:

arbore binar(di)graf

matrice multidimensională

test scris #3 (T3)

Page 156: CLIW 2015-2016 (7/13) Limbajul de programare JavaScript

Dr.

Sab

in B

ura

ga

www.purl.org/net/busa

co

episodul viitor: JavaScript în cadrul browser-ului


Recommended