0Pricing
JavaScript Academy · Pelajaran

Penggandaan dan Penggabungan — spread dan Object.assign

Gandakan dan gabungkan objek/array menggunakan spread dan Object.assign; pahami penyalinan dangkal serta urutan penimpaan

Penggandaan dan Penggabungan — spread dan Object.assign 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: Melakukan clone dan menggabungkan objek/larik dengan aman.

  • Penyebaran untuk clone/penggabungan
  • Object.assign
  • Urutan penimpaan
  • Keterbatasan salinan shallow
Penggandaan dan Penggabungan — spread dan Object.assign — ilustrasi 1

Penyebaran: clone objek

Gunakan {...obj} untuk membuat clone shallow. Mengubah clone tidak mengubah field tingkat atas pada objek asli.

// Shallow clone with object spread
const user = { name: "Ayla", level: 1 };
const clone = { ...user };

clone.level = 2;

console.log("Original:", user);
console.log("Clone:", clone);
Penggandaan dan Penggabungan — spread dan Object.assign — ilustrasi 2

Object.assign: clone

Object.assign({}, obj) juga membuat clone shallow. Hindari mengubah sumber dengan melakukan penugasan ke objek kosong.

// Shallow clone with Object.assign
const settings = { theme: "dark", compact: false };
const copy = Object.assign({}, settings);

copy.compact = true;

console.log("Settings:", settings);
console.log("Copy:", copy);
Penggandaan dan Penggabungan — spread dan Object.assign — ilustrasi 3

Penggabungan: urutan penting

Penggabungan bergantung pada urutan: sumber berikutnya menimpa key sebelumnya (b menjadi 9 di sini).

// Merge: later keys overwrite earlier ones
const base = { a: 1, b: 2 };
const extra = { b: 9, c: 3 };

const mergedSpread = { ...base, ...extra };
const mergedAssign = Object.assign({}, base, extra);

console.log("Spread merged:", mergedSpread);
console.log("Assign merged:", mergedAssign);
Penggandaan dan Penggabungan — spread dan Object.assign — ilustrasi 4

Penyebaran larik: clone & gabungkan

[...arr] membuat clone larik. Gabungkan larik dengan [...a, ...b] tanpa mengubahnya.

// Arrays: clone and merge with spread
const nums = [1, 2, 3];
const cloneNums = [...nums];

const more = [4, 5];
const mergedNums = [...nums, ...more];

console.log("nums:", nums);
console.log("clone:", cloneNums);
console.log("merged:", mergedNums);
Penggandaan dan Penggabungan — spread dan Object.assign — ilustrasi 5

Shallow vs deep

Salinan shallow: objek/larik bertingkat dibagikan. Untuk struktur deep, salin tingkat dalam secara eksplisit.

// Shallow copy caveat: nested objects are shared
const original = { user: { name: "Mina" }, active: true };
const shallow = { ...original };

// Mutate nested object
shallow.user.name = "Lena";

console.log("Original:", original);
console.log("Shallow:", shallow);
Penggandaan dan Penggabungan — spread dan Object.assign — ilustrasi 6

Kuis metode clone

Pemeriksaan singkat: Clone shallow tanpa perubahan.

Penggandaan dan Penggabungan — spread dan Object.assign — ilustrasi 7

Ringkasan

Ringkasan: Lakukan clone dengan penyebaran atau Object.assign ke objek kosong, gabungkan dengan menempatkan sumber berikutnya di posisi terakhir, dan ingat: semuanya adalah salinan shallow.

Penggandaan dan Penggabungan — spread dan Object.assign — ilustrasi 8

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Penggandaan dan Penggabungan — spread dan Object.assign” gratis?

Ya — teks lengkap “Penggandaan dan Penggabungan — spread dan Object.assign” 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 “Penggandaan dan Penggabungan — spread dan Object.assign”?

Gandakan dan gabungkan objek/array menggunakan spread dan Object.assign; pahami penyalinan dangkal serta urutan penimpaan 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 “Penggandaan dan Penggabungan — spread dan Object.assign” 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. CRUD Array, Iterasi; Dasar & Akses Objek
  2. Penggandaan dan Penggabungan — spread dan Object.assign
← Kembali ke JavaScript Academy