Arrow Functions
Template Literals
Destructuring Assignment
Default Parameters
Rest and Spread Operators
Classes
Modules
Promises
Async/Await
Symbols
Map and Set
WeakMap and WeakSet
Enhanced Object Literals


JavaScript ES6+ introduces a range of powerful features that streamline development and enhance code quality. Key updates include arrow functions for more concise syntax, template literals for easier string manipulation, and destructuring assignment for cleaner data extraction. Default parameters simplify function usage, while rest and spread operators make handling variable arguments and expanding arrays more intuitive. Classes provide a modern approach to object-oriented programming, and modules enable better code organization. Promises and async/await improve asynchronous code readability, and collections like Map, Set, WeakMap, and WeakSet offer more versatile data structures. Enhanced object literals further simplify property and method definitions, making modern JavaScript more efficient and expressive.


1) Arrow Functions

Arrow functions provide a more concise syntax for writing functions. They also lexically bind the this value, which can be particularly useful in callback functions.

Example:

// Traditional function
var add = function(a, b) {
return a + b;
};

// Arrow function
const add = (a, b) => a + b;


2) Template Literals
Template literals allow you to embed expressions within string literals and support multi-line strings, which simplifies the process of creating complex strings.

Example:

const name = 'World';
console.log(`Hello, ${name}!`); // Outputs: Hello, World!


3) Destructuring Assignment

Destructuring allows you to unpack values from arrays or properties from objects into distinct variables. This feature can significantly reduce the amount of code needed to extract data.

Example:

// Array destructuring
const [a, b] = [1, 2];

// Object destructuring
const { x, y } = { x: 1, y: 2 };


4) Default Parameters

Default parameters let you define default values for function parameters, making your functions more flexible and easier to use.

Example:

function greet(name = 'Guest') {
return `Hello, ${name}!`;
}


5) Rest and Spread Operators
The rest operator (...) allows you to handle variable numbers of arguments, while the spread operator helps in expanding arrays or objects into individual elements.

Example:

// Rest
function sum(...numbers) {
return numbers.reduce((acc, num) => acc + num, 0);
}

// Spread
const arr1 = [1, 2, 3];
const arr2 = [...arr1, 4, 5];


6) Classes
JavaScript classes provide a more familiar syntax for creating objects and handling inheritance, similar to other object-oriented programming languages.

Example:

class Person {
constructor(name) {
this.name = name;
}

greet() {
return `Hello, my name is ${this.name}.`;
}
}

const person = new Person('Alice');


7) Modules
JavaScript modules allow you to split your code into reusable pieces and manage dependencies efficiently using import and export.

Example:

// module.js
export const pi = 3.14;

// main.js
import { pi } from './module.js';

8) Promises
Promises provide a cleaner and more manageable way to handle asynchronous operations compared to traditional callback functions.

Example:

const fetchData = () => new Promise((resolve, reject) => {
setTimeout(() => resolve('Data fetched'), 1000);
});

fetchData().then(data => console.log(data));


9) Async/Await
Async/await is syntactic sugar over promises that allows you to write asynchronous code in a more synchronous fashion, enhancing readability and maintainability.

Example:

const fetchData = async () => {
const response = await fetch('https://api.example.com/data');
const data = await response.json();
return data;
};

fetchData().then(data => console.log(data));


10) Symbols
Symbols are unique and immutable data types used primarily as object property keys, ensuring that properties are not accidentally overwritten or accessed.

Example:

const sym = Symbol('description');
const obj = {
[sym]: 'value'
};


11) Map and Set
The Map and Set collections provide more versatile data structures compared to traditional objects and arrays. Maps store key-value pairs, while Sets store unique values.

Example:

// Map
const map = new Map();
map.set('key', 'value');
console.log(map.get('key'));

// Set
const set = new Set([1, 2, 2, 3]);
console.log(set.size); // Outputs: 3


12) WeakMap and WeakSet
WeakMap and WeakSet are similar to Map and Set but with weakly held keys, allowing for better memory management and garbage collection.

Example:

const weakMap = new WeakMap();
const obj = {};
weakMap.set(obj, 'value');


13)Enhanced Object Literals
Enhanced object literals provide a more concise syntax for defining object properties and methods, making object creation more straightforward.

Example:

const name = 'John';
const person = {
name,
greet() {
return `Hello, ${this.name}`;
}
};