0Pricing
JavaScript Academy · Pelajaran

Rest dan Spread — Array serta Objek yang Idiomatis

Kumpulkan sisa nilai/properti, gandakan dan gabungkan dengan spread, serta hindari mutasi tersembunyi menggunakan pola sederhana

Rest dan Spread — Array serta Objek yang Idiomatis adalah pelajaran JavaScript Academy gratis di CoddyKit. Ini adalah pelajaran 2 dari 2. 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 2 pelajaran total.

Pengantar

Tujuan: Gunakan sisa untuk mengumpulkan tambahan dan penyebaran untuk menyalin atau menggabungkan.

  • Penyebaran larik/objek
  • Sisa larik (bagian awal/akhir)
  • Sisa objek (mengecualikan beberapa key)
  • Perubahan vs salinan
Rest dan Spread — Array serta Objek yang Idiomatis — ilustrasi 1

Dasar-dasar penyebaran larik

[...arr] menyalin larik; gabungkan larik dengan menyebarkannya ke dalam larik baru.

// Array spread creates a shallow copy and merges arrays
const a = [1, 2];
const b = [3, 4];

const clone = [...a];
const merged = [...a, ...b];

console.log("a:", a);
console.log("clone:", clone);
console.log("merged:", merged);
Rest dan Spread — Array serta Objek yang Idiomatis — ilustrasi 2

Pola sisa larik

Elemen sisa (…tail) mengumpulkan bagian yang tersisa ke dalam larik baru.

// Array rest collects the remaining items
const nums = [10, 20, 30, 40];

const [head, ...tail] = nums;

console.log("head:", head);
console.log("tail:", tail);
Rest dan Spread — Array serta Objek yang Idiomatis — ilustrasi 3

Dasar-dasar penyebaran objek

Penggabungan objek bergantung pada urutan: penyebaran berikutnya menimpa key sebelumnya.

// Object spread copies and merges; later keys win
const base = { theme: "light", compact: false };
const override = { compact: true };

const copy = { ...base };
const merged = { ...base, ...override };

console.log("copy:", copy);
console.log("merged:", merged);
Rest dan Spread — Array serta Objek yang Idiomatis — ilustrasi 4

Pola sisa objek

Gunakan { a, ...rest } untuk mengambil beberapa properti dan mempertahankan sisanya secara bersamaan.

// Object rest collects remaining properties
const user = { id: 7, name: "Ayla", role: "admin" };

const { id, ...publicInfo } = user;

console.log("id:", id);
console.log("publicInfo:", publicInfo);
Rest dan Spread — Array serta Objek yang Idiomatis — ilustrasi 5

Menghindari perubahan melalui salinan

Buat objek baru saat mengubah nilai; cara ini lebih jelas dan aman daripada mengubah data yang digunakan bersama.

// Copy instead of mutating original data
const settings = { sound: true, volume: 5 };

// Mutating version (avoid in shared state)
// settings.volume = 6;

// Non-mutating: create an updated copy
const updated = { ...settings, volume: 6 };

console.log("settings:", settings);
console.log("updated:", updated);
Rest dan Spread — Array serta Objek yang Idiomatis — ilustrasi 6

Kuis sisa objek

Pemeriksaan singkat: Sisa objek.

Rest dan Spread — Array serta Objek yang Idiomatis — ilustrasi 7

Ringkasan

Ringkasan: Penyebaran menyalin/menggabungkan larik dan objek; sisa mengumpulkan bagian yang tersisa. Utamakan penyalinan daripada perubahan agar setiap perubahan terlihat jelas.

Rest dan Spread — Array serta Objek yang Idiomatis — ilustrasi 8

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Rest dan Spread — Array serta Objek yang Idiomatis” gratis?

Ya — teks lengkap “Rest dan Spread — Array serta Objek yang Idiomatis” 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 2 pelajaran total.

Apa yang akan aku pelajari di “Rest dan Spread — Array serta Objek yang Idiomatis”?

Kumpulkan sisa nilai/properti, gandakan dan gabungkan dengan spread, serta hindari mutasi tersembunyi menggunakan pola sederhana 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 2 dari 2.

Berapa lama pelajaran “Rest dan Spread — Array serta Objek yang Idiomatis” 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

  1. Dasar Destrukturisasi Array/Objek
  2. Rest dan Spread — Array serta Objek yang Idiomatis
← Kembali ke JavaScript Academy