Panduan Belajar JavaScript

Selamat datang di panduan belajar JavaScript! Dokumen ini memberikan langkah-langkah dasar untuk memahami JavaScript.

Daftar Isi

Pengenalan JavaScript
Dasar-Dasar JavaScript
Manipulasi DOM
Asynchronous JavaScript
AJAX dan Fetch API
ES6 dan Fitur Terbaru
Proyek Mini
Referensi dan Sumber Belajar
Berkontribusi

1. Pengenalan JavaScript

JavaScript adalah bahasa pemrograman tingkat tinggi yang digunakan untuk membuat halaman web interaktif. ini adalah salah satu teknologi utama dalam pengembangan web

Definisi Singkat: JavaScript adalah bahasa pemrograman yang digunakan untuk membuat tampilan dinamis pada situs web dan berinteraksi dengan pengguna.

2. Dasar-Dasar JavaScript

2.1 Variabel dan Tipe Data

Variabel: Tempat penyimpanan nilai.
Tipe Data: String, Number, Boolean.

2.2 Struktur Kontrol

Kondisional: if, else.
Perulangan: for, while.

2.3 Fungsi

Definisi Fungsi: Mendefinisikan blok kode yang dapat dipanggil.
Parameter dan Argumen: Menangani input fungsi.

2.4 Array dan Objek

Array: Kumpulan nilai dalam urutan tertentu.
Objek: Kumpulan pasangan kunci-nilai.

2.5 Operator

Aritmetika: +, -, *, /, % (modulo).
Penugasan: =, +=, -=, *=, /=, %=.
Perbandingan: == === !=, !==, >, <, >=, <=.
Logika: && (AND), || (OR), ! (NOT).
Ternary: (condition) ? expression-if-true : expression-if-false.

2.6 Console

Log: console.log(), console.info(), console.warn(), console.error().
Interpolasi String: console.log(Hello, ${name}!).
Grouping: console.group(), console.groupEnd().
Timing: console.time(), console.timeEnd().

2.7 Nilai Khusus

Undefined: Variabel yang dideklarasikan tetapi tidak diinisialisasi.
Null: Variabel yang sengaja diberi nilai null.

2.8 Operator Ternary

Ternary Operator: Pengganti dari bentuk if-else yang sederhana.

2.9 Penggunaan 'var', 'let', dan 'const'

var: Variabel dengan skop fungsi.
let: Variabel dengan skop blok.
const: Variabel yang nilainya tetap (konstan).

2.10 Type Conversion

Implicit Conversion: Dilakukan oleh JavaScript secara otomatis.
Explicit Conversion: Melalui fungsi seperti Number(), String().

3. Manipulasi DOM

3.1 Pengenalan DOM

DOM (Document Object Model): Representasi struktur halaman web.
Node: Elemen dalam struktur DOM.

3.2 Memilih dan Manipulasi Element

Seleksi Elemen: getElementById, getElementsByClassName, querySelector.
Manipulasi Konten dan Atribut: InnerHTML, innerText, value.

3.3 Event Handling

Event Listener: Mendengarkan dan menanggapi interaksi pengguna.
Event Object: Mengakses informasi event.

4. Asynchronous JavaScript

4.1 Callback Functions

Callback: Fungsi yang dipassing sebagai argumen.

4.2 Promises

Promise: Representasi nilai yang mungkin akan tersedia di masa depan.
then() dan catch(): Menangani hasil atau error dari promise.

4.3 Async/Await

Async Function: Fungsi yang mengembalikan promise.
await: Menunggu hingga promise diselesaikan.

5. AJAX dan Fetch API

5.1 XMLHttpRequest

XMLHttpRequest: Objek untuk melakukan permintaan HTTP.

5.2 Fetch API

fetch(): Fungsi modern untuk permintaan HTTP.
Promise di Fetch: Menangani respons HTTP.

6. ES6 dan Fitur Terbaru

6.1 Let dan Const

let, const: Variabel dengan skop block.

6.2 Arrow Functions

Arrow Functions: Cara singkat mendefinisikan fungsi.

6.3 Destructuring

Destructuring Assignment: Menangani nilai array atau objek secara singkat.

6.4 Class dan Module

Class: Cara baru mendefinisikan konstruktor.
Module: Membagi kode ke dalam modul terpisah.

7. Proyek Mini

7.1 Membuat To-Do List

Manipulasi DOM: Menambah, menghapus, dan menyimpan tugas.
Local Storage: Menyimpan data secara lokal.

8. Referensi dan Sumber Belajar

9. Berkontribusi

Jika Anda menemui masalah atau memiliki saran, silakan berkontribusi pada rencana ini dengan melakukan fork repositori dan mengirim pull request.

Selamat belajar! 🚀

rezar2p / belajar-js Goto Github PK

belajar-js's Introduction