Curs Javascript


Apelare functie cu numar diferit de argumente

Cand se creaza o functie ii putem defini si un numar de parametri (sau argumente) pe care le accepta, lucru de care se tine cont in momentul apelarii ei.
Sunt situatii in care dorim sa transmitem functiei un numar diferit de argumente, care poate fi mai mic sau mai mare decat numarul de parametri ai functiei.
Intr-o astfel de situatie se verifica in corpul functiei daca a fost transmisa valoare pentru parametri definiti, daca nu, acel parametru e undefined (evaluat ca False) si se poate da o valoare implicita (default).


- Exemplu, o functie cu un parametru care returneaza un salut cu numele transmis ca argument. Daca acesta nu e transmis, seteaza o valoare implicita.
<div id='dv1'>Content dv1</div>
<div id='dv2'>Content dv2</div>

<script>
function sayHi(name){
 //daca nu e primita valoare pt. 'name', seteaza un text implicit
 if(!name) var name ='Vizitator';

 return 'Salut '+ name;
}

//adauga in #dv1 rezultatul transmis de apelarea functiei fara argument
document.getElementById('dv1').innerHTML = sayHi();

//a doua apelare, cu argument
document.getElementById('dv2').innerHTML = sayHi('MarPlo');
</script>

Definire parametri cu valoare implicita

La crearea unei functii se pot defini parametri cu o valoare implicita, astfel se evita necesitatea verificarii daca argumentul e transmis la apelare.
Sintaxa:
function numeF(p1=v1, p2=v2){
 //codul care va fi executat
}
- 'p1' si 'p2' sunt parametrii; iar 'v1' si 'v2' reprezinta valorile implicite pentru fiecare.

Cand functia este apelata fara argumentul respectiv, parametru va avea valoarea data la definire, altfel preia valoarea transmisa.
Iata exemplu prezentat anterior, dar aici cu valoare implicita definita la parametru.
<div id='dv1'>Div dv1</div>
<div id='dv2'>Div dv2</div>

<script>
//creaza functia cu o valoare default pt. parametru
function sayHi(name='Vizitator'){
 return 'Salut '+ name;
}

//adauga in #dv1 rezultatul transmis de apelarea functiei fara argument
document.getElementById('dv1').innerHTML = sayHi();

//a doua apelare, cu argument
document.getElementById('dv2').innerHTML = sayHi('MarPlo');
</script>

Proprietatea arguments

Proprietatea arguments retine intr-un obiect tip array argumentele (valorile) transmise la apelarea unei functii, in ordinea adaugarii lor (cu primul index 0).
Aceasta proprietate nu poate fi aplicata la 'arrow functions'.
Valoarea ei nu este un array, ci un obiect cu indexi numerici. Dar i-se poate aplcica length pentru aflarea numarului de elemente.

Sintaxa:
function numeF(){
 var args = numeF.arguments;

 //codul care va fi executat
}
- Variabila 'args' contine obiectul cu argumentele transmise la apelarea functiei numeF().
- Aici, primul argument poate fi preluat cu: args[0]

Aceasta proprietate este utila cand o functie se apeleaza cu un numar de argumente mai mare decat sunt la definirea ei.
- Exemplu, o functie cu un parametru. Daca e apelata fara argument, seteaza valoarea 0; daca e un singur argument, il dubleaza; daca sunt mai multe le aduna.
<div id='dv1'>Div-ul #dv1</div>
<div id='dv2'>Div-ul #dv2</div>
<div id='dv3'>Div-ul #dv3</div>

<script>
const f1 = function(x){
 //retine obiectul-ul cu argumentele transmise la apelare f1()
 var args = f1.arguments;

 //daca nu e nici un argument, seteaza valoarea 0 pt. 're'
 //daca e un singur argument, il dubleaza
 //daca sunt mai multe, le aduna
 if(args.length ==0) var re =0;
 else if(args.length ==1) var re = args[0]*2;
 else if(args.length >1){
 var re =0;
 for(var i=0; i<args.length; i++) re += args[i];
 }

 return re;
}

//adauga in elemente HTML rezultatul apelarii lui f1() de trei ori, cu nr. diferit de argumente
document.getElementById('dv1').innerHTML ='f1() fara argument returneaza: '+ f1();
document.getElementById('dv2').innerHTML ='f1(3) returneaza: '+ f1(3);
document.getElementById('dv3').innerHTML ='f1(2, 5, 3) returneaza: '+ f1(2, 5, 3);
</script>

Functia callback

Functia callback e o functie transmisa ca argument la alta functie, unde va fi apelata cu numele parametrului la care e asociata, si argumentele necesare.
- Se poate intelege mai bine din urmatorul exemplu:
<div id='dv1'>Callback function.</div>

<script>
//functia callback, adauga 'Salut name' in #dv1
const fcb = (name)=>{
 document.getElementById('dv1').innerHTML ='Salut '+ name;
}

//functia la care va fi transmisa si utilizata functia callback
function f1(id, callback){
 if(id >1) callback('MarPlo.net');
}

//apeleaza f1() cu un Id si functia callback fcb()
f1(8, fcb);
</script>
Adesea se folosesc functiile anonime ca functii callback. Functiile anonime sunt cele care se definesc direct ca argument la apelarea altei functii.
- Iata exemplu anterior, aici cu functie callback anonima.
<div id='dv1'>Anonimous callback function.</div>

<script>
//functia la care va fi transmisa si utilizata functia callback
function f1(id, callback){
 if(id >1) callback('GamV.eu');
}

//apeleaza f1() cu un Id si functie callback anonima
f1(8, (name)=>{
 document.getElementById('dv1').innerHTML ='Salut '+ name;
});
</script>

Functii recursive

O functie JavaScript poate fi recursiva, adica se poate autoapela.
- Exemplu, o functie JavaScript recursiva care afla factorialul unui numar precizat "n".

<div id='dv1'>Exemplu functie recursiva</div>

<script>
//returneaza factorial de n
function factorial(n){
 var re;

 if(n >0) re = n*factorial(n-1); //auto-apelare
 else if(n ==0) re =1;

 return re;
}

//afisaza in #dv1 factorial de 8
document.getElementById('dv1').innerHTML ='Factorial de 8 este: '+ factorial(8);
</script>
Functia factorial() verifica intai daca "n" este mai mare decat 0, apoi in caz afirmativ, "n" se inmulteste cu rezultatul returnat de auto-apelarea ei cu argumentul "n-1". Cand "n" ajunge 0 se incheie repetarea auto-apelarii si returneaza valoare lui 're'.
JavaScript incheie toate auto-apelarile in corpul functiei si retine de la o auto-apelare la urmatoarea ultimul rezultat returnat pana ce ajunge la apelarea initiala a functiei, apoi intoarce rezultatul final.

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Ce tag HTML5 este indicat sa contina meniul cu link-uri de navigare in site?
<section> <nav> <article>
<nav><ul>
 <li><a href="http://coursesweb.net/css/" title="CSS Course">CSS Course</a></li>
 <li><a href="http://www.marplo.net/jocuri/" title="Flash Games">Flash Games</a></li>
</ul></nav>
Ce proprietate CSS muta elementrul in dreapta sau stanga de la locul unde e?
text-align clear float
.some_class {
  width: 30%;
  float: left;
}
Clic pe metoda obiectului Math care rotunjeste numarul x descrescator la cel mai apropiat intreg.
Math.ceil(x) Math.abs(x) Math.floor(x)
var num = 12.34567;
num = Math.floor(num);
alert(num);       // 12
Indicati functia PHP care returneaza numarul de caractere dintr-un sir.
mb_strlen() count() stristr()
$str = "sir cu caractere utf-8 åèö";
$nrchr = mb_strlen($str);
echo $nrchr;        // 29
Clic pe raspunsul potrivit la intrebarea: "When it happened?".
On the 7th of July 1996 It is a quarter to 5. Nice weather.
When it happened? On the 8th of August 2001.
- Cand s-a intamplat? Pe 8 August 2001.
Indicati raspunsul potrivit la intrebarea: "¿Cuando sucedió?".
Hace buen tiempo. En el 8 de Agosto de 2001 Son las tres menos cuarto.
¿Cuando sucedió? En el 8 de Agosto de 2001.
- Cand s-a intamplat? Pe 8 August 2001.
Utilizare Functii si Parametri lor

Last accessed pages

  1. Numerale, Numere in limba engleza - Numerals (39302)
  2. Verbe modale - SHALL, SHOULD, OUGHT TO, WILL, WOULD, USED TO, BE TO, DARE (25368)
  3. Instructiuni conditionale if, else, switch (14124)
  4. Blog si Cugetari Personale (77535)
  5. Proverbe, expresii si zicatori (14837)

Popular pages this month

  1. Prezentul simplu si continuu - Present Tense Simple and Continuous (2873)
  2. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (2798)
  3. Curs HTML gratuit Tutoriale HTML5 (2410)
  4. Curs CSS Online Tutoriale CSS3 (1927)
  5. Curs si Tutoriale JavaScript (1917)