10 Modern JavaScript ES6 Features You Should Know
10 Modern JavaScript ES6 Features You Should Know
Arrow Functions: Concise syntax for writing functions.
// ES5
function add(a, b) {
return a + b;
}
// ES6
const add = (a, b) => a + b;
Let and Const: Block-scoped variables (let) and constants (const).
// ES5
var name = "John";
// ES6
const name = "John";
Template Literals: String interpolation and multi-line strings.
// ES5
var greeting = "Hello, " + name + "!";
// ES6
const greeting = `Hello, ${name}!`;
De-structuring Assignment: Extracting values from arrays or objects into variables.
// ES5
var person = { name: "John", age: 30 };
var name = person.name;
var age = person.age;
// ES6
const { name, age } = person;
Spread and Rest Operators: Spreading elements of an iterable (arrays, strings) or object properties.
// ES6 Spread Operator
const numbers = [1, 2, 3];
const combined = [...numbers, 4, 5];
// ES6 Rest Operator
const [first, ...rest] = numbers;
Default Parameters: Default values for function parameters.
// ES5
function multiply(a, b) {
b = b || 1;
return a * b;
}
// ES6
const multiply = (a, b = 1) => a * b;
Top 10 JavaScript Interview Problems and Solutions You Must Prepare – Part 1
Classes: Simplified syntax for defining objects and constructor functions.
// ES5
function Person(name) {
this.name = name;
}
Person.prototype.greet = function() {
return `Hello, ${this.name}!`;
};
// ES6
class Person {
constructor(name) {
this.name = name;
}
greet() {
return `Hello, ${this.name}!`;
}
}
Modules: Encapsulating code and dependencies using import and export.
// ES6 Export
export const PI = 3.14;
// ES6 Import
import { PI } from './math';
Promises and Async/Await: Handling asynchronous operations and improving readability.
// ES6 Promises
fetch(url)
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error));
// ES6 Async/Await
async function fetchData(url) {
try {
const response = await fetch(url);
const data = await response.json();
console.log(data);
} catch (error) {
console.error(error);
}
}
Enhanced Object Literals: Adding computed property names and shorthand syntax.
const name = "John";
const age = 30;
// ES6 Enhanced Object Literal
const person = {
name,
age,
greet() {
return `Hello, ${this.name}!`;
}
};
10 JavaScript Problems in Job Interviews – Coding in Telugu
Top 10 JavaScript Coding Problems Asked in an Interview with Solutions – 2024
Top 50 JavaScript Coding Challenges for Beginners
10 Modern JavaScript ES6 Features You Should Know
