JavaScript - ECMAScript 2021: Panduan untuk Pemula

Halo sana, super bintang coding masa depan! Saya sangat senang menjadi panduanmu dalam perjalanan menarik ini ke dunia ECMAScript 2021. Sebagai guru ilmu komputer dengan tahun-tahun pengalaman, saya telah melihat banyak siswa berubah dari pemula sepenuhnya menjadi programmer yang Percaya diri. Hari ini, kita akan meng eksplorasi fitur terbaru JavaScript, dan saya berjanji akan membuatnya semudah dan menyenangkan untuk dipahami. Jadi, ambil minumannya yang favorit, betahlah, dan mari kita masuk ke dalam!

Apa Itu ECMAScript 2021?

Sebelum kita melompat ke fitur baru, mari kita cerita singkat tentang apa itu ECMAScript. Picturing ECMAScript sebagai buku resep untuk JavaScript. Setiap tahun, koki-koki (alias pengembang bahasa) menambahkan resep-resep baru (fitur) untuk membuat kehidupan coding kita lebih mudah dan nikmat. ECMAScript 2021, juga dikenal sebagai ES12, adalah edisi terbaru dari buku resep ini.

Fitur Baru Ditambahkan di ECMAScript 2021

ECMAScript 2021 membawa kepada kita beberapa alat baru yang menarik untuk main-main. Itu seperti mendapatkan set baru LEGO yang berkilau untuk menambah koleksi kita. Mari kita eksplor setiap fitur baru ini satu per satu.

Pemisah Numerik (_)

Apakah Anda pernah mencoba membaca angka yang sangat panjang, seperti 1000000000? Itu agak menyakitkan kepala, kan? Well, pemisah numerik disini untuk menyelamatkan hari!

// Tanpa pemisah numerik
const billion = 1000000000;

// Dengan pemisah numerik
const billionReadable = 1_000_000_000;

console.log(billion === billionReadable); // Output: true

Garis bawah (_) dalam 1_000_000_000 tidak mengubah nilai angka. Itu hanya ada untuk membuatnya lebih mudah bagi kita manusia untuk membaca. Itu menarik, kan? Itu seperti menambahkan spasi dalam kalimat panjang untuk membuatnya lebih mudah dibaca.

Metode Promise any()

Promise di JavaScript seperti membuat banyak panggilan telepon sekaligus dan menunggu seseorang menjawab. Metode Promise.any() adalah cara baru untuk menangani banyak promise.

const promise1 = new Promise((resolve, reject) => setTimeout(reject, 100, 'promise1'));
const promise2 = new Promise((resolve, reject) => setTimeout(resolve, 200, 'promise2'));
const promise3 = new Promise((resolve, reject) => setTimeout(resolve, 300, 'promise3'));

Promise.any([promise1, promise2, promise3])
.then((value) => console.log(value))
.catch((error) => console.log(error));

// Output: promise2

Dalam contoh ini, Promise.any() ter-resolve segera setelah salah satu promise dalam array terpenuhi. Itu seperti sebuah lomba di mana kita hanya peduli dengan orang pertama yang melintasi garis finish, tanpa peduli siapa yang datang di urutan kedua atau ketiga.

Metode String replaceAll()

Apakah Anda pernah bermain permainan penggantian kata? Metode replaceAll() seperti itu, tapi untuk string di JavaScript.

const sentence = "I love cats. Cats are great pets.";
const newSentence = sentence.replaceAll("cats", "dogs");

console.log(newSentence); // Output: "I love dogs. Dogs are great pets."

Sebelum replaceAll(), kita harus menggunakan ekspresi regular atau loop untuk mengganti semua kemunculan substring. Sekarang, itu hanya sebentar seperti memanggil method tunggal!

Operator Penugasan Logika

ECMAScript 2021 memperkenalkan tiga operator penugasan logika baru. Ini seperti penulisan singkat untuk pola umum di JavaScript. Mari kita lihat masing-masing:

Operator Penugasan Logika AND (&&=)

let x = 1;
let y = 2;

x &&= y;

console.log(x); // Output: 2

// Ini setara dengan:
// x && (x = y);

Operator &&= menugaskan nilai kanan hanya jika nilai kiri benar. Itu seperti mengatakan, "Jika x benar, maka buatnya sama dengan y."

Operator Penugasan Logika OR (||=)

let a = null;
let b = 'default value';

a ||= b;

console.log(a); // Output: "default value"

// Ini setara dengan:
// a || (a = b);

Operator ||= menugaskan nilai kanan hanya jika nilai kiri salah. Itu sempurna untuk menetapkan nilai default!

Operator Penugasan Logika Nullish (??=)

let foo = null;
let bar = 'baz';

foo ??= bar;

console.log(foo); // Output: "baz"

// Ini setara dengan:
// foo ?? (foo = bar);

Operator ??= menugaskan nilai kanan hanya jika nilai kiri null atau undefined. Itu mirip dengan ||=, tapi lebih spesifik tentang apa yang dianggap "kosong".

Ringkasan Metode

Berikut adalah tabel ringkasan metode baru yang kita pelajari:

Metode	Deskripsi	Contoh
Pemisah Numerik	Menjadikan angka besar lebih mudah dibaca	1_000_000_000
Promise.any()	Ter-resolve saat salah satu promise di array terpenuhi	Promise.any([promise1, promise2, promise3])
String.replaceAll()	Mengganti semua kemunculan substring	"hello hello".replaceAll("hello", "hi")
&&=	Menugaskan jika kiri benar	x &&= y
||=	Menugaskan jika kiri salah	x \|\|= y
??=	Menugaskan jika kiri null atau undefined	x ??= y

Dan itu dia, teman-teman! Kita telah menjelajahi fitur baru ECMAScript 2021. Ingat, cara terbaik untuk belajar pemrograman adalah dengan melakukan. Jadi, saya mendorong Anda untuk bermain dengan fitur baru ini, eksperimen, dan terutama, bersenang-senang!

Seperti yang kata gurunya saat itu, "Pemrograman seperti memasak. Anda mungkin membakar beberapa piringan pertama, tapi dengan latihan, Anda akan menciptakan kreasinya dalam waktu singkat!" Jadi jangan takut untuk membuat kesalahan - mereka semua bagian dari proses belajar.

Tetap coding, tetap curiga, dan belajar bahagia!

Credits: Image by storyset