Latihan Soal: JavaScript Modern (ES6+)

Setelah mempelajari berbagai fitur modern dalam JavaScript — seperti destructuring, spread & rest operator, template literal, dan module — kini saatnya menguji sejauh mana pemahamanmu melalui latihan soal.

Latihan ini dirancang untuk membantu kamu:

• Mengingat kembali konsep inti ES6+
• Mengasah kemampuan membaca dan menulis sintaks modern
• Mempersiapkan diri untuk mengerjakan proyek JavaScript yang lebih kompleks

Yuk, langsung kita mulai!

📝 Latihan Soal: JavaScript Modern (ES6+)

Soal 1: Destructuring Array Apa output dari kode berikut ini?

1const angka = [1, 2, 3];
2const [a, , c] = angka;
3
4console.log(a, c);
5

1const angka = [1, 2, 3];
2const [a, , c] = angka;
3
4console.log(a, c);
5

a. 1 2 b. 1 3 c. 2 3 d. 1 undefined

Soal 2: Destructuring Object Apa yang salah dengan kode berikut?

1const user = { nama: "Andi", umur: 25 };
2const { namaDepan } = user;
3
4console.log(namaDepan);
5

1const user = { nama: "Andi", umur: 25 };
2const { namaDepan } = user;
3
4console.log(namaDepan);
5

a. Tidak ada yang salah, output: undefined b. Error: namaDepan is not defined c. Output: "Andi" d. Output: null

Soal 3: Spread Operator Manakah pernyataan berikut yang benar tentang spread operator?

a. Digunakan untuk menyalin isi array atau object b. Digunakan untuk menghapus properti dari object c. Digunakan untuk membalik array d. Digunakan untuk membuat variabel global

Soal 4: Rest Parameter Apa output dari fungsi berikut?

1function hitung(...angka) {
2  return angka.length;
3}
4
5console.log(hitung(1, 2, 3, 4));
6

1function hitung(...angka) {
2  return angka.length;
3}
4
5console.log(hitung(1, 2, 3, 4));
6

a. 3 b. 4 c. 5 d. undefined

Soal 5: Template Literal Pilih pernyataan yang benar tentang template literal:

a. Hanya bisa digunakan untuk menyisipkan angka b. Tidak bisa digunakan untuk multiline string c. Menggunakan tanda kutip tunggal ' ' d. Menggunakan backtick dan bisa menyisipkan ekspresi

Soal 6: Default Export Manakah cara yang benar untuk mengimpor default export?

1// file utils.js
2export default function() {
3  console.log("Halo");
4}
5

1// file utils.js
2export default function() {
3  console.log("Halo");
4}
5

a. import { default } from './utils.js'; b. import * as utils from './utils.js'; c. import halo from './utils.js'; d. require('./utils.js')

Soal 7: Named Export Jika file math.js memiliki kode berikut:

1export const tambah = (a, b) => a + b;
2export const kali = (a, b) => a * b;
3

1export const tambah = (a, b) => a + b;
2export const kali = (a, b) => a * b;
3

Bagaimana cara mengimpornya dengan benar?

a. import math from './math.js'; b. import { tambah, kali } from './math.js'; c. import * as { tambah, kali } from './math.js'; d. require('./math.js')

Soal 8: Gabungan Destructuring & Default Value Apa output dari kode berikut?

1const [x = 10, y = 20] = [5];
2
3console.log(x, y);
4

1const [x = 10, y = 20] = [5];
2
3console.log(x, y);
4

a. 10 20 b. 5 20 c. 5 undefined d. undefined undefined

Jika kamu sudah menjawab semuanya, yuk lanjut ke pembahasan dan kunci jawaban untuk melihat sejauh mana pemahamanmu. Semangat belajar! 🚀