ES6 Features

ES6 Adalah versi terbaru dari javascript yang memiliki banyak fitur baru yang sangat membantu dalam pengembangan aplikasi web. ES6 juga dikenal sebagai ECMAScript 2015. ECMAScript adalah standar scripting untuk bahasa pemrograman yang digunakan oleh javascript dan bahasa pemrograman lainnya.

1. Arrow Function

Arrow function adalah fitur baru yang memungkinkan kita membuat fungsi dengan sintaks yang lebih singkat. Arrow function tidak memiliki konsep this, sehingga tidak perlu lagi menggunakan bind() atau self seperti pada penulisan fungsi pada javascript pada umumnya.

Arrow Function

// ES5
var multiplyES5 = function (x, y) {
  return x * y;
};
 
// ES6
const multiplyES6 = (x, y) => {
  return x * y;
};

Arrow Function Tanpa Kurung Kurawal

// ES5
var multiplyES5 = function (x, y) {
  return x * y;
};
 
// ES6
const multiplyES6 = (x, y) => x * y;

Arrow Function Tanpa Parameter

// ES5
var docLogES5 = function () {
  console.log(document);
};
 
// ES6
const docLogES6 = () => {
  console.log(document);
};

Arrow Function Dengan Parameter Satu

// ES5
var greetES5 = function (name) {
  console.log("Hello " + name);
};
 
// ES6
 
const greetES6 = (name) => console.log(`Hello ${name}`);

Arrow Function Dengan Parameter Lebih Dari Satu

// ES5
var greetES5 = function (greeting, name) {
  console.log(greeting + ", " + name);
};
 
// ES6
const greetES6 = (greeting, name) => console.log(`${greeting}, ${name}`);

Arrow Function Dengan Parameter Default

// ES5
 
var greetES5 = function (greeting, name) {
  greeting = typeof greeting !== "undefined" ? greeting : "Hello";
  name = typeof name !== "undefined" ? name : "Student";
  console.log(greeting + ", " + name);
};
 
// ES6
const greetES6 = (greeting = "Hello", name = "Student") => console.log(`${greeting}, ${name}`);

Arrow Function Dengan Return Object

// ES5
var returnObjES5 = function () {
  return {
    name: "John",
  };
};
 
// ES6
const returnObjES6 = () => ({ name: "John" });

Error Handling String