Skip to main content

Arrow Function: Hal yang harus kamu tahu!

· Baca dalam 3 menit
Irul
forward

Arrow function, atau yang juga dikenal sebagai "fat arrow" function, adalah notasi pendek untuk menulis fungsi anonim di JavaScript. Mereka dianggap sebagai cara yang lebih ringkas dan ekspresif untuk menulis ekspresi fungsi, dan sering digunakan dalam situasi di mana sebuah fungsi diberikan sebagai argumen ke fungsi lain, seperti dalam metode array seperti map dan filter.

Contoh implementasi​

Berikut ini adalah contoh arrow function:

const myFunction = (a, b) => a + b;
console.log(myFunction(1, 2)); // Output: 3

Dalam contoh ini, myFunction adalah arrow function yang mengambil dua argumen, a dan b, dan mengembalikan jumlah dari argumen tersebut.

Arrow function juga memiliki sintaks shorthand untuk saat hanya memiliki satu argumen dan tubuh satu baris:

const myFunction = a => a * 2;
console.log(myFunction(3)); // Output: 6

Hal penting tentang arrow function​

  1. Sintaks yang lebih ringkas: Arrow function memiliki sintaks yang lebih singkat dibandingkan dengan fungsi biasa, yang dapat membuat kode kita lebih mudah dibaca dan dipahami.
  2. Tanpa keyword this: Arrow function tidak memiliki keyword this sendiri, sehingga mereka akan mewarisi this dari lingkungan scope parent mereka. Ini dapat membuat kode kita lebih mudah diprediksi dan diantisipasi.
  3. Tanpa keyword arguments: Arrow function juga tidak memiliki keyword arguments, sehingga kita harus menggunakan parameter fungsi yang ditentukan secara eksplisit.
  4. Tanpa new: Arrow function tidak dapat digunakan dengan operator new, sehingga mereka tidak dapat digunakan sebagai constructor.
  5. Tidak dapat digunakan sebagai generator: Arrow function juga tidak dapat digunakan sebagai generator.

Penggunaan tanda kurung pada arrow function​

Dalam arrow function, kita dapat menulis kode tanpa tanda kurung dan kurung kurawal jika hanya ada satu argumen atau satu baris kode dalam tubuh fungsi.

Contoh:

const double = num => num * 2;
console.log(double(5)); // Output: 10

Di atas adalah sintaks shorthand yang sangat berguna ketika kita hanya ingin mengeksekusi satu perintah saat fungsi dipanggil.

Jika kita memiliki lebih dari satu argumen atau lebih dari satu baris kode dalam tubuh fungsi, kita harus menggunakan tanda kurung untuk argumen dan kurung kurawal untuk tubuh fungsi.

Contoh:

const add = (num1, num2) => {
  const result = num1 + num2;
  return result;
};
console.log(add(2, 3)); // Output: 5

Ini juga berlaku jika kita menggunakan arrow function sebagai async function, harus menggunakan tanda kurung dan kurung kurawal.

const myAsyncFunction = async () => {
  // kode disini
};

Penggunaan kurung biasa dan kurung kurawal pada tubuh arrow function juga berfungsi untuk mengatasi cara arrow function mengembalikan nilai

const arrowFunction = () => {
  return "Hello"
};

Kode di atas menggunakan kurung kurawal untuk mengembalikan nilai "Hello" ketika arrowFunction dipanggil, kita juga dapat menuliskannya seperti berikut:

const arrowFunction = () => ("Hello");

Kode di atas akan menampilkan hasil yang sama, perbedaannya adalah penggunaan dari kurung biasa dan kurung kurawal saja.

Semoga Bermanfaat!

← Baca tulisan lain