TypeScript, bahasa pemrograman populer Microsoft, terus mengesankan dengan rilis terbarunya, TypeScript 5.1. Dikemas dengan fitur dan peningkatan baru yang menarik, versi ini berjanji untuk membawa pengalaman pengkodean Anda ke yang baru ketinggian.

Pengembalian Fungsi dan Jenis Pengakses yang Disederhanakan

Di JavaScript, saat Anda membuat fungsi dan jalankan tanpa menemui pernyataan kembali, secara otomatis mengembalikan nilai belum diartikan.

TypeScript 5.1 telah memperkenalkan fitur baru yang memungkinkan fungsi mengembalikan undefined untuk menghilangkan pernyataan pengembalian sama sekali. Peningkatan ini meningkatkan keterbacaan dan keringkasan kode.

fungsilogMessage(pesan: rangkaian): belum diartikan{
menghibur.log (pesan);
// Tidak diperlukan pernyataan pengembalian di sini
}

Contoh ini menggunakan fungsi logMessage untuk menampilkan pesan di konsol. Namun, fungsi tersebut tidak secara eksplisit mengembalikan nilai apa pun.

TypeScript 5.1 memperkenalkan fitur baru yang mengizinkan penggunaan tipe yang tidak terkait untuk getter dan setter, selama Anda menyediakan anotasi tipe yang eksplisit.

Peningkatan ini terbukti sangat menguntungkan dalam situasi di mana Anda perlu menerapkan tipe yang berbeda untuk mengakses dan memodifikasi properti.

kelas Pengguna {
pribadi _nama: rangkaian | batal = batal;
mengatur nama (nama baru: rangkaian) {
ini._name = namaBaru;
 }
mendapatkan nama(): rangkaian {
kembaliini._nama?? 'Tidak dikenal';
 }
}

Dalam contoh ini, kelas Pengguna memiliki kelas pribadi _nama properti yang dapat berupa a rangkaian atau batal. Itu nama setter mengambil string nama baru dan menugaskannya ke _nama. Pengambil nama mengembalikan nilai dari _nama jika tidak batal, atau Tidak dikenal jika memang.

Ini memungkinkan Anda untuk menegakkan bahwa properti name hanya dapat disetel dengan string, tetapi ketika mendapatkan properti name, itu bisa berupa string atau Tidak dikenal jika belum diatur.

Fitur ini memungkinkan definisi tipe yang lebih fleksibel dan ekspresif seperti yang ditunjukkan pada contoh di bawah ini.

antarmuka CSSStyleRule {
// Selalu dibaca sebagai `CSSStyleDeclaration`
mendapatkan gaya(): CSSStyleDeclaration;
// Hanya bisa menulis `string` di sini.
mengatur gaya (NilaiBaru: rangkaian);
}

Pada contoh di atas, properti style memiliki getter yang mengembalikan CSSStyleDeclaration dan setter yang menerima string. Jenis ini tidak terkait, tetapi TypeScript 5.1 memungkinkan definisi jenis semacam ini.

Peningkatan JSX

TypeScript 5.1 memperkenalkan beberapa penyempurnaan untuk JSX. Sekarang memungkinkan pemeriksaan tipe yang dipisahkan antara elemen JSX dan tipe tag JSX, yang bisa berguna untuk perpustakaan seperti redux yang memungkinkan komponen mengembalikan lebih dari sekadar elemen JSX.

impor * sebagai Reaksi dari"reaksi";
asinkronfungsiKomponen Async() {
kembali
Dimuat</div>;
}
// Ini sekarang diizinkan:
membiarkan elemen = ;

Dalam contoh ini, Komponen Async function adalah fungsi asinkron yang mengembalikan elemen JSX. TypeScript 5.1 memungkinkan Anda menggunakan fungsi semacam ini sebagai komponen JSX, yang tidak mungkin dilakukan di versi sebelumnya.

TypeScript 5.1 juga memperkenalkan dukungan untuk JSX Transform baru yang diperkenalkan di React 17. Ini memungkinkan Anda untuk menggunakan JSX tanpa mengimpor React.

// Sebelum
impor Reaksi dari"reaksi";
fungsiKomponen() {
kembali
Halo, dunia!</h1>;
}
// Setelah
fungsiKomponen() {
kembali
Halo, dunia!</h1>;
}

Pada contoh di atas, fungsi Komponen mengembalikan elemen JSX. Di TypeScript 5.1 dan React 17, Anda tidak perlu lagi mengimpor React untuk menggunakan JSX.

Peningkatan Performa dan Perubahan Signifikan pada TypeScript 5.1

TypeScript 5.1 memperkenalkan beberapa pengoptimalan untuk meningkatkan kinerja, termasuk pengoptimalan kecepatan, memori, dan ukuran paket, menghindari instantiasi tipe yang tidak perlu, pemeriksaan kasus negatif untuk literal gabungan, dan mengurangi panggilan ke pemindai untuk JSDoc penguraian.

Berikut adalah contoh untuk menghindari instantiasi tipe yang tidak perlu di dalam tipe objek yang diketahui tidak berisi referensi ke parameter tipe luar, dan pemeriksaan yang lebih cepat untuk literal penyatuan.

jenis Serikat = 'A' | 'B' | 'C';
fungsimemeriksa(nilai: Kesatuan) {
// ...
}

Dalam contoh ini, TypeScript 5.1 dapat dengan cepat memeriksa apakah suatu nilai merupakan bagian dari tipe Union tanpa harus memeriksa setiap tipe dalam union.

Ini contoh lainnya:

jenis Titik = {x: nomor, y: nomor };
fungsimenerjemahkan(titik: Titik, dx: nomor, dia: nomor): Titik{
kembali { x: titik.x + dx, y: titik.y + dy };
}
membiarkan p: Titik = {x: 1, y: 2 };
p = terjemahkan (p, 1, 1);

Dalam contoh ini, tipe Point adalah tipe objek yang tidak mengandung parameter tipe apa pun. Saat memanggil fungsi terjemahan, TypeScript 5.1 dapat menghindari contoh tipe yang tidak perlu, yang secara signifikan dapat mempercepat pemeriksaan tipe.

Merangkul TypeScript 5.1

TypeScript 5.1 memperkenalkan serangkaian fitur canggih dan pengoptimalan yang merevolusi pengembangan JavaScript. Dari fungsi yang disederhanakan kembali ke peningkatan JSX dan peningkatan kinerja, TypeScript 5.1 memberdayakan Anda untuk menulis kode yang lebih bersih dan lebih ekspresif sambil meningkatkan pemeriksaan jenis dan kinerja keseluruhan.

Dengan merangkul TypeScript 5.1, Anda dapat membuka kemungkinan baru dan meningkatkan proyek JavaScript Anda ke tingkat efisiensi dan inovasi baru. Biarkan TypeScript 5.1 menjadi gerbang Anda menuju pengalaman pengembangan JavaScript yang lebih maju dan efisien.