Metode ale obiectului Array in JS

Curs Javascript

• Metode cu functie callback

Lista cu metode JavaScript utile ale obiectului Array pentru lucru cu array-uri in scripturi JS.
- Aici, 'arr' reprezinta array-ul la care se aplica metoda.

• Array.isArray(arr) - returneaza True daca argumentul 'arr' e un array, in caz contrar False.

  let arr =['ab', 'cd', 90];
  
  //daca arr e array, afiseaza primul element
  if(Array.isArray(arr)) document.write('<p>Primul elm.: '+arr[0]+'</p>');
  

• arr.concat() - uneste unul sau mai multe array-uri la cel aplicat si returneaza array-ul rezultat; fara sa modifice pe cel la care e aplicata.

  let arr =['ab', 'cd'];
  let arr2 =[34, 'xy'];
  let arr3 = arr.concat(arr2);
  
  console.log(arr3); //['ab', 'cd', 34, 'xy']
  console.log(arr); //['ab', 'cd']
  

• arr.fill(val, start, end) - Inlocuieste cu 'val' valoarea tuturor elementelor de la index 'start' pana la pozitia 'end' (indexul end nu e inclus). Daca 'end' nu e adaugat, inlocuieste pana la ultimul element (inclusiv).

  let arr =['ab', 'cd', 90, 123];
  
  //inlocuieste cu 'xy' valorile de la index 1 pana la al treilea
  let arr2 = arr.fill('xy', 1, 3);
  console.log(arr2); //['ab', 'xy', 'xy', 123]
  

• arr.includes(val) - returneaza True daca array-ul contine valoarea 'val', in caz contrar, False.

  let arr =['ab', 'cd', 90];
  if(arr.includes('cd')) document.write('<p>arr contine valoarea: cd</p>');
  

• arr.indexOf(val) - returneaza primul index la care valoarea 'val e gasita'. Daca 'val' nu e in array, returneaza -1.

  let arr =['ab', 'cd', 90];
  var ixv = arr.indexOf('cd');
  if(ixv !=-1) document.write('<p>arr contine valoarea: cd, cu indexul: '+ixv+'</p>');
  

• arr.join(separator) - returneaza un sir cu elementele array-ului, separate prin 'separator'.

  let arr =['ab', 'cd', 90];
  document.write('<p>arr contine: '+arr.join('-')+'</p>');
  

• arr.pop() - sterge ultimul element din array si returneaza acel element.

  let arr =['ab', 'cd', 90];
  var del_last = arr.pop();
  
  console.log('Element sters: '+ del_last);
  console.log(arr); //['ab', 'cd']
  

• arr.push() - adauga unul sau mai multe elemente la sfarsitul unui array, si returneaza noua lungime a array-ului.

  let arr =['ab', 'cd'];
  var nra = arr.push('xy', 89);
  
  console.log(nra); //4
  console.log(arr); //['ab', 'cd', 'xy', 89];
  

• arr.reverse() - inverseaza ordinea elementelor din array.

  let arr =['ab', 'cd', 90];
  arr.reverse();
  
  console.log(arr); //[90, 'cd', 'ab']
  

• arr.shift() - sterge primul element din array si returneaza elementul sters.

  let arr =['ab', 'cd', 90];
  var del_e = arr.shift();
  
  console.log(del_e); //ab
  console.log(arr); //['cd', 90]
  

• arr.slice(i_start, end) - returneaza o portiune din array de la indexul 'i_start' pana la indexul 'end' (ne inclus). Daca end nu e specificat, se considera pana la sfarsit.

  let arr =['ab', 'cd', 90, 'xy', 78];
  let arr2 = arr.slice(1, 3);
  
  console.log(arr2); //['cd', 90]
  

• arr.sort() - sorteaza un array in ordine alfabetica.

  let arr =['ef', 'a8', 9, 78];
  arr.sort();
  
  console.log(arr); //[78, 9, 'a8', 'ef']
  

• arr.splice(start, nrDelete, [e1, e2,..]) - schimba elementele unui array incepand de la pozitia 'start'.
  - 'nrDelete' reprezinta numarul de elemente sterse dupa pozitia start.
  - 'e1, e2' (optional) elementele adaugate incepand cu indexul 'start'.
  Returneaza un array cu elementele sterse.

  let arr =['ab', 'cd', 90, 'xy'];
  
  //sterge un element dupa indexul 2 (al treilea), adauga inca doua incepand cu index 2
  var del_e = arr.splice(2, 1, 'ad1', 'ad2');
  
  console.log(del_e); //[90]
  console.log(arr); //['ab', 'cd', 'ad1', 'ad2', 'xy']
  

• arr.toString() - returneaza un string (sir) cu elementele array-ului.

  let arr =['ab', 'cd', 90];
  document.write('<p>arr contine: '+arr.toString()+'</p>');
  

• arr.unshift() - adauga unul sau mai multe elemente la inceputul unui array. Returneaza lungimea noului array.

  let arr =['ab', 90];
  var nra = arr.unshift('ad1', 'ad2');
  
  console.log(nra); //4
  console.log(arr); //['ad1', 'ad2', 'ab', 90]
  

Metode cu functie callback

Metode pentru array care folosesc o functie callback.
Functia 'callback' de la aceste metode se executa automat pentru fiecare element din array-ul la care e aplicata metoda.

In afara de metoda reduce(), pentru toate celelalte cazuri functia 'callback' are aceasta sintaxa:

var callbackF =(va, index, array)=>{
 //codul functiei
}

- 'val' e valoarea elementului curent.
- 'index' (optional) este indexul lui
- 'array' (optional) e array-ul parcurs.

• arr.filter(callback) - creaza un array cu elementele pentru care functia 'callback' returneaza True.

  let arr =[1, 2, 5, 8, 28];
  
  //preia elementele pare
  let arr2 = arr.filter((v, i)=>{ return (v%2)==0; });
  
  console.log(arr2); //[2, 8, 28]
  

• arr.find(callback) - returneaza primul element din array pentru care functia 'callback' returneaza True; sau undefined daca nu e gasit niciunu.

  let arr =[1, 'ab', 2, 5, 8];
  
  //preia primul numar par din arr
  let e_par = arr.find((v, i)=>{ return (v%2)==0; });
  
  if(e_par) document.write('<p>Primul numar par din arr e: '+e_par+'</p>');
  

• arr.findIndex(callback) - returneaza indexul primului element din array pentru care functia 'callback' returneaza True; sau -1 daca nu e gasit niciunu.

  let arr =[1, 'ab', 4, 5, 8];
  
  //indexul primul numar par din arr
  let i_par = arr.findIndex((v, i)=>{ return (v%2)==0; });
  
  if(i_par) document.write('<p>Primul numar par din arr e: '+arr[i_par]+', cu index: '+i_par+'</p>');
  

• arr.forEach(callback) - parcurge array-ul si executa functia 'callback' pt. fiecare element.

  let arr =['HTML', 'CSS', 'JavaScript'];
  
  //parcurge arr si afiseaza fiecare element
  arr.forEach((v, i)=>{
   document.write('<br>'+i+' - '+v);
  });
  

• arr.map(callback) - creaza un array cu rezultatul returnat de functia 'callback' pt. fiecare element.

  var arr = [1, 4, 9, 16];
  
  //creaza un array cu valorile dublate din arr
  const arr2 = arr.map((v, i)=>v*2);
  
  console.log(arr2); //[2, 8, 18, 32]
  

• arr.reduce(clbRedu) - reduce elementele din array la o singura valoare, aplicand codul din functia 'clbRedu' la elementele array-ului de la primul pana la ultimul.
  - 'clbRedu' e o functie callback cu 4 argumente:
  clbRedu(acumulator, currentValue, index, array)
  - acumulator - acumuleaza valorile returnate de functie. Valoarea initiala e primul element din array, sau currentValue (daca e transmisa).
  - currentValue (optional) daca e transmisa la apelare, va da acea valoare la 'acumulator' si parametru 'currentValue' va reprezenta primul element. Daca nu e transmisa, parametru va reprezenta al doile element din array.
  - index (optional) este indexul elementului parcurs.
  - array (optional) e array-ul la care se aplica functia.

  const arr =[1, 2, 3, 4];
  
  //suma elementelor din arr
  const ar_sum = arr.reduce((a, b)=>a+b);
  
  //produsul elementelor din arr
  const ar_prd = arr.reduce((a, b)=>a*b);
  
  document.write('<p>Suma numerelor din [1, 2, 3, 4] e: '+ar_sum+', Produsul: '+ar_prd+'</p>');
  

- O lista cu metodele obiectului Array gasiti la MDN: Array JavaScript.

<p>Cursuri, Jocuri, Anime: <em>www.MarPlo.net</em></p>

h3 {
  padding: 2px 0.2em;
}

// preia primul Div cu class="cls", si afiseaza continutul
var elm = document.querySelector("div.cls");
alert(elm.innerHTML);

if(isset($_POST["field"])) {
  echo $_POST["field"];
}

We speak english.
- Noi vorbim engleza.

Nosotros hablamos español.
- Noi vorbim spaniola.