Lecture ini membahas Data Types (tipe data) di JavaScript, dan ini adalah kelanjutan langsung dari materi sebelumnya tentang variable.

Kalau sebelumnya kita belajar:

Variable = tempat untuk menyimpan suatu nilai

Sekarang pertanyaannya:

Nilai yang disimpan itu jenisnya apa?

Nah, itulah yang disebut data type.

1. Apa Itu Data Type?

Misalnya kita punya:

let name = "John";
let age = 25;
let isStudent = true;

Ketiga variable tersebut menyimpan nilai, tetapi jenis nilainya berbeda.

name       → "John"  → String
age        → 25      → Number
isStudent  → true    → Boolean

Jadi:

Data type adalah jenis atau kategori dari suatu nilai.

Analogi sederhananya seperti barang di rumah.

Kamu punya:

Kotak A → buku
Kotak B → sepatu
Kotak C → makanan

Sama-sama berada di dalam kotak, tetapi isi dan jenisnya berbeda.

Variable juga begitu:

variable → menyimpan nilai
data type → menjelaskan jenis nilai tersebut

2. Data Type Primitive di JavaScript

Lecture menyebut ada beberapa primitive data types.

Yang akan kita pelajari sekarang:

1. String
2. Number
3. Boolean
4. Null
5. Undefined

Kemudian nanti ada:

6. BigInt
7. Symbol

Selain primitive data types, JavaScript juga memiliki tipe non-primitive seperti:

• Object
• Array
• dan lain-lain

Untuk sekarang fokus dulu pada 5 tipe utama.

3. Gambaran Besarnya

Supaya tidak bingung, lihat peta berikut:

JavaScript Values
│
├── Primitive
│   │
│   ├── String
│   ├── Number
│   ├── Boolean
│   ├── Null
│   ├── Undefined
│   ├── BigInt
│   └── Symbol
│
└── Non-Primitive / Object
    ├── Object
    ├── Array
    └── ...

Untuk lecture ini:

String
Number
Boolean
Null
Undefined

adalah yang paling penting.

4. String

Kita mulai dari String.

Apa itu String?

String adalah data yang berupa teks atau rangkaian karakter.

Contoh:

let name = "John";

"John" adalah String.

Contoh lainnya:

let city = "Jakarta";
let message = "Hello World";
let country = "Indonesia";

Semuanya String.

5. String Harus Menggunakan Quotes

Ada beberapa cara untuk membuat String.

Double quotes

let name = "John";

Single quotes

let name = 'John';

Keduanya valid.

"John" → String
'John' → String

Tidak ada perbedaan fundamental antara single quote dan double quote dalam membuat String.

6. Backtick

Selain single dan double quotes, JavaScript juga menyediakan backtick:

let message = `Hello World`;

Perhatikan bahwa ini:

`

berbeda dengan:

'

dan:

"

Backtick biasanya ada di keyboard dekat tombol Esc, tergantung layout keyboard.

7. Kenapa Backtick Menarik?

Karena backtick memungkinkan kita memasukkan JavaScript expression ke dalam String.

Contoh:

let message = `Hello World`;

Normalnya hanya menghasilkan:

Hello World

Tetapi kita bisa melakukan:

let message = `Hello World ${2 + 3}`;

Hasilnya:

Hello World 5

Bagaimana bisa?

Karena:

${2 + 3}

akan dievaluasi oleh JavaScript.

8. Template Literal

Syntax:

${...}

di dalam backtick disebut bagian dari template literal.

Contoh:

let message = `The result is ${2 + 3}`;

JavaScript menghitung:

2 + 3

menjadi:

5

kemudian memasukkannya ke String.

Hasil:

The result is 5

9. Template Literal dengan Variable

Ini salah satu kegunaan paling penting.

Misalnya:

let name = "John";

let message = `Hello ${name}`;

Hasil:

Hello John

JavaScript mengambil isi variable:

name → "John"

kemudian memasukkannya ke dalam String.

10. Template Literal dengan Beberapa Variable

Misalnya:

let name = "John";
let age = 25;

let message = `My name is ${name} and I am ${age} years old.`;

console.log(message);

Output:

My name is John and I am 25 years old.

Ini sangat berguna ketika membuat pesan dinamis.

11. ${} Bisa Berisi Expression

Bukan hanya variable.

Kita juga bisa melakukan operasi:

let price = 100;
let quantity = 3;

let message = `Total: ${price * quantity}`;

Hasil:

Total: 300

Karena:

price * quantity

adalah expression.

Kita bahkan bisa:

let age = 20;

console.log(`Next year I will be ${age + 1}`);

Output:

Next year I will be 21

12. Kapan Menggunakan String?

String digunakan ketika kita ingin menyimpan teks.

Misalnya:

let username = "Budi";
let email = "budi@example.com";
let address = "Madiun";
let message = "Welcome!";

Semua nilai tersebut adalah String.

13. Character Tunggal Juga String

Ini perbedaan JavaScript dengan beberapa bahasa pemrograman lain.

Misalnya:

let letter = "A";

"A" hanya terdiri dari satu karakter.

Tetapi JavaScript tetap menganggapnya sebagai:

String

Tidak ada data type khusus bernama char untuk satu karakter seperti pada beberapa bahasa pemrograman lainnya.

Jadi:

let a = "A";
let b = "Hello";

keduanya adalah:

String

14. Number

Sekarang kita masuk ke Number.

Number digunakan untuk menyimpan angka.

Contoh:

let age = 28;

28 adalah Number.

Contoh lain:

let score = 100;
let year = 2026;
let temperature = 30;

Semuanya Number.

15. Integer dan Decimal Sama-sama Number

Ini konsep yang penting.

Di beberapa bahasa pemrograman terdapat tipe terpisah seperti:

integer
float
double

Tetapi dalam JavaScript, untuk penggunaan angka biasa, semuanya berada dalam tipe:

Number

Contoh:

let age = 28;

Number.

Dan:

let interestRate = 10.5;

juga Number.

Jadi:

28     → Number
10.5   → Number
-20    → Number
0      → Number
3.1415 → Number

16. Tidak Ada int dan float Terpisah untuk Number Biasa

Misalnya kamu menulis:

let x = 10;
let y = 10.5;

Keduanya:

x → Number
y → Number

Ini berbeda dari beberapa bahasa seperti C/C++ yang memiliki tipe angka berbeda.

17. Number Memiliki Nilai Khusus

Selain angka biasa seperti:

10
20
3.14
-5

JavaScript juga memiliki beberapa nilai khusus yang termasuk dalam tipe Number.

Di lecture ini diperkenalkan:

Infinity
-Infinity
NaN

Ini cukup penting.

18. Infinity

Infinity berarti tak hingga.

Contoh:

console.log(10 / 0);

Hasilnya:

Infinity

Dalam matematika, pembagian angka dengan nol tidak menghasilkan angka biasa.

JavaScript merepresentasikan hasil tersebut sebagai:

Infinity

19. Minus Infinity

Kalau angka negatif dibagi nol:

console.log(-10 / 0);

hasilnya:

-Infinity

Jadi:

10 / 0   → Infinity
-10 / 0  → -Infinity

20. Yang Menarik: Infinity Tetap Number

Ini mungkin sedikit mengejutkan.

Kita mungkin berpikir:

“Infinity bukan angka biasa, jadi pasti bukan Number.”

Tetapi di JavaScript:

typeof Infinity

menghasilkan:

"number"

Jadi:

Infinity

adalah nilai khusus yang termasuk dalam tipe Number.

21. NaN

Sekarang kita masuk ke salah satu konsep JavaScript yang paling sering membingungkan pemula:

NaN

NaN berarti:

Not a Number

atau:

Bukan angka.

Contoh:

console.log("Hello" / 10);

Kita mencoba melakukan operasi matematika terhadap teks.

Hasilnya:

NaN

22. Kenapa "Hello" / 10 Menghasilkan NaN?

Karena JavaScript mencoba melakukan:

"Hello" ÷ 10

Tetapi "Hello" bukan angka yang bisa digunakan untuk operasi pembagian.

Akibatnya JavaScript menghasilkan:

NaN

23. Tapi Ada Hal yang Aneh tentang NaN

Meskipun namanya:

Not a Number

secara data type:

typeof NaN

hasilnya:

"number"

Jadi:

NaN
 ↓
Number

Ini memang terasa aneh.

Tapi begitulah aturan JavaScript.

24. Contoh NaN Lain

let result = "hello" * 5;

console.log(result);

Hasil:

NaN

Atau:

let result = "hello" - 10;

Hasil:

NaN

Karena JavaScript tidak bisa melakukan operasi matematika tersebut dengan nilai yang diberikan.

25. JavaScript Cukup “Longgar” dalam Operasi Matematika

Ini salah satu karakteristik JavaScript yang perlu diperhatikan.

Pada beberapa bahasa pemrograman, operasi yang tidak valid bisa langsung menyebabkan exception/error.

JavaScript dalam beberapa kasus justru menghasilkan nilai khusus seperti:

Infinity
NaN

Contoh:

10 / 0

menghasilkan:

Infinity

Bukan langsung menghentikan program karena exception.

Sedangkan:

"Hello" / 10

menghasilkan:

NaN

26. Kenapa Ini Bisa Menjadi Masalah?

Karena program bisa saja terus berjalan dengan nilai yang salah.

Misalnya:

let price = "hello";

let total = price * 10;

console.log(total);

Hasil:

NaN

Kalau kita tidak menyadari bahwa price berisi String yang salah, bug bisa menyebar ke bagian program lain.

Misalnya:

let price = "hello";

let total = price * 10;

let tax = total * 0.1;

console.log(tax);

Bisa menjadi:

NaN

Jadi pemahaman data type sangat penting untuk debugging.

27. Boolean

Sekarang kita masuk ke Boolean.

Boolean hanya memiliki dua kemungkinan nilai:

true
false

Hanya itu.

Tidak ada:

maybe
unknown
perhaps

Untuk Boolean.

28. Contoh Boolean

let isStudent = true;

atau:

let isStudent = false;

Data type keduanya:

Boolean

29. Boolean Sangat Penting untuk Logic

Boolean biasanya digunakan ketika program perlu mengambil keputusan.

Misalnya:

let isLoggedIn = true;

Artinya user sudah login.

Atau:

let isAdmin = false;

Artinya user bukan admin.

Nanti Boolean akan sangat sering digunakan dalam:

if
else

condition dan berbagai operasi logic.

30. Boolean dari Perbandingan

Boolean tidak harus ditulis secara langsung.

Kita juga bisa mendapatkan Boolean dari comparison.

Misalnya:

10 > 15

Artinya:

Apakah 10 lebih besar dari 15?

Jawabannya:

false

Karena 10 memang tidak lebih besar dari 15.

31. Contoh Comparison

console.log(10 > 15);

Output:

false

Contoh:

console.log(20 > 10);

Output:

true

Contoh lainnya:

console.log(10 === 10);

Output:

true

Sedangkan:

console.log(10 === 20);

Output:

false

Jadi hasil dari comparison biasanya berupa:

true

atau:

false

yang berarti data type-nya adalah:

Boolean

32. Cara Berpikir Boolean

Anggap Boolean seperti pertanyaan YA/TIDAK.

Misalnya:

Apakah umur lebih dari 18?

age > 18

Jawabannya hanya:

true

atau:

false

Contoh:

let age = 20;

let isAdult = age >= 18;

Hasil:

isAdult → true

Karena 20 >= 18.

33. Null

Sekarang kita masuk ke null.

null digunakan untuk menunjukkan bahwa sebuah variable sengaja tidak memiliki nilai atau nilainya dianggap kosong/tidak ada.

Contoh:

let gender = null;

Artinya kurang lebih:

Untuk saat ini gender belum memiliki nilai.

Kita sengaja memasukkan:

null

34. Analogi null

Bayangkan sebuah formulir:

Nama     : Budi
Umur     : 20
Gender   : [belum diisi]

Kita bisa merepresentasikan kondisi tersebut dengan:

let gender = null;

Artinya:

Kita tahu variable gender ada, tetapi saat ini belum memiliki nilai yang diberikan.

35. null Berbeda dengan undefined

Ini sangat penting.

Keduanya sama-sama bisa terlihat seperti “tidak ada nilai”, tetapi maknanya berbeda.

null

Biasanya berarti:

Tidak ada nilai, dan kita sengaja menetapkannya demikian.

Contoh:

let selectedUser = null;

Kita secara sadar mengatakan:

Belum ada user yang dipilih.

undefined

Biasanya berarti:

Variable ada, tetapi belum diberikan nilai.

Contoh:

let selectedUser;

Kita tidak memberikan nilai apa pun.

Hasilnya:

selectedUser → undefined

36. Analogi null vs undefined

Bayangkan dua kotak.

Kotak pertama

Kotak A
┌─────────────┐
│     null    │
└─────────────┘

Artinya:

Saya sengaja mengatakan bahwa kotak ini kosong.

Kotak kedua

Kotak B
┌─────────────┐
│  undefined  │
└─────────────┘

Artinya:

Kotak ini belum diberikan nilai.

37. Undefined

Sekarang contoh:

let firstName;

Kita membuat variable tetapi tidak memberikan nilai.

Kalau:

console.log(firstName);

hasilnya:

undefined

Jadi JavaScript memberikan nilai default:

undefined

38. Kenapa undefined Muncul?

Contoh:

let username;

JavaScript tahu variable username ada.

Tetapi JavaScript bertanya:

“Nilainya apa?”

Tidak ada nilai yang diberikan.

Maka:

username → undefined

39. undefined Bisa Ditulis Manual, Tapi Tidak Disarankan

Secara teknis kita bisa:

let username = undefined;

Ini valid.

Tetapi lecture mengatakan bahwa cara tersebut tidak direkomendasikan untuk penggunaan normal.

Lebih baik:

let username;

jika memang ingin membiarkan variable belum memiliki nilai.

40. Perbedaan null dan undefined

Ini tabel yang sangat penting:

Cara mudah mengingat:

null
↓
"KOSONG, SAYA SENGAJA SET"

undefined
↓
"BELUM ADA NILAI"

41. Lima Data Type yang Perlu Kamu Kuasai

Sekarang kita rangkum.

String

Untuk teks:

let name = "John";

Number

Untuk angka:

let age = 25;
let price = 10.5;

Boolean

Untuk true/false:

let isLoggedIn = true;

Null

Untuk nilai kosong yang sengaja diberikan:

let selectedUser = null;

Undefined

Variable belum diberi nilai:

let username;

42. Visualisasi Lima Data Type

                    VALUE
                      │
       ┌──────────────┼──────────────┐
       │              │              │
    "John"           25            true
       │              │              │
    String          Number        Boolean
       
       │
      null
       │
      Null

       │
   undefined
       │
   Undefined

43. Contoh Lengkap

Coba perhatikan:

let name = "John";
let age = 25;
let isStudent = true;
let selectedUser = null;
let username;

Sekarang kita punya:

name          → "John"       → String
age           → 25           → Number
isStudent     → true          → Boolean
selectedUser  → null          → Null
username      → undefined     → Undefined

Ini adalah contoh sederhana dari lima tipe yang baru dipelajari.

44. Cara Mengecek Data Type

Di JavaScript kita bisa menggunakan:

typeof

Contoh:

let name = "John";

console.log(typeof name);

Output:

string

Contoh:

let age = 25;

console.log(typeof age);

Output:

number

Contoh:

let isStudent = true;

console.log(typeof isStudent);

Output:

boolean

Ini sangat berguna saat debugging.

45. Contoh typeof untuk Semua

let name = "John";
let age = 25;
let isStudent = true;
let user = null;
let username;

console.log(typeof name);
console.log(typeof age);
console.log(typeof isStudent);
console.log(typeof user);
console.log(typeof username);

Secara umum hasilnya:

string
number
boolean
object
undefined

Nah, kamu mungkin melihat sesuatu yang aneh:

typeof null

menghasilkan:

object

46. ⚠️ Keanehan JavaScript: typeof null

Ini adalah salah satu quirk/keanehan JavaScript yang terkenal.

Secara konsep:

null

adalah nilai null.

Tetapi:

typeof null

menghasilkan:

"object"

Bukan:

"null"

Ini merupakan perilaku historis JavaScript yang sudah terlanjur menjadi bagian dari bahasa.

Untuk sekarang cukup hafalkan:

typeof null // "object"

Jangan sampai kamu berpikir:

“Berarti null sebenarnya object?”

Tidak sesederhana itu.

Untuk pembelajaran dasar, anggap:

null = nilai primitive khusus

dan ingat bahwa typeof null memiliki hasil yang aneh.

47. Jangan Samakan NaN dengan Error

Ini juga penting.

Misalnya:

let result = "Hello" / 10;

Hasil:

NaN

Tetapi NaN sendiri merupakan sebuah value.

Bukan berarti JavaScript pasti menghentikan program.

Misalnya:

let x = "Hello" / 10;

console.log(x);
console.log("Program masih berjalan");

Kamu bisa mendapatkan:

NaN
Program masih berjalan

Jadi:

NaN ≠ JavaScript exception

Ini penting ketika nanti belajar debugging.

48. Hubungan Data Type dengan Variable

Ingat lecture sebelumnya:

let username = "John";

Kita belajar bahwa:

username

adalah variable.

Sekarang kita bisa menambahkan:

username → "John" → String

Contoh:

let age = 25;

berarti:

age → 25 → Number

Dan:

let isAdmin = false;

berarti:

isAdmin → false → Boolean

Jadi:

Variable adalah nama yang kita gunakan untuk mengakses nilai, sedangkan data type menjelaskan jenis nilai tersebut.

49. Perhatikan Ini: 25 vs "25"

Ini contoh yang sangat penting.

let age1 = 25;

adalah:

Number

Sedangkan:

let age2 = "25";

adalah:

String

Walaupun secara visual sama-sama terlihat 25.

Bedanya:

25
↓
angka

"25"
↓
teks

50. Kenapa Data Type Penting?

Karena JavaScript memperlakukan jenis nilai secara berbeda.

Misalnya:

console.log(10 + 20);

hasil:

30

Karena keduanya Number.

Tetapi:

console.log("10" + "20");

hasil:

1020

Karena keduanya String dan + dalam konteks tersebut melakukan penggabungan String.

Jadi memahami data type akan sangat penting ketika nanti kita belajar operators.

51. Contoh Perbandingan

let a = 10;
let b = 20;

console.log(a + b);

Hasil:

30

Sedangkan:

let a = "10";
let b = "20";

console.log(a + b);

Hasil:

1020

Kenapa?

Karena:

10 + 20
↓
30

sedangkan:

"10" + "20"
↓
"1020"

Ini salah satu alasan kenapa kita harus tahu tipe data yang sedang kita gunakan.

52. Bagaimana Boolean Bisa Terbentuk dari Expression?

Misalnya:

let age = 20;

let isAdult = age >= 18;

JavaScript mengevaluasi:

age >= 18

menjadi:

20 >= 18

Hasil:

true

Maka:

isAdult → true → Boolean

53. Alur Comparison

age = 20
   ↓
age >= 18
   ↓
20 >= 18
   ↓
true
   ↓
Boolean

Kalau:

let age = 15;

let isAdult = age >= 18;

maka:

15 >= 18
   ↓
false

Jadi:

isAdult → false → Boolean

54. Kesalahan Pemahaman yang Sering Terjadi

❌ “String harus selalu panjang.”

Tidak.

let letter = "A";

tetap String.

❌ “Decimal adalah float.”

Dalam JavaScript untuk penggunaan angka biasa:

10
10.5

keduanya:

Number

❌ “NaN bukan Number.”

Namanya memang Not a Number, tetapi:

typeof NaN

adalah:

"number"

❌ “null dan undefined sama.”

Tidak persis.

null       → sengaja dikosongkan
undefined  → belum diberi nilai

❌ “Boolean bisa berisi 1, 2, 3.”

Tidak.

Boolean hanya:

true
false

55. Cheat Sheet

Simpan bagian ini karena sangat berguna untuk mengingat.

Nilai khusus dalam Number:

Infinity
-Infinity
NaN

56. Cara Mengingat dengan Analogi

Bayangkan kamu punya lima jenis kotak.

📝 String

Kotak untuk tulisan:

"John"
"Hello"
"Indonesia"

🔢 Number

Kotak untuk angka:

10
25
3.14

✅ Boolean

Kotak untuk jawaban Ya/Tidak:

true
false

📦 Null

Kotak sengaja dikosongkan:

null

❓ Undefined

Kotak sudah ada tetapi belum diisi:

undefined

57. Hubungan dengan Materi Berikutnya

Sekarang posisi kita dalam pembelajaran adalah:

Variable
   ↓
Data Type
   ↓
Operators
   ↓
Functions
   ↓
Condition
   ↓
Loops
   ↓
Arrays / Objects
   ↓
dan seterusnya

Jadi data type bukan sekadar hafalan.

Nanti saat belajar operator, kamu akan sering bertanya:

“Ini String atau Number?”

Saat belajar condition:

“Ini menghasilkan Boolean atau tidak?”

Saat debugging:

“Kenapa hasilnya NaN?”

Semua itu kembali ke konsep data type.

🎯 Inti Lecture yang Wajib Dipahami

Kalau dari lecture panjang ini kamu hanya mengingat beberapa hal, pastikan ini:

1. Setiap value memiliki data type

let name = "John";  // String
let age = 25;       // Number
let active = true;  // Boolean

2. String adalah teks

Bisa menggunakan:

"Hello"
'Hello'
`Hello`

Backtick juga memungkinkan:

let name = "John";

let message = `Hello ${name}`;

3. Number mencakup angka integer dan decimal

let age = 25;
let price = 10.5;

keduanya Number.

Bahkan:

Infinity
-Infinity
NaN

juga termasuk Number.

4. Boolean hanya punya dua nilai

true
false

Dan comparison biasanya menghasilkan Boolean:

10 > 5
// true

5. null dan undefined berbeda

let a = null;

→ sengaja tidak ada nilai.

Sedangkan:

let b;

→ belum diberi nilai → undefined.

🧠 Satu kalimat untuk mengingat semuanya

Variable adalah wadah bernama, sedangkan data type memberi tahu kita jenis nilai yang ada di dalam wadah tersebut.

Contohnya:

const name = "Budi";       // String
let age = 20;              // Number
const isStudent = true;    // Boolean
let selectedUser = null;   // Null
let address;               // Undefined

Kalau kamu sudah benar-benar paham lima tipe ini, kamu sudah punya fondasi yang bagus untuk masuk ke materi operators, karena di sana kita akan melihat bagaimana JavaScript memperlakukan String, Number, dan Boolean ketika dilakukan berbagai operasi.