Lompat ke konten utama

Kompetisi Ajak Teman: hadiah total Rp1.000.000 tunai untuk 3 pengajak terbanyak. Berakhir 29 November 2026. Ikut kompetisi

←

JavaScript Lanjutan

Pelajaran 12 dari 22

Fungsi, class, dan modul

Modul: import dan export

Setelah pelajaran ini kamu bisa membaca dan menulis pernyataan import dan export bernama maupun default.

±14 menitDiperiksa 28 Sep 2026

Materi

Program yang besar dipecah menjadi berkas-berkas modul. Setiap modul punya ruang nama sendiri: variabel di satu berkas tidak terlihat di berkas lain kecuali diekspor dengan export, lalu diambil dengan import. Modul otomatis berjalan dalam strict mode. Di halaman web, berkas yang memakai import dimuat dengan <script type="module">; tanpa atribut itu, pernyataan import ditolak dengan SyntaxError.

Ada dua jenis ekspor. Ekspor bernama bisa lebih dari satu per modul dan diambil dengan kurung kurawal memakai nama yang sama, misalnya import { hitungOngkir, TARIF } from "./ongkir.js". Ekspor default hanya boleh satu per modul, diambil tanpa kurung kurawal, dan nama penerimanya bebas. Keduanya bisa diambil dalam satu baris: import hitung, { TARIF } from "./ongkir.js". Kata as mengganti nama, dan import * as ongkir mengumpulkan semua ekspor bernama dalam satu objek.

// ongkir.js
export const TARIF = 9000;
export function perKilo(berat) {
  return Math.ceil(berat) * TARIF;
}
export default function gratis(total) {
  return total >= 150000;
}

// kasir.js
import gratis, { perKilo as ongkirKilo } from "./ongkir.js";
import * as ongkir from "./ongkir.js";
ongkirKilo(1.2);  // 18000
ongkir.TARIF;     // 9000

Nilai yang diimpor adalah ikatan hidup yang hanya bisa dibaca: bila modul asal mengubah nilainya, pengimpor ikut melihat perubahan itu, tetapi pengimpor sendiri tidak boleh mengisi ulang nama tersebut.

Latihan

0/3 lulus

Jawaban diperiksa di server. Lulus berarti kamu memahami contohnya, bukan penilaian seluruh pekerjaanmu.

Latihan 1 dari 3

Berkas pajak.js berisi export default function hitung() {} dan export const PPN = 11;. Baris mana yang mengambil keduanya dengan benar?

Pilih satu jawaban

Latihan 2 dari 3

Berapa banyak ekspor default yang boleh dimiliki satu modul?

Pilih satu jawaban

Latihan 3 dari 3

config.js berisi export let batas = 5;. Berkas lain menulis import { batas } from "./config.js"; lalu batas = 10;. Apa yang terjadi?

Pilih satu jawaban

Catatanmu

Memuat catatan…

tersimpan otomatis, ikut tercetak · 0/4.000

Luluskan semua latihan dulu untuk menandai pelajaran ini selesai.

Lanjutkan ke