Dev.to WebDev 🛠 Dev 👁 0

Syntax Comparison of ES5 vs ES6

Basically, I was revising JavaScript fundamentals. While doing that, I had a curious thought that led me to write content on it. And this is a common topic roaming all over the internet. ## Demo Data const users = [ {

Basically, I was revising JavaScript fundamentals. While doing that, I had a curious thought that led me to write content on it. And this is a common topic roaming all over the internet.

## Demo Data
const users = [
{ id: 1, name: "Rafi", age: 22, role: "intern" },
{ id: 2, name: "Nila", age: 17, role: "student" },
{ id: 3, name: "Sami", age: 28, role: "developer" },
{ id: 4, name: "Tina", age: 31, role: "developer" },
];

## ES6 functional expression using template literals

// Option A: Print each user using .forEach()
users.forEach(u => console.log(`${u.name} (${u.age})`));

// Option B: Create a new array of strings using .map()
const names = users.map(u => `${u.name} (${u.age})`);
console.log(names);

## ES5 functional expression

// Option A: Print each user using .forEach()
users.forEach(function(u) {
  console.log(u.name + " (" + u.age + ")");
});

// Option B: Create a new array of strings using .map()
var names = users.map(function(u) {
  return u.name + " (" + u.age + ")";
});
console.log(names);

This Code could be a responsible way to set a vision of understanding ES5 & ES6.

📰 Read the original article on Dev.to WebDev

Originally published by Dev.to WebDev. Aggregated on AIWithGhost for educational purposes — full credit and traffic to the original publisher.