JavaScript Academy · Pelajaran

Optional Chaining dengan Operator ?.

Akses properti bertingkat secara aman.

Optional Chaining dengan Operator ?. adalah pelajaran JavaScript Academy gratis di CoddyKit. Ini adalah pelajaran 1 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar JavaScript Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus JavaScript Academy mencakup 4 pelajaran total.

Masalahnya

Membaca properti pada sesuatu yang bernilai undefined atau null akan menimbulkan TypeError. Rangkaian opsional memungkinkan Anda membaca nilai bertingkat dengan aman.

const user = {};
console.log(user.profile && user.profile.name);

Operator ?.

Operator rangkaian opsional ?. berhenti dan mengembalikan undefined jika nilai di sebelah kirinya adalah null atau undefined, alih-alih menimbulkan kesalahan.

const user = {};
console.log(user.profile?.name); // undefined, no error

Membaca Properti yang Bertingkat Dalam

Anda dapat merangkai beberapa langkah ?. untuk menelusuri struktur yang dalam tanpa pemeriksaan manual di setiap tingkat.

const data = { user: { address: { city: "Paris" } } };
console.log(data.user?.address?.city); // "Paris"

Pemutusan Rangkaian

Jika salah satu bagian dalam rangkaian bernilai nullish, seluruh ekspresi segera berhenti dan menghasilkan undefined; bagian sisanya tidak dievaluasi.

const data = { user: null };
console.log(data.user?.address?.city); // undefined

Hanya Nilai Nullish yang Memicunya

?. hanya menghentikan rangkaian pada null atau undefined. Nilai falsy lain seperti 0 atau "" adalah nilai nyata dan diakses secara normal.

const obj = { count: 0 };
console.log(obj.count?.toString()); // "0"

Perbandingan dengan &&

Sebelum ?. tersedia, orang merangkai pemeriksaan &&. Rangkaian opsional lebih singkat dan lebih jelas untuk maksud yang sama.

const u = { profile: { name: "Ada" } };
const a = u && u.profile && u.profile.name;
const b = u?.profile?.name;
console.log(a, b);

Merangkai Setelah Pemanggilan

Anda dapat melanjutkan rangkaian setelah pemanggilan metode untuk mengakses properti pada nilai yang dikembalikan dengan aman.

const config = { get: () => ({ port: 8080 }) };
console.log(config.get()?.port); // 8080

Pemutusan di Tengah Rangkaian

Jika bagian tengah rangkaian bernilai nullish, evaluasi langsung berhenti, meskipun bagian berikutnya seharusnya memanggil fungsi.

const obj = { a: null };
console.log(obj.a?.b.c.d); // undefined, never touches b/c/d

Bukan untuk Penugasan

Rangkaian opsional digunakan untuk membaca. Anda tidak dapat melakukan penugasan pada rangkaian opsional; hal itu merupakan kesalahan sintaks pada sisi kiri =.

const o = { x: 1 };
// o?.x = 5; // SyntaxError
o.x = 5;
console.log(o.x);

Menggabungkan dengan Larik

Fitur ini juga bekerja dengan akses menggunakan tanda kurung siku, yang akan dibahas lebih lanjut. Keamanan terhadap nilai nullish tetap berlaku.

const state = { items: ["a", "b"] };
console.log(state.items?.[0]); // "a"

Hindari Penggunaan Berlebihan

Gunakan ?. hanya di tempat yang nilainya memang dapat tidak tersedia. Penggunaan berlebihan dapat menyembunyikan kesalahan dengan membungkam kesalahan yang sebenarnya perlu Anda lihat.

const order = { total: 42 };
console.log(order.total?.toFixed(2)); // "42.00"

Pemeriksaan Cepat

Prediksikan hasilnya.

Ringkasan

Operator ?. membaca properti dengan aman: jika sisi kiri bernilai null atau undefined, operator ini mengembalikan undefined alih-alih menimbulkan kesalahan dan menghentikan sisa rangkaian. Hanya nilai nullish yang memicunya (bukan 0 atau ""), dan operator ini tidak dapat digunakan sebagai target penugasan.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Optional Chaining dengan Operator ?. ” gratis?

Ya — teks lengkap “Optional Chaining dengan Operator ?. ” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus JavaScript Academy, upgrade ke CoddyKit PRO. Kursus JavaScript Academy mencakup 4 pelajaran total.

Apa yang akan aku pelajari di “Optional Chaining dengan Operator ?. ”?

Akses properti bertingkat secara aman. Kamu berlatih JavaScript Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai JavaScript Academy?

Tidak diperlukan pengalaman sebelumnya. JavaScript Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 1 dari 4.

Berapa lama pelajaran “Optional Chaining dengan Operator ?. ” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran JavaScript Academy ini?

Ya. Setiap pelajaran JavaScript Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

← Kembali ke JavaScript Academy