Homepage

Belajar Bahasa Pemrograman

Tip

Dokumentasi ini di buat biar orang orang mudah mempelajari sama menegeti tentang apa itu bahsa pemprograman, karan disini saya mmebuatnay seperti wiki, dan dokumentsinya di ambil dari sumber terpercaya. kayak wikipedia atau mdn dll

Tujuan Proyek

Dokumentasi ini dibuat karena:

• Banyak sumber belajar programming berkualitas, namun mayoritas dalam bahasa Inggris
• Ingin menyediakan referensi 100% Bahasa Indonesia yang ramah untuk pemula
• Membantu mengurangi hambatan bahasa dalam belajar teknologi
• Ke depannya akan dikembangkan ke bahasa daerah/nasional lainnya

Cara Berkontribusi

Kami sangat menyambut kontribusi dari siapa saja! Jika kamu menemukan:

• Typo atau kesalahan penulisan
• Informasi yang kurang akurat
• Materi yang bisa diperjelas
• Ide untuk konten baru

Silakan bantu perbaiki melalui:

Langkah-Langkah Kontribusi:

1. Fork repositori ini
2. Buat branch baru dengan format:
   • fix/ untuk perbaikan bug/typo (contoh: fix/typo-bab-dasar)
   • docs/ untuk penambahan konten (contoh: docs/tambah-bab-looping)
3. Lakukan perubahan pada file yang relevan di folder src/
4. Commit dengan pesan yang deskriptif:

   git commit -m "docs: tambahkan penjelasan variabel di bab-dasar.md"
   

5. Buat Pull Request ke branch main dengan deskripsi perubahan

Tip

Klik Edit di GitHub untuk perbaikan cepat tanpa clone repo!

Panduan Penulisan Konten

Agar dokumentasi tetap konsisten, ikuti standar berikut:

• Gunakan bahasa Indonesia baku yang santai dan mudah dipahami
• Sertakan contoh kode untuk setiap konsep penting
• Tambahkan komentar pada contoh kode untuk penjelasan
• Gunakan format Markdown yang rapi (heading, list, code block)
• Referensi eksternal? Cantumkan sumbernya!

Lisensi

Proyek ini dilisensikan di bawah MIT License.
Silakan gunakan, modifikasi, dan sebarkan — selama mencantumkan atribusi ke repositori asli.
Detail lengkap: LICENSE

license

MIT License

Copyright (c) 2026 neuxdotdev

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Javascript

nah jadi di bagian ini kita akan membahas tentnag apa itu javascritp, apasih bedanya javascript sama bahasa lain atau pertanyana pertanayan yang plaing dasar apa itu js ? dll nah kita akan basah semnaya di bagain ini, karna ini memng tempat buat tanta tanay juga sama dokmentasi juga.

src/javascript
├── 00-javascript-basics
│   ├── 01-intro.md
│   ├── 02-where-to.md
│   ├── 03-output.md
│   ├── 04-syntax.md
│   ├── 05-statements.md
│   ├── 06-comments.md
│   └── readme.md
├── 01-variables-and-data-types
│   ├── 01-variables.md
│   ├── 02-let.md
│   ├── 03-const.md
│   ├── 04-data-types.md
│   ├── 05-typeof.md
│   ├── 06-type-conversion.md
│   ├── 07-primitive-vs-object.md
│   └── readme.md
├── 02-operators-and-expressions
│   ├── 01-operators.md
│   ├── 02-arithmetic.md
│   ├── 03-assignment.md
│   ├── 04-comparison.md
│   ├── 05-logical.md
│   ├── 06-bitwise.md
│   └── readme.md
├── 03-control-flow
│   ├── 01-conditional.md
│   ├── 02-if.md
│   ├── 03-if-else.md
│   ├── 04-ternary.md
│   ├── 05-switch.md
│   ├── 06-loops.md
│   ├── 07-for-loop.md
│   ├── 08-while-loop.md
│   ├── 09-break-continue.md
│   └── readme.md
├── 04-strings
│   ├── 01-strings.md
│   ├── 02-string-templates.md
│   ├── 03-string-methods.md
│   ├── 04-string-search.md
│   └── readme.md
├── 05-numbers-and-math
│   ├── 01-numbers.md
│   ├── 02-number-methods.md
│   ├── 03-number-properties.md
│   ├── 04-bigint.md
│   ├── 05-math.md
│   ├── 06-random.md
│   └── readme.md
├── 06-functions
│   ├── 01-function-basics.md
│   ├── 02-function-expressions.md
│   ├── 03-arrow-functions.md
│   ├── 04-parameters.md
│   ├── 05-return.md
│   ├── 06-scope.md
│   ├── 07-hoisting.md
│   ├── 08-callbacks.md
│   ├── 09-this.md
│   ├── 10-call-apply-bind.md
│   ├── 11-closures.md
│   ├── 12-iife.md
│   ├── 13-generators.md
│   └── readme.md
├── 07-objects
│   ├── 01-object-basics.md
│   ├── 02-object-properties.md
│   ├── 03-object-methods.md
│   ├── 04-constructors.md
│   ├── 05-prototypes.md
│   ├── 06-iterations.md
│   ├── 07-getters-setters.md
│   ├── 08-object-protection.md
│   └── readme.md
├── 08-arrays-and-collections
│   ├── 01-arrays.md
│   ├── 02-array-methods.md
│   ├── 03-array-search.md
│   ├── 04-array-sort.md
│   ├── 05-array-iterations.md
│   ├── 06-sets.md
│   ├── 07-maps.md
│   ├── 08-typed-arrays.md
│   ├── 09-weak-set-map.md
│   └── readme.md
├── 09-dates-and-temporal
│   ├── 01-dates.md
│   ├── 02-date-formats.md
│   ├── 03-date-get-methods.md
│   ├── 04-date-set-methods.md
│   ├── 05-temporal-intro.md
│   ├── 06-temporal-now.md
│   ├── 07-temporal-plain.md
│   ├── 08-temporal-zoned.md
│   ├── 09-temporal-duration.md
│   └── readme.md
├── 10-regular-expressions
│   ├── 01-regexp.md
│   ├── 02-flags.md
│   ├── 03-character-classes.md
│   ├── 04-meta-characters.md
│   ├── 05-assertions.md
│   ├── 06-quantifiers.md
│   ├── 07-patterns.md
│   ├── 08-regexp-methods.md
│   └── readme.md
├── 11-error-handling-and-debugging
│   ├── 01-errors-intro.md
│   ├── 02-error-statements.md
│   ├── 03-error-object.md
│   ├── 04-debugging.md
│   ├── 05-console.md
│   ├── 06-breakpoints.md
│   └── readme.md
├── 12-classes-and-oop
│   ├── 01-classes.md
│   ├── 02-inheritance.md
│   ├── 03-static.md
│   ├── 04-private-properties.md
│   └── readme.md
├── 13-asynchronous-javascript
│   ├── 01-async-intro.md
│   ├── 02-callbacks.md
│   ├── 03-promises.md
│   ├── 04-async-await.md
│   ├── 05-fetch-api.md
│   ├── 06-async-debug.md
│   └── readme.md
├── 14-modules
│   ├── 01-modules-intro.md
│   ├── 02-export.md
│   ├── 03-import.md
│   ├── 04-namespace.md
│   ├── 05-dynamic-import.md
│   └── readme.md
├── 15-meta-programming-and-proxy
│   ├── 01-meta-programming.md
│   ├── 02-reflect.md
│   ├── 03-proxy.md
│   └── readme.md
├── 16-dom-and-window
│   ├── 01-dom-intro.md
│   ├── 02-dom-methods.md
│   ├── 03-dom-elements.md
│   ├── 04-dom-html.md
│   ├── 05-dom-css.md
│   ├── 06-dom-events.md
│   ├── 07-event-listener.md
│   ├── 08-dom-navigation.md
│   ├── 09-dom-nodes.md
│   ├── 10-window.md
│   ├── 11-screen.md
│   ├── 12-location.md
│   ├── 13-history.md
│   ├── 14-navigator.md
│   ├── 15-popup.md
│   ├── 16-timing.md
│   ├── 17-cookies.md
│   └── readme.md
├── 17-web-apis-and-ajax
│   ├── 01-web-apis-intro.md
│   ├── 02-fetch-api.md
│   ├── 03-geolocation.md
│   ├── 04-web-storage.md
│   ├── 05-validation-api.md
│   ├── 06-web-workers.md
│   ├── 07-ajax-intro.md
│   ├── 08-xmlhttprequest.md
│   ├── 09-ajax-response.md
│   ├── 10-ajax-examples.md
│   ├── 11-json-intro.md
│   ├── 12-json-syntax.md
│   ├── 13-json-parse-stringify.md
│   ├── 14-json-objects-arrays.md
│   ├── 15-json-server.md
│   └── readme.md
├── 18-jquery-and-graphics
│   ├── 01-jquery-selectors.md
│   ├── 02-jquery-html.md
│   ├── 03-jquery-css.md
│   ├── 04-jquery-dom.md
│   ├── 05-graphics-canvas.md
│   ├── 06-plotly.md
│   ├── 07-chartjs.md
│   ├── 08-google-chart.md
│   ├── 09-d3js.md
│   └── readme.md
├── 19-examples-and-references
│   ├── 01-examples.md
│   ├── 02-dom-examples.md
│   ├── 03-input-examples.md
│   ├── 04-events-examples.md
│   ├── 05-browser-examples.md
│   ├── 06-editor.md
│   ├── 07-exercises.md
│   ├── 08-quiz.md
│   ├── 09-website.md
│   ├── 10-syllabus.md
│   ├── 11-study-plan.md
│   ├── 12-interview-prep.md
│   ├── 13-bootcamp.md
│   ├── 14-certificate.md
│   ├── 15-keywords-reference.md
│   ├── 16-operators-reference.md
│   ├── 17-operator-precedence.md
│   └── readme.md
├── 20-projects-and-portfolio
│   ├── 01-counter.md
│   ├── 02-event-listener.md
│   ├── 03-todo-list.md
│   ├── 04-modal-popup.md
│   ├── 05-form-validation.md
│   └── readme.md
└── readme.md

Javascript Basics

1. Apa Itu JavaScript?

JavaScript adalah bahasa pemrograman tingkat tinggi, dinamis, dan berbasis objek yang terutama digunakan untuk membuat halaman web menjadi interaktif dan dinamis. Bersama HTML dan CSS, JavaScript merupakan salah satu teknologi inti dari World Wide Web. Kode JavaScript dapat ditanam langsung di halaman HTML atau disimpan dalam file terpisah dengan ekstensi .js.

JavaScript awalnya dirancang untuk berjalan di sisi klien (client-side), yaitu di dalam peramban web (browser). Namun, seiring perkembangan, JavaScript kini juga dapat dijalankan di sisi server (melalui Node.js), sehingga mampu menangani logika backend, basis data, dan lain-lain.

2. Sejarah Singkat JavaScript

• 1995: Brendan Eich menciptakan JavaScript dalam waktu 10 hari saat bekerja di Netscape. Awalnya dinamai Mocha, lalu LiveScript, dan akhirnya JavaScript untuk memanfaatkan popularitas Java.
• 1997: JavaScript distandarisasi oleh ECMA International dengan nama resmi ECMAScript.
• 2009: Munculnya Node.js memungkinkan JavaScript berjalan di server.
• 2015: ECMAScript 6 (ES6) dirilis dengan banyak fitur modern seperti kelas, modul, arrow function, dan promise.
• Sekarang: JavaScript terus berkembang dengan rilis tahunan ECMAScript dan mendominasi pengembangan web frontend maupun backend.

3. Fitur-Fitur Utama JavaScript

• Interpreted (ditafsirkan): Tidak perlu dikompilasi; langsung dijalankan oleh browser atau Node.js.
• Berbasis objek: Mendukung pemrograman berbasis objek dengan prototipe (sebelum ES6) dan kelas (setelah ES6).
• Fungsional: Fungsi dapat disimpan dalam variabel, dikirim sebagai argumen, dan dikembalikan dari fungsi lain (first-class functions).
• Dinamis: Tipe data variabel dapat berubah saat runtime.
• Event-driven: Cocok untuk menangani interaksi pengguna (klik, ketikan, dll).
• Multi-paradigma: Mendukung gaya pemrograman imperatif, deklaratif, fungsional, dan berorientasi objek.
• Ringan dan cepat: Eksekusi cepat di browser modern dengan JIT compilation.

4. Apa Saja yang Bisa Dibuat dengan JavaScript?

JavaScript adalah bahasa serbaguna yang dapat digunakan untuk berbagai keperluan:

Dengan JavaScript, Anda bisa mengembangkan dari frontend hingga backend tanpa harus berganti bahasa—itulah mengapa ia disebut sebagai bahasa “full-stack”.

5. Apakah JavaScript Cocok untuk Pemula?

Sangat cocok! Berikut alasannya:

• Mudah dipelajari: Sintaksnya sederhana dan mirip dengan bahasa pemrograman populer lainnya (C, Java). Anda bisa langsung mencoba di browser tanpa perlu instalasi.
• Lingkungan belajar yang kaya: Cukup buka browser dan konsol (F12) untuk menulis dan menjalankan kode JavaScript.
• Dukungan komunitas besar: Banyak tutorial, forum, dan dokumentasi tersedia secara gratis.
• Langsung terlihat hasilnya: Kode yang ditulis langsung memengaruhi tampilan dan interaksi halaman web, memberikan umpan balik instan yang memotivasi.
• Membangun fondasi yang kuat: Dengan menguasai JavaScript, Anda akan memahami konsep penting seperti fungsi, objek, event, dan asynchronous programming yang berguna untuk bahasa lain.

JavaScript mendukung berbagai gaya pemrograman (fungsional, objek, imperatif) sehingga membantu pemula memperluas wawasan dan meningkatkan kemampuan ke bahasa lain di masa depan.

6. Perbedaan Java dan JavaScript

Meskipun namanya mirip, Java dan JavaScript sangat berbeda. Berikut perbandingannya:

Note

Catatan: Nama JavaScript dipilih untuk alasan pemasaran agar memanfaatkan popularitas Java, tetapi kedua bahasa ini tidak memiliki hubungan teknis.

7. Kelebihan dan Kekurangan JavaScript

Kelebihan

• Universal: Berjalan di semua browser modern tanpa plugin tambahan.
• Ekosistem besar: NPM (Node Package Manager) menyediakan jutaan paket siap pakai.
• Komunitas aktif: Banyak sumber belajar, forum, dan pembaruan rutin.
• Full-stack development: Bisa menangani frontend dan backend dengan satu bahasa.
• Performa tinggi (dengan mesin modern seperti V8).
• Dukungan untuk pemrograman asinkron (callback, promise, async/await) sehingga cocok untuk aplikasi real-time.

Kekurangan

• Keamanan: Karena kode dijalankan di sisi klien, pengguna bisa melihat dan memodifikasi kode (namun bisa diatasi dengan minifikasi/obfuscation).
• Kerentanan terhadap kesalahan tipe data: Karena dinamis, error bisa baru terdeteksi saat runtime.
• Ketergantungan pada browser: Perilaku bisa sedikit berbeda antar browser (meski sekarang sudah lebih seragam).
• Single-threaded: Untuk tugas berat CPU, bisa menghambat event loop (diatasi dengan Web Workers).

8. Cara Kerja JavaScript

Client-side (di Browser)

1. Browser memuat halaman HTML dan CSS.
2. Mesin JavaScript (misal: V8 di Chrome) membaca dan mengeksekusi kode JS.
3. JS dapat memanipulasi DOM (struktur halaman) dan menangani event (klik, submit, dll).
4. JS juga bisa berkomunikasi dengan server secara asinkron menggunakan AJAX/fetch.

Server-side (dengan Node.js)

1. Node.js menyediakan runtime JavaScript di luar browser.
2. Kode JS dapat mengakses file system, jaringan, database, dll.
3. Menggunakan arsitektur non-blocking I/O sehingga mampu menangani banyak koneksi simultan dengan efisien.

9. Sintaks Dasar JavaScript

Berikut adalah contoh-contoh sintaks dasar yang perlu diketahui:

Menampilkan output

console.log("Hello, World!");
alert("Ini pesan popup");
document.write("Menulis ke halaman");

Variabel dan Tipe Data

let nama = "Budi"; // string (bisa diubah)
const PI = 3.14; // constant (tidak bisa diubah)
var umur = 25; // cara lama (hindari)

let isMarried = false; // boolean
let tinggi; // undefined
let kosong = null; // null

// Tipe data objek
let person = { firstName: "John", lastName: "Doe" };
let angka = [1, 2, 3]; // array

Operator

let a = 10,
  b = 3;
console.log(a + b); // 13
console.log(a % b); // 1 (sisa bagi)

// Perbandingan
console.log(a == "10"); // true (nilai sama)
console.log(a === "10"); // false (nilai dan tipe berbeda)

Percabangan

let nilai = 85;
if (nilai >= 80) {
  console.log("Lulus");
} else if (nilai >= 60) {
  console.log("Remidi");
} else {
  console.log("Tidak lulus");
}

// Switch
let hari = "Senin";
switch (hari) {
  case "Senin":
    console.log("Hari kerja");
    break;
  default:
    console.log("Hari lain");
}

Perulangan

// for
for (let i = 0; i < 5; i++) {
  console.log(i);
}

// while
let j = 0;
while (j < 5) {
  console.log(j);
  j++;
}

// for...of (array)
let buah = ["apel", "mangga", "jeruk"];
for (let item of buah) {
  console.log(item);
}

Fungsi

// Deklarasi fungsi
function sapa(nama) {
  return "Halo, " + nama;
}

// Ekspresi fungsi (arrow function)
const kali = (a, b) => a * b;

console.log(sapa("Ana")); // Halo, Ana
console.log(kali(4, 5)); // 20

Objek dan Array

// Objek
let mobil = {
  merk: "Toyota",
  tahun: 2020,
  jalan: function () {
    console.log("Mobil berjalan");
  },
};
console.log(mobil.merk);
mobil.jalan();

// Array
let warna = ["merah", "kuning", "hijau"];
warna.push("biru"); // tambah elemen
console.log(warna.length); // 4

Manipulasi DOM (di browser)

<p id="demo">Paragraf awal</p>
<button onclick="ubahTeks()">Klik</button>

<script>
  function ubahTeks() {
    document.getElementById("demo").innerHTML = "Teks berubah!";
  }
</script>

Asynchronous (Promise & async/await)

// Menggunakan Promise
fetch("https://api.example.com/data")
  .then((response) => response.json())
  .then((data) => console.log(data))
  .catch((error) => console.error(error));

// Menggunakan async/await
async function ambilData() {
  try {
    let response = await fetch("https://api.example.com/data");
    let data = await response.json();
    console.log(data);
  } catch (error) {
    console.error(error);
  }
}

10. Framework dan Library Populer

• Frontend: React, Vue.js, Angular, Svelte
• Backend: Express.js, NestJS, Koa, Fastify
• Mobile: React Native, Ionic, NativeScript
• Desktop: Electron, Tauri
• Testing: Jest, Mocha, Cypress
• Utility: Lodash, Moment.js (kini lebih disarankan date-fns)
• Visualisasi Data: D3.js, Chart.js, Three.js

11. Kesimpulan

JavaScript adalah bahasa pemrograman yang sangat penting dalam dunia pengembangan web dan telah berkembang menjadi bahasa serbaguna yang dapat digunakan di berbagai platform. Dengan sintaks yang relatif mudah, dukungan komunitas yang besar, dan ekosistem yang kaya, JavaScript menjadi pilihan utama bagi pemula maupun profesional.

Baik Anda ingin membuat website interaktif, aplikasi mobile, server, game, atau bahkan eksperimen AI, JavaScript menyediakan alat dan fleksibilitas yang Anda butuhkan. Mulailah belajar JavaScript hari ini, dan buka pintu menuju karir di dunia teknologi yang terus berkembang.