Tipe Data di TypeScript

Articles

Artikel ini menjelaskan tipe data dalam TypeScript.

YouTube Video

Tipe Data di TypeScript

TypeScript menyediakan berbagai jenis tipe data. Ini memungkinkan Anda untuk mendefinisikan tipe yang ketat untuk variabel, argumen fungsi, dan nilai pengembalian. Berikut adalah tipe data utama dan penggunaannya.

Tipe Primitif

Tipe number

1let age: number = 25;
2console.log(age);          // Outputs: 25
3console.log(typeof age);    // Outputs: number

number adalah tipe yang digunakan untuk menangani nilai numerik, termasuk bilangan bulat dan bilangan desimal (floating-point numbers). Mengelola nilai yang melebihi batas tertentu akan menghasilkan Infinity atau NaN (Not-a-Number).

1// Decimal calculations
2console.log(0.1 + 0.2 === 0.3); // false
3console.log(0.1 + 0.2); // 0.30000000000000004
4
5// Calculations with large numbers
6console.log(9007199254740991 + 1); // correct value
7console.log(9007199254740991 + 2); // incorrect value

Dalam TypeScript, angka direpresentasikan sebagai bilangan floating-point. Hal ini dapat menyebabkan sedikit ketidakakuratan dalam hasil perhitungan.
Ketika perhitungan presisi diperlukan, seperti untuk jumlah keuangan, penting untuk menghindari kesalahan pembulatan seperti ini. Sebagai contoh, Anda dapat menggunakan BigInt atau toFixed(), atau menyesuaikan tempat desimal dengan menggunakan pustaka seperti decimal.js.

Tipe string

Tipe string menangani data teks.

1let greeting: string = "Hello, TypeScript!";
2console.log(greeting);     // Outputs: Hello, TypeScript!
3console.log(typeof greeting);  // Outputs: string

boolean (Tipe Logis)

Tipe boolean memiliki dua nilai: true atau false.

1let isOpen: boolean = true;
2console.log(isOpen);       // Outputs: true
3console.log(typeof isOpen);    // Outputs: boolean

null dan undefined

null merepresentasikan 'nilai yang tidak ada', dan undefined merepresentasikan 'nilai yang tidak terdefinisi'.

1let emptyValue: null = null;
2let notDefined: undefined = undefined;
3
4console.log(emptyValue);       // Outputs: null
5console.log(typeof emptyValue);    // Outputs: object (JavaScript specification)
6
7console.log(notDefined);       // Outputs: undefined
8console.log(typeof notDefined);    // Outputs: undefined

Array

Dalam TypeScript, Anda dapat menentukan tipe elemen array. number[] adalah array dari angka, dan string[] adalah array dari string.

1let numbers: number[] = [1, 2, 3, 4];
2console.log(numbers);        // Outputs: [1, 2, 3, 4]
3console.log(typeof numbers); // Outputs: object
4
5let words: string[] = ["TypeScript", "JavaScript"];
6console.log(words);          // Outputs: ["TypeScript", "JavaScript"]
7console.log(typeof words);   // Outputs: object

Tuple

Tuple adalah array dengan elemen yang memiliki tipe berbeda.

1let person: [string, number] = ["Alice", 30];
2console.log(person);         // Outputs: ["Alice", 30]
3console.log(typeof person);  // Outputs: object

Enum

enum mendefinisikan sekumpulan konstanta bernama.

1enum Color {
2    Red,
3    Green,
4    Blue
5}
6
7let favoriteColor: Color = Color.Green;
8console.log(favoriteColor);  // Outputs: 1 (Defaults start from 0)
9console.log(typeof favoriteColor); // Outputs: number

any

Tipe any dapat menyimpan nilai dari tipe apapun dan digunakan ketika Anda ingin menonaktifkan pemeriksaan tipe.

1let anything: any = "Hello";
2console.log(anything);       // Outputs: Hello
3console.log(typeof anything);    // Outputs: string
4
5anything = 42;
6console.log(anything);       // Outputs: 42
7console.log(typeof anything);    // Outputs: number

Tipe Union

Dengan menggunakan tipe Union, Anda dapat mendefinisikan variabel yang dapat menyimpan salah satu dari beberapa tipe.

1let identifier: number | string = "ID_12345";
2console.log(identifier);     // Outputs: ID_12345
3console.log(typeof identifier);  // Outputs: string
4
5identifier = 12345;
6console.log(identifier);     // Outputs: 12345
7console.log(typeof identifier);  // Outputs: number

Ringkasan

number, string, boolean: Tipe primitif.
null, undefined: Nilai khusus.
Array: Sebuah array dengan anotasi tipe.
Tuple: Array dengan elemen dari berbagai tipe.
enum: Sebuah tipe enumerasi.
any: Tipe apa saja.
Union: Sebuah variabel yang dapat memiliki salah satu dari beberapa tipe.

Dengan menggunakan tipe data ini, TypeScript meningkatkan keamanan tipe, sehingga lebih mudah mencegah kesalahan selama pengembangan.

Objek Pembungkus

Wrapper Objects dalam TypeScript adalah objek yang secara otomatis dibuat untuk memperlakukan tipe data primitif sebagai objek. Tipe primitif memungkinkan operasi yang ringan dan cepat, sedangkan tipe objek memiliki metode dan properti, memungkinkan operasi yang lebih kaya.

Dalam JavaScript (dan TypeScript), ada objek pembungkus yang sesuai dengan tipe primitif seperti string, number, dan boolean. Objek-objek ini dibuat menggunakan fungsi konstruktor yang disebut String, Number, dan Boolean, masing-masing.

Berikut adalah contoh dari objek pembungkus.

Objek String

Objek String menyediakan properti dan metode untuk string.

1let strPrimitive: string = "Hello, World!";
2let strObject: String = new String("Hello, World!");
3
4console.log(strPrimitive);         // Outputs: Hello, World!
5console.log(typeof strPrimitive);  // Outputs: string
6
7console.log(strObject);            // Outputs: [String: 'Hello, World!']
8console.log(typeof strObject);     // Outputs: object

Fitur:

Berbeda dengan string primitif, objek String diperlakukan sebagai object oleh typeof.
Objek pembungkus berguna saat memanipulasi string atau memanggil metode pada string tersebut.

Objek Number

Objek Number menyediakan properti dan metode untuk angka.

1let numPrimitive: number = 42;
2let numObject: Number = new Number(42);
3
4console.log(numPrimitive);         // Outputs: 42
5console.log(typeof numPrimitive);  // Outputs: number
6
7console.log(numObject);            // Outputs: [Number: 42]
8console.log(typeof numObject);     // Outputs: object

Fitur:

Objek Number, sebagai pembungkus untuk angka, mencakup metode untuk operasi numerik (misalnya, toFixed).

Objek Boolean

Objek Boolean menyediakan properti dan metode untuk nilai boolean.

1let boolPrimitive: boolean = true;
2let boolObject: Boolean = new Boolean(true);
3
4console.log(boolPrimitive);        // Outputs: true
5console.log(typeof boolPrimitive); // Outputs: boolean
6
7console.log(boolObject);           // Outputs: [Boolean: true]
8console.log(typeof boolObject);    // Outputs: object

Fitur:

Objek Boolean adalah pembungkus untuk tipe boolean primitif dan diperlakukan sebagai object.

Perbedaan antara Objek Pembungkus dan Tipe Primitif

Karena objek pembungkus diperlakukan sebagai objek, ada sedikit penurunan kinerja, tetapi operasi yang lebih fungsional mungkin dilakukan berkat properti dan metode tambahan. Selain itu, ada perbedaan dalam perbandingan menggunakan == dan ===.

1let numPrimitive: number = 123;
2let numObject: Number = new Number(123);
3
4console.log('==  : ', numPrimitive == numObject);  // Outputs: true (Value comparison)
5console.log('=== : ', numPrimitive === numObject); // Outputs: false (Due to differing types)

Fitur:

== membandingkan nilai, sedangkan === membandingkan secara ketat termasuk tipenya. === akan mengembalikan false saat membandingkan objek pembungkus dengan tipe primitif.

Konversi Tipe

Dalam TypeScript, penting untuk mengelola konversi tipe implisit dan eksplisit dengan benar.

Konversi Tipe Implisit

Dalam TypeScript, konversi tipe implisit harus dihindari sebisa mungkin untuk menjamin keamanan tipe.

1const result: string = 5 + "5"; // "55" (the number is converted to a string)
2
3console.log(result);

Dalam contoh ini, angka 5 secara implisit dikonversi menjadi string, menghasilkan string "55".

Konversi Tipe Eksplisit

Dalam TypeScript, gunakan anotasi tipe atau fungsi konversi tipe untuk melakukan konversi tipe dengan aman.

1const num: string = "123";
2const convertedNum: number = Number(num); // Converts "123" to the number 123
3
4console.log(typeof num);
5console.log(typeof convertedNum);

Dalam contoh ini, fungsi Number() digunakan untuk secara eksplisit mengonversi string "123" menjadi angka 123.

Pemeriksaan Tipe

Dalam TypeScript, Anda dapat menggunakan operator typeof untuk memeriksa tipe data dari sebuah variabel.

 1// Output: The type of 42 is: number
 2console.log('The type of 42             is:', typeof 42);
 3
 4// Output: The type of 42 is: bigint
 5console.log('The type of 42n            is:', typeof 42n);
 6
 7// Output: The type of "hello" is: string
 8console.log('The type of "hello"        is:', typeof "hello");
 9
10// Output: The type of true is: boolean
11console.log('The type of true           is:', typeof true);
12
13// Output: The type of undefined is: undefined
14console.log('The type of undefined      is:', typeof undefined);
15
16// Output: The type of null is: object
17console.log('The type of null           is:', typeof null);
18
19// Output: The type of Symbol() is: symbol
20console.log('The type of Symbol()       is:', typeof Symbol());
21
22// Output: The type of {} is: object
23console.log('The type of {}             is:', typeof {});
24
25// Output: The type of function () {} is: function
26console.log('The type of function () {} is:', typeof function () {});

Dalam TypeScript, Anda dapat menggunakan typeof untuk memeriksa tipe, tetapi untuk pemeriksaan tipe yang lebih presisi, disarankan juga untuk menggunakan operator instanceof atau is.

Ringkasan

Objek Pembungkus dianggap sebagai objek karena mereka menyediakan metode dan properti tambahan untuk tipe primitif.
String, Number, dan Boolean adalah contoh representatif dari objek pembungkus.
Berbeda dengan tipe primitif, objek pembungkus diidentifikasi sebagai object oleh typeof.

Anda dapat mengikuti artikel di atas menggunakan Visual Studio Code di saluran YouTube kami. Silakan periksa juga saluran YouTube kami.

YouTube Video

Dasar-dasar TypeScript Operator di TypeScript