Exemple de fișe JavaScript din aplicația noastră

Descarcă aplicația noastră din App Store sau Google Play pentru a obține mai multe flashcarduri gratuite sau abonează-te pentru acces la toate flashcardurile.

Ce este scopul lexical în JavaScript?

Scope lexical în JavaScript este un princip al cărui raza de vizibilitate a unei variabile este determinată de locația acesteia în cod. Acest lucru înseamnă că variabilele sunt accesibile în interiorul blocului în care au fost definite, precum și în orice blocuri imbricate. Acest lucru permite crearea de închideri (closures) și controlul asupra accesului la variabile. Exemplu de utilizare a scope-ului lexical în codul JavaScript:

function outerFunction() {
  let outerVariable = `I'm outside!`;

  function innerFunction() {
    console.log(outerVariable); // Has access to the 'outerVariable'
  }

  innerFunction();
}
outerFunction(); // Displays `I'm outside!`

Scope-ul lexical permite unei funcții interne să acceseze variabile definite într-o funcție externă, chiar și după ce funcția externă s-a încheiat. Acesta este un element cheie în crearea de închideri (closures) în JavaScript, permițând o gestionare mai flexibilă a stării în aplicații.

Ce este hoisting?

Hoisting este un mecanism în limbajele JavaScript în care variabilele și funcțiile sunt mutate în partea de sus a domeniului lor înainte ca codul să fie executat. În practică, asta înseamnă că putem utiliza funcții sau variabile înainte ca acestea să fie declarate.

Cu toate acestea, trebuie remarcat că hoisting funcționează ușor diferit pentru variabile și funcții.

Pentru variabilele declarate cu cuvântul-cheie var, doar declarația este hoisted, nu și inițializarea. Variabilele inițializate înainte de declarație vor fi returnate ca fiind undefined.

Un exemplu de cod hoisting pentru variabile:

console.log(myVar); // undefined
var myVar = 5;
console.log(myVar); // 5

Pentru funcții, hoisting mută atât declarația, cât și definiția funcției în partea de sus, ceea ce permite utilizarea funcției înainte de a fi declarată.

Un exemplu de cod hoisting pentru funcții:

console.log(myFunction()); // "Hello World"

function myFunction() {
  return "Hello World";
}

Hoisting nu are loc pentru variabilele declarate cu let și const.

Ce este o funcție săgeată și care sunt avantajele acesteia?

O funcție săgeată, cunoscută și sub numele de funcție săgeată, este un tip de funcție introdus în ECMAScript 6 (ES6). Ele sunt numite funcții săgeată pentru că folosesc o sintaxă specială cu o săgeată ( => ) pentru a defini funcția.

Pentru comparație, o funcție tradițională ar putea arăta așa:

function sum(a, b) {
  return a + b;
}

Echivalentul său ca funcție săgeată este:

const sum = (a, b) => a + b;

Principalul beneficiu al unei funcții săgeată este că nu creează propriul context de execuție (legarea la this), care este adesea o sursă de erori în JavaScript. În funcțiile săgeată, this este moștenit din contextul înconjurător. Un alt avantaj este concizia sintaxei, deosebit de utilă atunci când funcțiile sunt utilizate ca argumente pentru alte funcții, de exemplu în funcțiile de ordin superior.

Pe de altă parte, din cauza lipsei propriului this, funcțiile săgeată nu sunt potrivite pentru definirea obiectelor constructor (creative) sau pentru crearea de metode în obiecte prototip.

Ce este un obiect Promise și cum poate fi utilizat?

Obiectul Promise în JavaScript este folosit pentru a gestiona operațiunile asincrone. Un Promise reprezintă o valoare care poate să nu fie disponibilă în momentul creării Promise, dar poate deveni disponibilă în viitor, sau deloc.

Un obiect Promise poate fi într-una dintre cele trei stări:
1. În așteptare - operațiunea este încă în desfășurare, nu s-a terminat cu succes sau cu erori.
2. Îndeplinit - operațiunea s-a terminat cu succes, Promise a returnat o valoare.
3. Respins - operațiunea s-a încheiat cu o eroare, Promise a returnat motivul erorii.

Un Promise care a fost îndeplinit sau respins este considerat "stabilit" și starea lui nu se schimbă niciodată.

Crearea unui obiect Promise:

const promise = new Promise((resolve, reject) => {
  const success = true;
  if (success) {
    resolve('Operațiunea a reușit.');
  } else {
    reject('Operațiunea a eșuat.');
  }
});

Utilizarea unui obiect Promise:

promise
  .then(result => {
    console.log(result); // Va afișa: 'Operațiunea a reușit.'
  })
  .catch(error => {
    console.log(error);
  });

Metoda .then() este executată atunci când Promise este îndeplinit, iar .catch() atunci când este respins. În ambele cazuri, rezultatul operațiunii sau motivul respingerii Promise este dat ca argument.

Ce este un callback?

Un callback, cunoscut și sub numele de funcție callback, este o funcție care este trecută ca argument la o altă funcție și apoi este executată (apelată înapoi) după finalizarea acelei funcții. Funcțiile callback sunt folosite în mod obișnuit în JavaScript, în special în operațiuni asincrone, cum ar fi cererile AJAX sau gestionarea evenimentelor.

Funcțiile callback primesc de obicei rezultatele unei anumite operații ca argumente, astfel încât pot fi utilizate pentru procesarea sau analiza acestor rezultate.

Utilizarea unei astfel de funcții în practică poate arăta astfel:

function executeAfterTimeout(callback, timeout) {
  setTimeout(() => {
    console.log('Time passed!');
    callback();
  }, timeout);
}

executeAfterTimeout(() => {
  console.log('This is a callback!');
}, 2000);

În acest caz, funcția `executeAfterTimeout` primește o funcție `callback` ca parametru, care va fi executată după ce o anumită cantitate de timp a trecut. Funcțiile callback sunt extrem de utile pentru gestionarea fluxului de control asincron în JavaScript.

Ce este operatorul de coalescență nulă și cum funcționează?

Operatorul de coalescență nulă (??) este un operator logic care returnează partea dreaptă a operațiunii când partea stângă este nulă sau nedefinită. Cu alte cuvinte, atunci când o variabilă este goală, operatorul de coalescență nulă returnează valoarea definită ca rezultat.

Notația de bază este:

let value = null ?? 'valoare implicită';

În acest caz, deoarece partea stângă (valoare) este nulă, rezultatul este 'valoare implicită'. În plus, acest operator difere de operatorul OR (||), deoarece funcția OR returnează partea dreaptă când partea stângă este falsă (false, 0, '', null, undefined, NaN), în timp ce operatorul de coalescență nulă returnează doar partea dreaptă atunci când partea stângă este nulă sau nedefinită.

Exemplu cu OR:

let value1 = 0 || 'implicit';
console.log(value1); // rezultat: 'implicit' deoarece 0 este o valoare falsă

Exemplu cu coalescența nulă:

let value2 = 0 ?? 'implicit';
console.log(value2); // rezultat: 0 deoarece 0 nu este nul sau nedefinit

Deci, spre deosebire de OR, operatorul de coalescență nulă nu tratează 0, '' și NaN ca valori "goale".

Ce este Symbol și când ar trebui utilizat?

Un simbol în JavaScript este un tip de date unic și imutabil care este adesea utilizat pentru a identifica proprietățile unice ale obiectelor.

Puteți crea un Simbol apelând constructorul Symbol(), care creează un simbol unic de fiecare dată când este apelat. Chiar dacă apelăm constructorul Symbol() cu același argument, fiecare simbol creat va fi diferit.

const symbol1 = Symbol('mySymbol');
const symbol2 = Symbol('mySymbol');
console.log(symbol1 === symbol2); // returnează false

Simbolul este adesea utilizat pentru a defini proprietățile (unice) ale obiectelor, mai ales când dorim ca această proprietate să fie ascunsă sau privată. De asemenea, acoperă proprietățile care nu sunt luate în considerare atunci când parcurgem obiecte folosind for...in sau for...of și nu sunt returnate de metoda Object.keys(). În plus, simbolurile permit crearea de proprietăți "pseudo" private.

let obj = {};
let privateProperty = Symbol('private');

obj[privateProperty] = 'Acesta este privat';

console.log(obj[privateProperty]); // 'Acesta este privat'
console.log(Object.keys(obj)); // []

Nu există o regulă definită cu privire la când să folosiți Symbol. Acestea sunt tipic utilizate atunci când dorim să creăm o proprietate unică pe un obiect care nu poate fi ușor de văzut sau modificat, sau dorim să definim metode care afectează comportamentul obiectelor la un nivel scăzut.

Ce sunt WeakMap și WeakSet?

WeakMap și WeakSet sunt versiuni speciale ale obiectelor JavaScript Map și Set care nu împiedică eliberarea automată a memoriei de către Garbage Collector.

WeakMap este o colecție de perechi cheie-valoare unde cheile trebuie să fie obiecte și valorile pot fi orice. Diferența principală între Map și WeakMap este că cheile din WeakMap sunt deținute "slab", ceea ce înseamnă că dacă nu există alte referințe la obiectul cheie, acesta va fi colectat ca gunoi, iar intrarea sa în WeakMap va fi eliminată automat.

Iată un exemplu de utilizare a lui WeakMap:

let john = { name: "John" };

let weakMap = new WeakMap();
weakMap.set(john, "...");

john = null; // suprascriem referința

// john este eliminat din memorie!

WeakSet este similar cu ceea ce reprezintă WeakMap pentru Map. Este un set de obiecte, dar nu împiedică colectarea gunoiului dacă obiectul nu este vizibil în altă parte. Îi lipsește metodele Set tipice cum ar fi `size` și `clear`, iar metoda `add` acceptă numai obiecte.

Exemplu de utilizare a lui WeakSet:

let john = { name: "John" };

let weakSet = new WeakSet();
weakSet.add(john);

john = null; // suprascriem referința

// john este eliminat din memorie!

Ambele, WeakMap și WeakSet, sunt folosite în principal în situații în care dorim să stocăm informații suplimentare despre obiecte care ar trebui eliminate atunci când obiectul însuși este eliminat.

Fișe JavaScript