JavaScript ES6 (ECMAScript 2015) Features

1) let & const (Block Scope)

let is re-assignable, const is not. Both are block-scoped (between {}).

let count = 1;
count = 2; // ok

const pi = 3.14;
// pi = 3.15; // ❌ TypeError (cannot reassign)

if (true) {
  let x = 10;
}
// x is not accessible here

2) Template Literals

Use backticks (`) for interpolation and multiline strings.

const name = 'Sonu';
const msg = `Hello, ${name}!`;
console.log(msg);

const multi = `line 1
line 2`;

3) Destructuring (Arrays & Objects)

Pull values out into variables quickly.

// array destructuring
const [a, b] = [10, 20];

// object destructuring
const { title, price } = { title: 'Book', price: 99 };

4) Default Parameters

Provide fallback values when no argument is passed.

function hello(user = 'Guest') {
  return `Hello ${user}`;
}
console.log(hello());        // Hello Guest
console.log(hello('Sonu')); // Hello Sonu

5) Rest & Spread (...)

Rest collects items into an array; spread expands them out.

// rest (collect)
function sum(...nums) {
  return nums.reduce((a,b) => a+b, 0);
}

// spread (expand)
const arr = [1,2,3];
const arr2 = [...arr, 4, 5]; // [1,2,3,4,5]

6) Arrow Functions

Short syntax for functions. They don’t have their own this (lexical this).

const double = (n) => n*2;
console.log(double(7)); // 14

// lexical this
const obj = {
  val: 10,
  incLater() {
    setTimeout(() => {
      this.val++;
      console.log(this.val);
    }, 500);
  }
};
obj.incLater();

7) Classes

Syntactic sugar over prototypes: constructor and methods.

class Person {
  constructor(name) { this.name = name; }
  greet() { return `Hi, I'm ${this.name}`; }
}
const p = new Person('Sonu');
console.log(p.greet());

8) Modules (export / import)

Split code into files. Use type="module" in your script tag.

// math.js
export const add = (a,b) => a+b;
export default (x) => x*2;

// main.js
import double, { add } from './math.js';
console.log(add(2,3), double(4));

9) Map & Set

Map stores key–value pairs (any type as key). Set stores unique values.

const m = new Map();
m.set('a', 1);
console.log(m.get('a')); // 1

const s = new Set([1,2,2]);
s.add(3);
console.log([...s]); // [1,2,3]

10) Promises & Async–Await (Preview)

Promises represent async results. async/await makes async code look synchronous.

const p = new Promise((res) => {
  setTimeout(() => res('done'), 500);
});

async function run() {
  const v = await p;
  console.log(v); // done
}
run();

Go deeper on the next page: Promises & Async/Await.