TypeScript - Tipe Any: Peralatan Serbaguna dari Tipe

Hai teman-teman, bakal bintang coding! Hari ini, kita akan melihat salah satu fitur paling multifungsi (dan kadang-kadang kontroversial) di TypeScript: tipe any. Siapkan sabuk pengaman, karena kita akan mengemban perjalanan yang akan membuat Anda berkata, "Any-thing is possible!" (Maaf, saya tidak bisa menahan untuk membuat permainan kata tentang tipe!)

TypeScript - Any

Apa Itu Tipe Any?

Sebelum kita masuk ke dalam, bayangkan Anda di acara makan malam potluck. Anda membawa makanan, tapi Anda tidak yakin apa yang lainnya membawa. Itu seperti tipe any di TypeScript - itu bisa menampung nilai jenis apa pun, sama seperti piring Anda di potluck bisa menampung makanan apa pun!

Dapat mewakili nilai apa pun

Tipe any seperti apa yang namanya - itu dapat mewakili nilai apa pun di TypeScript. Itu seperti selembar kartu joker yang mengatakan, "Hai TypeScript, saya bisa menjadi apa saja yang saya inginkan!"

mari lihat beberapa contoh:

let myVariable: any = 42;
console.log(myVariable); // Output: 42

myVariable = "Hello, World!";
console.log(myVariable); // Output: Hello, World!

myVariable = true;
console.log(myVariable); // Output: true

myVariable = [1, 2, 3];
console.log(myVariable); // Output: [1, 2, 3]

Dalam contoh ini, kita mendeklarasikan myVariable sebagai tipe any. Kemudian kita memberikan nilai jenis yang berbeda kepadanya - sebuah angka, string, boolean, dan array. TypeScript tidak mengeluh karena any bisa, well, apa saja!

Parameter Fungsi Tipe any

Sekarang, katakanlah Anda membuat fungsi yang harus sangat fleksibel. Anda inginnya menerima parameter jenis apa pun. Itu di mana any berguna!

function printAnything(arg: any): void {
console.log(arg);
}

printAnything(42);          // Output: 42
printAnything("TypeScript"); // Output: TypeScript
printAnything([1, 2, 3]);    // Output: [1, 2, 3]

Dalam contoh ini, fungsi printAnything kita dapat menerima argumen jenis apa pun. Itu seperti seorang bouncer ramah di klub yang membolehkan semua orang masuk!

Objek Tipe any

kadang-kadang, Anda mungkin ingin membuat objek yang dapat memiliki properti jenis apa pun. mari buat sebuah tas magis yang dapat menampung apa saja:

let magicalBag: { [key: string]: any } = {};

magicalBag.book = "Harry Potter";
magicalBag.wand = { wood: "Holly", core: "Phoenix feather" };
magicalBag.spells = ["Expelliarmus", "Lumos", "Accio"];

console.log(magicalBag);
// Output:
// {
//   book: "Harry Potter",
//   wand: { wood: "Holly", core: "Phoenix feather" },
//   spells: ["Expelliarmus", "Lumos", "Accio"]
// }

Di sini, magicalBag adalah objek yang dapat memiliki sejumlah properti apa pun, masing-masing dapat memiliki jenis apa pun. Itu seperti tas Mary Poppins - itu dapat menampung apa saja!

Mengapa Menggunakan Tipe any?

Anda mungkin bertanya-tanya, "Jika TypeScript tentang tipe, mengapa kita ingin menggunakan any?" Pertanyaan bagus! Berikut beberapa konteks di mana any dapat berguna:

  1. Ketika bekerja dengan konten dinamis (seperti data dari API)
  2. Ketika secara perlahan mengubah proyek JavaScript menjadi TypeScript
  3. Ketika berurusan dengan pustaka pihak ketiga yang tidak memiliki definisi tipe

mari lihat contoh penggunaan konten dinamis:

async function fetchUserData(userId: number): Promise<any> {
const response = await fetch(`https://api.example.com/users/${userId}`);
const userData = await response.json();
return userData; // Kita tidak tahu struktur tepat dari userData, jadi kita gunakan 'any'
}

// Penggunaan
fetchUserData(123).then(user => {
console.log(user.name);  // TypeScript tidak akan mengeluh, bahkan jika 'name' tidak ada
});

Dalam kasus ini, kita tidak yakin tentang struktur data yang kita terima, jadi kita gunakan any untuk mengatakan ke TypeScript, "Perhatikan, saya tahu apa yang saya lakukan!"

Asersi Tipe

kadang-kadang, Anda mungkin tahu lebih banyak tentang jenis nilai daripada TypeScript. Itu di mana asersi tipe berguna. Itu seperti mengatakan ke TypeScript, "Saya tahu Anda berpikir ini adalah any, tapi percayalah, ini sebenarnya jenis tertentu."

mari lihat bagaimana Anda bisa menggunakan asersi tipe:

let someValue: any = "Hello, TypeScript!";
let strLength: number = (someValue as string).length;

console.log(strLength); // Output: 20

Dalam contoh ini, kita mengatakan ke TypeScript, "Hey, saya tahu someValue adalah jenis any, tapi saya yakin ini sebenarnya jenis string. Jadi biarkan saya menggunakannya sebagai string."

Peringatan: Dengan Kuasa yang Besar, datang Tanggung Jawab yang Besar

Meskipun any sangat kuat, itu seharusnya digunakan secara hati-hati. Ingat, keuntungan utama TypeScript adalah pemeriksaan tipe. Dengan menggunakan any, Anda secara esensi mengatakan ke TypeScript untuk mematikan pemeriksaan tipe untuk variabel itu.

Berikut contoh bagaimana any dapat menyebabkan kesalahan saat berjalan:

let num: any = "42";
console.log(num.toFixed(2)); // Ini akan menyebabkan kesalahan saat berjalan!

TypeScript tidak akan mengeluh tentang kode ini, tapi itu akan melempar kesalahan saat Anda menjalankan itu karena string tidak memiliki metode toFixed.

Any vs. Unknown: Alternatif Lebih Aman

TypeScript 3.0 memperkenalkan tipe unknown, yang adalah lawan tipe aman dari any. Sementara any membolehkan Anda melakukan apa saja tanpa pemeriksaan, unknown memaksa pemeriksaan tipe.

mari bandingkan any dan unknown:

let anyVar: any = 10;
let unknownVar: unknown = 10;

let s1: string = anyVar;    // OK
let s2: string = unknownVar; // Kesalahan: Jenis 'unknown' tidak dapat diassign ke jenis 'string'

// Kita perlu memeriksa jenis sebelum menggunakan unknownVar
if (typeof unknownVar === 'string') {
let s3: string = unknownVar; // OK
}

Seperti yang Anda lihat, unknown lebih aman karena itu memaksa Anda untuk memeriksa jenis sebelum menggunakannya.

Tabel Metode

Berikut adalah tabel metode umum yang Anda mungkin gunakan dengan any:

Metode Deskripsi Contoh
typeof Mengembalikan string yang menunjukkan jenis operand yang belum dievaluasi typeof anyVar === 'string'
instanceof Menguji apakah prototype properti kontruktur muncul di mana saja dalam rantai prototype objek anyVar instanceof Array
Asersi tipe Mengatakan kepada kompiler untuk menganggap nilai sebagai jenis tertentu (anyVar as string).length
Penjagaan jenis User-defined type predicates yang membantu memperkecil jenis variabel if (isString(anyVar)) { ... }

Ingat, dengan any, Anda dapat menggunakan metode apa pun yang tersedia di JavaScript, tetapi Anda kehilangan keuntungan pemeriksaan tipe TypeScript.

Dan itu semua, teman-teman! Anda telah melakukan penelitian mendalam ke dunia tipe any di TypeScript. Ingat, meskipun any dapat menjadi alat yang kuat, gunakanlah dengan bijak dan tanggung jawab. Selamat coding, dan semoga jenis-jenis selalu berada di pihak Anda!

Credits: Image by storyset