Ringkasan Belajar Javascript

JAVASCRIPT DASAR

Sebelum Belajar

  • HTML
  • CSS
Agenda

  • Pengenalan JavaScript
  • Tipe Data
  • Variable
  • Percabangan
  • Perulangan
  • Function
  • Dan lain-lain
Pengenalan Javascript
  • Sejarah Javascript
  • Javascript di Server
  • Javascript dan ECMAScript
  • Javascript vs Java
  • Peralatan Development
  • Browser
  • Text Editor atau IDE
Program Hello World
  • Membuat Kode JavaScript
  • Script JavaScript
  • Include Script JavaScript
  • Titik Koma
Komentar
  • Komentar
  • Kode: Komentar
Tipe Data Number
  • Tipe Data Number
  • Kode : Tipe Data Number
  • Number Notation
Tipe Data Boolean
  • Tipe Data Boolean
  • Kode : Tipe Data Boolean
Tipe Data String
  • Tipe Data String
  • Kode : Tipe Data String
  • Menambah String
  • Kode : Menambah String
  • Escape Sequence
  • Kode : 
  • Escape Sequence
Variable
  • Kode Tanpa Variable
  • Variable
  • Kode : Variable
  • Mengubah Value di Variable
  • Kode : Mengubah Value di Variable
  • Membuat Variable Langsung Dengan Value
  • Kode : Variable dan Value
  • Mengakses Variable
  • Kode : Mengakses Variable
  • Kata Kunci let dan const
  • Kode : Variable let
  • Kata Kunci const
  • Kode : Variable const
Operator Matematika
  • Operator Matematika
  • Operator Aritmatika
  • Kode : Operator Aritmatika
  • Operator Augmented Assignments
  • Kode : Operator Augmented Assignments
  • Operator Unary
  • Kode : Operator Unary
Operator Perbandingan
  • Operator Perbandingan
  • Kode : Operator Perbandingan
Operator Logika
  • Operator Logika
  • Operator &&
  • Operator ||
  • Operator Unary !
  • Kode : Operator Logika
Console
  • Console
  • Console Method
  • Kode : Console
  • Inspect Element di Google Chrome
String Template
  • String Template
  • Kode : String Template
  • Kode : Mengambil Variable
  • Kode : Expression di String Template
  • Multiline String
  • Kode : 
  • Multiline String
Konversi String dan Number
  • Konversi String dan Number
  • Kode : Masalah Tanpa Konversi
  • Melakukan Konversi String dan Number
  • Kode : Konversi String ke Number
  • NaN (Not a Number)
  • Kode : NaN
  • Kode : Operasi Pada NaN
  • isNaN() Function
Tipe Data Array
  • Tipe Data Array
  • Diagram Array
  • Kode : Membuat Array
  • Cara Kerja Array
  • Kode : Menambah Array
  • Operasi di Array
  • Kode : Operasi di Array
  • Perlu Diingat
Tipe Data Object
  • Associative Array
  • Tipe Data Object
  • Kode : Membuat Object Kosong
  • Kode : Mengubah Property di Object
  • Kode : Membuat Object dengan Properties
  • Kode : Mengakses Property Object
If Expression
  • If Expression
  • Kode : If Expression
  • Else Expression
  • Kode : Else Expression
  • Else If Expression
  • Kode : Else If Expression
Popup
  • Alert, Prompt dan Confirm
  • Kode : Alert
  • Hasil Alert
  • Kode : Prompt
  • Hasil Prompt
  • Kode : Confirm
  • Hasil Confirm
undefined
  • undefined
  • Kode : Undefined Variable
  • Kode : Undefined Array Value
  • Kode : Undefined Object Property
Null
  • Null
  • Kode : Null dan Undefined
Switch Expression
  • Switch Statement
  • Kode : Switch Statement
Operator typeof
  • Operator typeof
  • Kode : Operator typeof
In Operator
  • In Operator
  • Kode : In Operator
  • Peringatan!
  • Kode : In Operator Undefined/Null Property
Ternary Operator
  • Ternary Operator
  • Kode : Tanpa Ternary Operator
  • Kode : Dengan Ternary Operator
Nullish Coalescing Operator
  • Nullish Coalescing Operator
  • Kode : Tanpa Nullish Coalescing Operator
  • Kode : Nullish Coalescing Operator
Optional Chaining
  • Optional Chaining
  • Kode : Error Mengakses Property Nullish
  • Error Mengakses Property Nullish
  • Kode : Pengecekan Menggunakan If
  • Kode : Menggunakan Optional Chaining
Falsy dan Truthy
  • Falsy
  • Data Falsy
  • Truthy
  • Kode : Falsy dan Truthy
Operator Logika di Non Boolean
  • Operator Logika di Non Boolean
  • Operator OR (||) di Non Boolean
  • Kode : Operator OR (||)
  • Operator AND (&&) di Non Boolean
  • Kode : Operator AND (&&)
For Loop
  • For Loop
  • Sintak Perulangan For
  • Kode : Perulangan Tanpa Henti
  • Kode : Perulangan Dengan Kondisi
  • Kode : Perulangan Dengan Init Statement
  • Kode : Perulangan Dengan Post Statement
While Loop
  • While Loop
  • Kode : While Loop
Do While Loop
  • Do While Loop
  • Kode : Do While Loop
Break dan Continue
  • Break & Continue
  • Kode : Break
  • Kode : Continue
Label
  • Label
  • Kode : Label
  • Kode : Continue atau Break di Label
For In
  • For In
  • Kode : For In di Object
  • Kode : For In di Array
For Of
  • For Of
  • Kode : For Of di Array
  • Kode : For Of di String
With Statement
  • With Statement
  • Kode : Tanpa With Statement
  • Kode : Dengan With Statement
  • With Statement Tidak Direkomendasikan
  • Kode : Ambigu di With Statement
Function
  • Function
  • Kode : Function
Function Parameter
  • Function Parameter
  • Kode : Function Parameter
Function Return Value
  • Function Return Value
  • Kode : Function Return Value
  • Kode : Function Return Value Lebih Dari Satu
  • Menghentikan Eksekusi dengan Return
  • Kode : Menghentikan Eksekusi dengan Return
Optional Parameter
  • Optional Parameter
  • Kode : Optional Parameter
Default Parameter
  • Default Parameter
  • Kode : Default Parameter
Rest Parameter
  • Rest Parameter
  • Kode : Rest Parameter
  • Spread Syntax
  • Kode : Spread Syntax di Rest Parameter
  • Arguments Object
  • Kode : Arguments Object
Function Sebagai Value
  • Function Sebagai Value
  • Kode : Function di Variable
  • Kode : Function di Parameter
Anonymous Function
  • Anonymous Function
  • Kode : Anonymous Function di Variable
  • Kode : Anonymous Function di Parameter
Function dalam Function
  • Function dalam Function
  • Kode : Function dalam Function
Scope
  • Scope
  • Kode : Global Scope 
  • Kode : Local Scope 
  • Kode : Nested Function Scope
Recursive Function
  • Recursive Function
  • Kode : Factorial Loop
  • Kode : Factorial Recursive
Function Generator
  • Function Generator
  • Kode : Function Generator Sederhana
  • Kode : Function Generator Kompleks
  • Lazy Evaluation
  • Kode : Lazy Generator
Arrow Function
  • Arrow Function
  • Kode : Membuat Arrow Function
  • Arrow Function Tanpa Block
  • Kode : Arrow Function Tanpa Block
  • Arrow Function Return Value
  • Kode : Arrow Function Return Value
  • Arrow Function Tanpa Kurung Parameter
  • Kode : Arrow Function Tanpa Kurung Parameter
  • Arrow Function Sebagai Parameter
  • Kode : Arrow Function Sebagai Parameter
Closure
  • Closure
  • Kode : Closure
Object Method
  • Object Method
  • Kode : Membuat Object dengan Method
  • Kode : Menambah Method ke Object
Kata Kunci this
  • Kata Kunci this
  • Kode : this di Global Scope
  • Kode : this di Function
  • Kode : this di Object Method
Arrow Function di Object
  • Arrow Function di Object
  • Kode : Arrow Function di Object Method
  • Kode : this di Arrow Function Object
Getter dan Setter
  • Getter dan Setter
  • Kode : Getter
  • Kode : Setter
Masalah Variable var
  • Masalah Variable var
  • Kode : Menggunakan let
  • Kode : Menggunakan var
Destructuring
  • Destructuring
  • Kode : Mengambil Data di Array
  • Kode : Destructuring Array
  • Kode : Mengambil Data di Object
  • Kode : Destructuring Object
  • Kode : Destructuring Nested Object
  • Destructuring Function Parameter
  • Kode : Destructuring di Function Parameter
  • Default Value
  • Kode : Default Value Destructuring Array
  • Kode : Default Value Destructuring Object
  • Menggunakan Nama Variable Lain
  • Kode : Menggunakan Nama Variable Lain
Strict Mode
  • Strict Mode
  • Cara Menyalakan Strict Mode
  • Kode : Strict Mode
Debugger
  • Debugger
  • Kode : Debugger
Materi Selanjutnya
  • JavaScript Object Oriented Programming
  • JavaScript Modules
  • JavaScript Document Object Model
  • JavaScript Async
  • JavaScript Web API
----------------------------------------------------------------------------------------------
JAVASCRIPT OOP

Sebelum Belajar
  • HTML
  • CSS
  • JavaScript Dasar
Agenda
  • Pengenalan Object Oriented Programming
  • Class
  • Object
  • Inheritance 
  • Iterable dan Iterators
  • Standard JavaScript Classes
  • Dan lain-lain
Pengenalan Object Oriented Programming
  • Apa itu Object Oriented Programming?
  • Apa itu Object?
  • Apa itu Class?
  • Diagram Class dan Object : Person
  • Diagram Class dan Object : Car
  • OOP di JavaScript
Membuat Constructor Function
  • Membuat Object
  • Kode : Membuat Object dengan Object
  • Membuat Constructor Function
  • Kode : Constructor Function
  • Membuat Object dari Constructor Function
  • Kode : Membuat Object 
Property di Constructor Function
  • Property di Constructor Function
  • Kode : Property di Constructor Function
Method di Constructor Function
  • Method di Constructor Function
  • Kode : Method di Constructor Function
Parameter di Constructor Function
  • Parameter di Constructor Function
  • Kode : Parameter di Constructor Function
Constructor Inheritance
  • Constructor Inheritance
  • Kode : Constructor Inheritance
Prototype
  • Prototype
  • Prototype Inheritance
  • Kode : Object Instance
  • Console : Object Instance
  • Diagram Prototype
  • Console : Object Instance Inheritance
  • Menambah Property ke Prototype
  • Kode : Menambah Property ke Instance Object
  • Kode : Menambahkan Property ke Prototype
  • Cara Kerja Prototype Inheritance
  • Console : Prototype Inheritance
Prototype Inheritance
  • Prototype Inheritance
  • Kode : Prototype Inheritance Salah
  • Diagram : Prototype Inheritance Salah
  • Kode : Prototype Inheritance Benar
  • Diagram : Prototype Inheritance Benar
Kata Kunci Class
  • Membuat Class
  • Kode : Membuat Class
Constructor di Class
  • Constructor di Class
  • Kode : Constructor di Class
Property di Class
  • Property di Class
  • Kode : Property di Class
Method di Class
  • Method di Class
  • Kode : Method di Class
  • Console : Method di Prototype
Class Inheritance
  • Class Inheritance
  • Kode : Class Inheritance 
  • Console : Class Inheritance
Super Constructor
  • Super Constructor
  • Kode : Super Constructor
Super Method
  • Super Method
  • Kode : Super Method
Getter dan Setter di Class
  • Getter dan Setter di Class
  • Kode : Getter dan Setter
Public Class Field
  • Class Field
  • Public Class Field
  • Kode : Public Class Field
  • Kode : Public Class Field dan Constructor
Private Class Field
  • Private Class Field
  • Kode : Private Class Field
Private Method
  • Private Method
  • Kode : Private Method
Operator instanceof
  • Operator instanceof
  • Kode : Operator instanceof
  • Operator instanceof di Class Inheritance
  • Kode : Operator instanceof di Inheritance
Static Class Field
  • Kata Kunci static
  • Static Class Field
  • Kode : Static Class Field
  • Kode : Mengakses Static Class Field
Static Method
  • Static Method
  • Kode : Static Method
Error
  • Error
  • Throw Error
  • Kode : Throw Error
  • Console : Throw Error
Error Handling
  • Error Handling
  • Kode : Error Handling
  • Kata Kunci finally
  • Kode : Kata Kunci finally
  • Try Finally
  • Kode : Try Finally
Membuat Class Error Manual
  • Membuat Class Error Manual
  • Kode : Class ValidationError 
  • Kode : Menggunakan ValidationError
  • Kode : Try Catch 
Iterable dan Iterator
  • Iterable dan Iterator
  • Kode : Kontrak Iterable (dalam TypeScript)
  • Kode : Kontrak Iterator (dalam TypeScript)
  • Kontrak : IteratorResult (dalam TypeScript)
  • Cara Kerja Iterable dan Iterator
  • Kode : Membuat Counter Iterator Result
  • Kode : Membuat Counter Iterator
  • Kode : Membuat Counter Iterable
  • Kode : Menggunakan Counter Iterable
Materi Selanjutnya
  • JavaScript Standard Library
  • JavaScript Modules
  • JavaScript Document Object Model
  • JavaScript Async
  • JavaScript Web API
------------------------------------------------------------------------------------------------
JAVASCRIPT STANDARD LIBRARY

Sebelum Belajar
  • HTML
  • CSS
  • JavaScript Dasar
  • JavaScript Object Oriented Programming
Agenda
  • Number 
  • String 
  • Array 
  • Object 
  • JSON 
  • Dan lain-lain
Number
  • Number
  • Kode : Number
  • Number Static Properties
  • Kode : Number Static Properties
  • Number Static Method
  • Kode : Number Static Method
  • Number Instance Method
  • Kode : Number Instance Method
String
  • String
  • String Instance Method dan Properties
  • Kode : String Instance Method dan Properties
Array
  • Array
  • Array Loop
  • Kode : Array Loop
  • Array Queue
  • Kode : Array Queue
  • Array Stack
  • Kode : Array Stack
  • Array Search
  • Kode : Array Search
  • Array Filter
  • Kode : Array Filter
  • Array Transform
  • Kode : Array Transform
  • Dan Function lain-lain
Object
  • Object
  • Object Freeze & Seal
  • Kode : Object Freeze
  • Object Assign
  • Kode : Object Assign
  • Object Property Name & Value
  • Kode : Object Property Name & Value
  • Dan Function Lain-Lain
JSON
  • Pengenalan JSON
  • JSON
  • Kode : JSON
BigInt
  • BigInt
  • Kode : BigInt
Date
  • Date
  • Membuat Object Date
  • Kode : Membuat Object Date
  • Epoch & Unix Timestamp
  • Kode : Unix Timestamp
  • Parsing Date
  • Format Date
  • Kode : Parsing Date
  • Date Getter dan Setter
  • Kode : Date Getter dan Setter
Math
  • Math
  • Kode : Math
Boolean
  • Boolean
  • Kode : Boolean
Map
  • Map
  • Perbedaan Map dan Object
  • Map Instance Method & Property
  • Kode : Map
Set
  • Set
  • Set Instance Method & Property
  • Kode : Set
Symbol
  • Symbol
  • Kode : Symbol
  • Symbol For
  • Kode : Symbol For
RegExp
  • RegExp
  • Membuat RegExp
  • RegExp Instance Method
  • Kode : RegExp Instance Method
  • RegExp Modifier
  • Kode : RegExp Modifier
  • Fitur RegExp Lainnya
  • Kode : Contoh Fitur RegExp
  • Regular Expression di String
  • Kode : Regular Expression di String
Proxy
  • Proxy
  • Proxy Handler
  • Kode : Membuat Handler
  • Kode : Membuat Proxy
  • Proxy dan Handler
  • Kode : Log Handler
Reflect
  • Reflect
  • Kode : Reflect
Encode
  • Encode
  • Contoh Masalah Jika Tidak Menggunakan Encode
  • Encode Function
  • Kode : encodeURI dan decodeURI
  • Kode : encodeURIComponent dan decodeURICompoentn
Base64
  • Base64
  • Base64 Function
  • Kode : Base64
Eval
  • Eval
  • Kode : Eval
Materi Selanjutnya
  • JavaScript Modules
  • JavaScript Document Object Model
  • JavaScript Async
  • JavaScript Web API
-----------------------------------------------------------------------------------------
JAVASCRIPT MODULES

Sebelum Belajar
  • HTTP
  • JavaScript Dasar
  • JavaScript Object Oriented Programming
  • JavaScript Standard Library
Agenda
  • Pengenalan JavaScript Module
  • Live Server
  • Tanpa Module vs Dengan Module
  • Export dan Import
  • Alias
  • Export Default
  • Module Object
  • Dan lain-lain
Pengenalan JavaScript  Modules
  • Latar Belakang
  • JavaScript Modules
  • Import dan Export
Membuat Project
  • Membuat Project
Live Server
  • Live Server
  • Visual Studio Code
  • JetBrains IDE
Tanpa Module
  • Tanpa Module
  • Kode : JavaScript Library
  • Kode : Menggunakan Library
  • Dengan Module
Membuat Module
  • Membuat Module
  • File .js dan .mjs
  • Kode : JavaScript Module
  • Kode : Load JavaScript Module
  • Hasil JavaScript Module
  • Kenapa Error?
Export
  • Export
  • Kode : Export Module
Import
  • Import
  • Kode : Import Module
Variable di Module
  • Variable di Module
  • Kode : Variable di Module
  • Kode : Menggunakan Variable Module
  • Export Variable di Module
  • Kode : Import Variable
Class di Module
  • Class di Module
  • Kode : Export Class di Module
  • Kode : Menggunakan Class di Module
Export Multiple
  • Export Multiple
  • Kode : Export Multiple
Alias
  • Alias
  • Alias di Export
  • Kode : Alias di Export
  • Alias di Import
  • Kode : Alias di Import
Export Default
  • Export Default
  • Cara Export Default
  • Cara Import Default
  • Kode : Export Default Function
  • Kode : Import Default Function
  • Kode : Export Default Variable
  • Kode : Import Default Variable
  • Kode : Export Default Class
  • Kode : Import Default Class
  • Default dan Named Export
  • Kode : Export Default dan Named 
  • Kode : Import Default dan Named
  • Rekomendasi
Module Object
  • Module Object
  • Kode : Contoh Module
  • Kode : Module Object
Aggregating Modules
  • Aggregating Modules
  • Kode : Aggregate Module
  • Kode : Import Aggregate Module
Dynamic Module Loading
  • Dynamic Module Loading
  • Kode : Module
  • Kode : Dynamic Module
Materi Selanjutnya
  • JavaScript Document Object Model
  • JavaScript Async
  • JavaScript Decorator
---------------------------------------------------------------------------------------
JAVASCRIPT DOM

Sebelum Belajar
  • JavaScript Dasar
  • JavaScript Object Oriented Programming
  • JavaScript Standard Library
  • JavaScript Modules
Agenda
  • Pengenalan Document Object Model
  • Document
  • Node
  • Element
  • Attr
  • Event
  • Event Handler
  • Dan lain-lain
Pengenalan Document Object Model
  • Pengenalan DOM
  • Diagram DOM
  • DOM dan JavaScript
Membuat Project
  • Membuat Project
Tipe Data
  • Tipe Data
Document
  • Document
  • document Object
  • Kode : Document
  • Document Property
  • Kode : Document Property
  • Document Method
  • Kode : Document Method
Node
  • Node
  • Kode : Node
  • Node Property
  • Kode : Node Property
  • Node Method
  • Kode : Node Method
Element
  • Element
  • Kode : Element
  • Element Property
  • Kode : Element Property
  • Element Method
  • Kode : Element Method
  • Membuat Element
  • Kode : Membuat Element
NodeList
  • NodeList
  • Kode : NodeList
  • Live vs Static NodeList
  • Kode : NodeList Live
  • Kode : NodeList Static
Attr
  • Attr
  • Kode : Attr
  • Attr Value
  • Kode : Attr Value
  • Membuat Attr
  • Kode: Membuat Attr
NamedNodeMap
  • NamedNodeMap
  • Kode: NamedNodeMap
Text Node
  • Text Node
  • Kode: Text Node
  • Membuat Text Node
  • Kode: Membuat Text Node
Event Handler
  • Event Handler
  • Event Target
  • Kode : Event Listener
  • Global Event Handler
  • Kode : Global Event Handler
Event
  • Jenis Event
  • Event
  • Kode : Event
Style
  • Style
  • Nama Style
  • Kode : Style
InnerText dan InnerHTML
  • Text Content dan Inner Text
  • Kode : Text Content dan Inner Text
  • Inner HTML
  • Kode : Inner HTML
  • Mengubah Element dengan Inner HTML
  • Kode : Mengubah Element dengan Inner HTML
Window
  • Window
  • Kode: Window
Query Selector
  • Query Selector
  • Pola Query Selector
  • Universal Selector
  • Kode : Universal Selector
  • Type Selector
  • Kode : Type Selector
  • Class Selector
  • Kode : Class Selector
  • ID Selector
  • Kode : ID Selector
  • Attribute Selector
  • Kode: Attribute Selector
  • Operator di Attribute Selector
  • Kode : Operator Attribute Selector
  • Dan Selector Lainnya
Node Type
  • Node Type
  • Kode : Node Type
HTML Element
  • HTML Element
  • Kode : HTML Element
HTML Form Element
  • HTML Form Element
  • Kode : HTML Form Element
  • Kode : HTML Form Element JavaScript
  • Akses Form Via Name
  • Kode : HTML Form Element JavaScript
HTML Table Element
  • HTML Table Element
  • Kode : HTML Table Element
  • Kode : HTML Table Element JavaScript
HTML Element Lainnya
  • HTML Element Lainnya
Materi Selanjutnya
  • JavaScript Async
  • JavaScript Decorator
  • JavaScript Web API
---------------------------------------------------------------------------------------
JAVASCRIPT ASYNC

Sebelum Belajar
  • JavaScript Dasar
  • JavaScript Object Oriented Programming
  • JavaScript Modules
  • JavaScript Document Object Model
  • Belajar HTTP
Agenda
  • Pengenalan Asynchronous
  • Callback
  • AJAX
  • Promise
  • Fetch API
  • Async Await
  • Web Worker
Pengenalan Asynchronous
  • Apa itu Synchronous?
  • Contoh Synchronous 
  • Apa itu Asynchronous?
  • Contoh Asynchronous
Callback
  • Apa itu Callback?
  • Async Method
  • Kode : setTimeout
  • Kode : setInterval
AJAX
  • Apa itu AJAX?
  • Cara Kerja AJAX
  • Kode : Membuat AJAX
Menerima Data di AJAX
  • Menerima Data di AJAX
  • Kode : Menerima Data di AJAX
Response Status di AJAX
  • Response Status
  • Response Status di AJAX
State di AJAX
  • State di AJAX
  • Daftar State
  • Ready State Change Event
  • Kode : Ready State Change Event
Hookbin
  • Hookbin
  • Alternative Lain
Mengirim Data dengan AJAX
  • Mengirim Data dengan AJAX
  • Kode : Web Form
  • Kode : Mengirim Data dengan AJAX
URL Search Param
  • URL Search Param
  • Kode : URL Search Param
Form Data dengan AJAX
  • Form Data dengan AJAX
  • Kode : Form Data dengan AJAX
Upload File dengan AJAX
  • Upload File dengan AJAX
  • Kode : Upload File dengan AJAX
Promise
  • Apa itu Promise?
  • Masalah dengan Callback
  • Promise State
  • Kode : Membuat Promise
  • Kode : AJAX dengan Promise
Promise Method
  • Promise Method
  • Kode : Promise Method
  • Promise Static Method
  • Kode : Get Product Function
  • Kode : Promise Static Method
Fetch API
  • Fetch API
  • Request
  • Kode : Membuat Request
  • Kode : Menggunakan Fetch API
  • Kode : Fetch API Tanpa Object Request
  • Response
  • Kode : Menggunakan Response
Async Await
  • Async Await
  • Async
  • Kode : Async
  • Await
  • Kode : Await
  • Error Handler di Async Await
  • Kode : Try Catch
Web Worker
  • Thread di JavaScript
  • Kode : Proses Lambat
  • Web Worker
  • Diagram Web Worker
  • Worker
  • Kode : Membuat Worker
  • Kode : File Worker
Materi Selanjutnya
SELESAI