Curs Web Development
Curs HTML
Curs CSS
Curs Javascript
Curs PHP
Curs Phyton
Curs SQL
Curs SEO

ES6 și mai departe - JavaScript Modern

Ce este ES6+

ES6 (ECMAScript 2015) este o versiune modernă a limbajului JavaScript care a adus îmbunătățiri importante: sintaxă mai clară, funcții mai puternice și o organizare mai bună a codului. ES6+ înseamnă ES6 și toate versiunile ulterioare (ES7, ES8, ES9 etc.).

let, const și blocuri de cod

let și const sunt folosite pentru a declara variabile. Spre deosebire de var, ele respectă „block scope” — adică sunt vizibile doar în blocul în care sunt definite.


{
  let x = 10;
  const y = 20;
  var z = 30;
}
console.log(z); // ✅ funcționează
console.log(x); // ❌ eroare: x nu e definit

Funcții săgeată (Arrow Functions)

O formă mai scurtă de a scrie funcții. Nu au propriul this, ceea ce le face utile în funcții simple.


const salut = (nume) => `Salut, ${nume}!`;
console.log(salut("Ioan")); // Salut, Ioan!

Parametri cu valoare implicită

Poți seta o valoare implicită pentru parametrii unei funcții, în caz că nu sunt furnizați.


function salut(nume = "Anonim") {
  return `Salut, ${nume}!`;
}
console.log(salut()); // Salut, Anonim!

Operatorii rest și spread

Rest adună mai multe argumente într-un array. Spread „împrăștie” elementele unui array sau obiect.


// Rest
function suma(...numere) {
  return numere.reduce((a, b) => a + b);
}
console.log(suma(1, 2, 3)); // 6

// Spread
const arr1 = [1, 2];
const arr2 = [...arr1, 3, 4];
console.log(arr2); // [1, 2, 3, 4]

Destructurarea array-urilor și obiectelor

Poți extrage valori direct din array-uri sau obiecte în variabile.


// Array
const [a, b] = [10, 20];
console.log(a); // 10

// Obiect
const persoana = { nume: "Ioan", varsta: 30 };
const { nume, varsta } = persoana;
console.log(nume); // Ioan

Literali de obiect îmbunătățiți

Poți scrie obiecte mai simplu, fără să repeți numele proprietăților.


const nume = "Ioan";
const user = {
  nume,
  salut() {
    return `Salut, ${this.nume}!`;
  }
};
console.log(user.salut()); // Salut, Ioan!

Module și importuri

JavaScript modern permite împărțirea codului în fișiere separate. Poți exporta și importa funcții sau variabile.


// salut.js
export function salut(nume) {
  return `Salut, ${nume}!`;
}

// main.js
import { salut } from './salut.js';
console.log(salut("Ioan"));

Optional chaining și nullish coalescing

Optional chaining te ajută să accesezi proprietăți fără să generezi erori dacă ele nu există. Nullish coalescing oferă o valoare alternativă doar dacă cea principală e null sau undefined.


const user = { profil: { nume: "Ioan" } };
console.log(user?.profil?.nume); // Ioan

const valoare = null;
console.log(valoare ?? "Fallback"); // Fallback
Top