In aceasta lectie puteti invata cum se pot crea clase in JavaScript cu metode care pot fi inlantuite.
Inlantuirea metodelor inseamna accesarea mai multor metode, sau functii ale unui obiect, intr-o singura instructune.

obiect.metoda_1().metoda_2()
Cerinta prin care se pot accesa metode inlantuite este ca metoda precedenta (aici metoda_1()) sa returneze instanta de obiect (this).
• Sintaxa:
class NumeClasa {
 constructor(){
 //aici se pot defini proprietati
 }

 metoda_1(){
 // un cod JavaScript

 return this; // returneaza instanta de obiect
 }

 metoda_2(){
 // instructiuni JavaScript
 }
}

- Iata un exemplu, un o clasa JavaScript prin care se pot calcula aria si perimetrul dreptunghiului (vedeti comentariile din cod si testati-l).
class Rectangle {
 constructor(){
 //proprietati
 this.a =0;
 this.b =0;
 }

 // seteaza valorile pt. a si b
 setAB(a1, b1){
 this.a = a1;
 this.b = b1;

 return this; // returneaza instanta de obiect
 }

 // returneaza aria
 area(){
 return this.a * this.b;
 }

 // returneaza perimetru
 perimeter(){
 return 2 * (this.a + this.b);
 }
}

// creaza o instanta de obiect a clasei
var obR = new Rectangle();

// seteaza valorile laturilor si obtine aria si perimetru
var area = obR.setAB(7, 8).area();
var perimeter = obR.setAB(7, 8).perimeter();

// test
document.write('Aria = '+ area +'<br>Perimetru = '+ perimeter);

Multiple metode inlantuite

Se pot apela mai mult de doua metode inlantuite, folosind acelasi principiu: toate metodele accesate precedent trebuie sa returneze instanta de obiect (this).


- Iata un exemplu de inlantuire trei metode. O clasa JavaScript ce poate crea un tag HTML, cu ID, atribut "class" si continut (studiati codul si testati-l).
class setTag {
 constructor(){
 //proprietati
 this.id = ''; // atributul id
 this.cls = ''; // atributul class
 }

 // seteaza id-ul
 setId(id1){
 this.id = ' id="'+ id1 +'"';

 return this; // returneaza instanta de obiect
 }

 // seteaza atributul class
 setClass(cls1){
 this.cls =' class="'+ cls1 +'"';

 return this; // returneaza instanta de obiect
 }

 // returneaza tag-ul HTML si continutul
 getTagCnt(tag, cnt){
 return '<'+ tag + this.id + this.cls +'>'+ cnt +'</'+ tag+ '>';
 }
}

// creaza o instanta de obiect a clasei
var obTag = new setTag();

// variabile cu tipul tag-ului si continut
var tag = 'div';
var cnt = 'https://marplo.net';

// apeleaza metodele inlantuite pt. setare ID, "class", si obtine un <div> cu aceste atribute si continut
var getTag = obTag.setId('some_id').setClass('a_class').getTagCnt(tag, cnt);

// test
document.write(getTag); //<div id="some_id" class="a_class">https://marplo.net</div>
Instructiunea cu metodele inlantuite din codul de mai sus:
var getTag = obTag.setId('some_id').setClass('a_class').getTagCnt(tag, cnt);
E la fel cu acest cod:
// seteaza pe rand ID-ul, "class", apoi obtine tag-ul cu continutul
obTag.setId('some_id');
obTag.setClass('a_class');
var getTag = obTag.getTagCnt(tag, cnt);

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Care tag este element de tip bloc?
<div> <img> <span>
<div>Web Programming and Development</div>
Care cod CSS afiseaza textul subliniat?
font-style: italic; text-decoration: underline; font-weight: 500;
h2 {
  text-decoration: underline;
}
Clic pe functia JavaScript care apeleaza o alta functie dupa un anumit timp.
insertBefore() setTimeout() querySelector()
function someFunction() { alert("CoursesWeb.net"); }
setTimeout("someFunction()", 2000);
Clic pe instructiunea care returneaza numarul total de elemente dintr-un array asociativ.
count($array) count($array, 1) strlen()
$food =["fruits" =>["banana", "mar"), "veggie" =>["ceapa", "rosie"));
$nr_food = count($food, 1);
echo $nr_food;       // 6
Indicati Viitorul Perfect la negativ al verbului din paranteze, in propozitia: "The child (to not play) by Sunday".
has't played haven't been playing will haven't played
The child will haven't played by Sunday.
- Copilul nu s-ar fi jucat pana duminica.
Indicati Viitorul Perfect pentru verbul "contar" (a povesti) la forma "Él".
habrá contado va a contar contaba
Él no habrá contado el cuento.
- El nu ar fi spus povestea.
Creare clase in JavaScript cu Metode care pot fi inlantuite

Last accessed pages

  1. Exercitii engleza - English Tests and exercises - Grammar (24404)
  2. Cursuri Limba Rusa (2056)
  3. Trecutul simplu si continuu - Past Tense Simple and Continuous (32094)
  4. Gramatica limbii engleze - Prezentare Generala (97282)
  5. Laravel - Instalare (853)

Popular pages this month

  1. Gramatica limbii engleze - Prezentare Generala (3364)
  2. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (1177)
  3. Gramatica limbii spaniole. Indrumator si prezentare generala (951)
  4. Alphabet and Pronunciation - Alfabetul si pronuntia in limba engleza (804)
  5. Exercitii engleza - English Tests and exercises - Grammar (753)