Tutorial TypeScript: Ketahui Mengenai Asas TypeScript

TypeScript adalah superset yang sangat ditaip yang menyusun ke JavaScript biasa. Anda dapat menggunakan bahasa ini untuk pengembangan JavaScript skala aplikasi. Juga, ia dapat dijalankan pada penyemak imbas, host mana pun, dan Sistem Operasi mana pun. Dalam Tutorial TypeScript ini, kita akan memasuki kedalaman TypeScript dan memahami asas-asasnya dalam urutan berikut:

• Pengenalan kepada TypeScript
• Jenis Jenis Skrip
• Pemboleh ubah
• Pengendali
• Gelung
• Fungsi
• Rentetan
• Susunan
• Antara muka
• Kelas
• Objek
• Kes Penggunaan TypeScript

Pengenalan kepada TypeScript

TypeScript adalah superset JavaScript yang ditaip yang menyusun untuk JavaScript biasa. TypeScript berorientasikan objek murni dengan kelas, antara muka dan bahasa pengaturcaraan yang ditaip secara statik seperti C # atau . Ia memerlukan penyusun untuk menyusun dan menghasilkan dalam fail JavaScript. Pada dasarnya, TypeScript adalah versi ES6 JavaScript dengan beberapa ciri tambahan.

Kod TypeScript ditulis dalam fail dengan lanjutan dan kemudian disusun ke dalam JavaScript menggunakan penyusun. Anda boleh menulis fail di mana-mana penyunting kod dan penyusun perlu dipasang di platform anda. Selepas pemasangan, arahan tsc .ts menyusun kod TypeScript ke dalam fail JavaScript biasa.

Sintaks:

var message: string = 'Selamat datang ke Edureka!' console.log (mesej)

Semasa menyusunnya, ia menghasilkan kod JavaScript berikut:

// Dihasilkan oleh typcript 1.8.10 var message = 'Selamat Datang di Edureka!' console.log (mesej)

Ciri-ciri TypeScript

• Merentas Platform: Penyusun TypeScript boleh dipasang di mana-mana Sistem Operasi seperti Windows, MacOS dan Linux.

  
  
  

• Bahasa Berorientasikan Objek : TypeScript menyediakan ciri seperti Kelas , Antara Muka, dan Modul. Oleh itu, ia dapat menulis kod berorientasikan objek untuk sisi pelanggan dan juga pengembangan sisi pelayan.

• Pemeriksaan jenis statik : TypeScript menggunakan penaipan statik dan membantu memeriksa jenis pada waktu kompilasi. Oleh itu, anda boleh menemui kesilapan semasa menulis kod tanpa menjalankan skrip.

• Penaipan Statik Pilihan : TypeScript juga membenarkan penaipan statik pilihan sekiranya anda menggunakan penaipan dinamik JavaScript.

• Manipulasi DOM : Anda boleh menggunakan TypeScript untuk memanipulasi DOM untuk menambahkan atau menghapus elemen.

• Ciri ES 6 : TypeScript merangkumi kebanyakan ciri ECMAScript 2015 yang dirancang (ES 6, 7) seperti kelas, antara muka, fungsi Arrow, dll.

Kelebihan Menggunakan TypeScript

• Jenis Skrip adalah cepat, ringkas, senang dipelajari dan berjalan di mana-mana penyemak imbas atau mesin JavaScript.

• Ia adalah serupa ke JavaScript dan menggunakan sintaksis dan semantik yang sama.

• Ini membantu pembangun backend menulis bahagian depan kod lebih pantas .

• Kod TypeScript boleh dipanggil dari kod JavaScript yang ada . Ia juga berfungsi dengan kerangka kerja dan perpustakaan JavaScript yang ada tanpa masalah.

• Fail Definisi, dengan lanjutan .d.ts, memberikan sokongan untuk perpustakaan JavaScript yang ada seperti Jquery, D3.js Oleh itu, kod TypeScript boleh ditambah Perpustakaan JavaScript menggunakan definisi jenis untuk memanfaatkan faedah pemeriksaan jenis, pelengkapan automatik kod, dan dokumentasi di perpustakaan JavaScript yang ditaip secara dinamik yang ada.

• Ia merangkumi ciri dari ES6 dan ES7 yang boleh dijalankan dalam enjin JavaScript peringkat ES5 seperti Node.js .

Sekarang setelah anda memahami apa itu TypeScript, mari kita lanjutkan dengan Tutorial TypeScript ini dan lihat jenisnya.

Jenis Jenis Skrip

Jenis Sistem mewakili pelbagai jenis nilai yang disokong oleh bahasa. Ia memeriksa kesahan dari yang dibekalkan nilai sebelum mereka disimpan atau dimanipulasi oleh program.

Ia boleh dikelaskan kepada dua jenis seperti:

• Terbina dalam : Ini merangkumi nombor, rentetan, boolean, batal, null dan tidak ditentukan.
• Ditentukan oleh pengguna : Ini termasuk Enumerasi (enum), kelas, antaramuka, tatasusunan, dan tuple.

Sekarang mari kita lanjutkan dengan Tutorial TypeScript ini dan fahami lebih banyak mengenai pemboleh ubah.

Tutorial Jenis Skrip: Pemboleh ubah

Pemboleh ubah adalah ruang bernama dalam memori yang digunakan untuk menyimpan nilai.

Sintaks jenis untuk menyatakan pemboleh ubah dalam TypeScript merangkumi titik dua (:) selepas nama pemboleh ubah, diikuti dengan jenisnya. Sama seperti JavaScript, kami menggunakan kata kunci var untuk menyatakan pemboleh ubah.

Terdapat empat pilihan ketika kita menyatakan pemboleh ubah:

var [pengecam]: [type-anotation] = nilai

var [pengecam]: [jenis-anotasi]

var [pengecam] = nilai

var [kenalpasti]

Contoh:

var name: string = 'Daisy' var empid: number = 1001 console.log ('name' + name) console.log ('id pekerja' + empid)

Semasa menyusunnya, ia akan menghasilkan kod JavaScript berikut:

// Dihasilkan oleh naskhah 1.8.10 var name = 'Daisy' var empid = 1001 console.log ('name' + name) console.log ('id pekerja:' + empid)

Pengeluaran:

nama: Daisy
id pekerja: 1001

Sekarang mari kita beralih ke topik seterusnya dari Tutorial TypeScript kami.

Pengendali

Operator digunakan untuk menentukan fungsi yang akan dilakukan pada data. Data di mana pengendali bekerja dipanggil operand. Terdapat pelbagai jenis pengendali dalam TypeScript seperti:

• Pengendali aritmetik
• Pengendali logik
• Pengendali hubungan
• Pengendali bitwise
• Pengendali tugasan

Pengendali Aritmetik

Contoh:

var num1: number = 10 var num2: number = 2 var res: number = 0 res = num1 + num2 console.log ('Sum:' + res) res = num1 - num2 console.log ('Perbezaan:' + res) res = num1 * num2 console.log ('Product:' + res)

Pengeluaran:

Jumlah: 12
Perbezaan: 8
Produk: 20

Pengendali Logik

Contoh:

var avg: number = 20 var peratusan: number = 90 console.log ('Nilai avg:' + avg + ', nilai peratusan:' + peratusan) var res: boolean = ((purata> 50) && (peratusan> 80 )) console.log ('(purata> 50) && (peratusan> 80):', res)

Pengeluaran:

Nilai purata: 20, nilai peratusan: 90
(purata> 50) && (peratusan> 80): salah

Pengendali Perhubungan

Contoh:

var num1: number = 10 var num2: number = 7 console.log ('Value of num1:' + num1) console.log ('Value of num2:' + num2) var res = num1> num2 console.log ('num1 lebih besar daripada num2: '+ res) res = num1
 Pengeluaran: 
Nilai num1: 10 
 Nilai num2: 7 
 num1 lebih besar daripada num2: benar 
 num1 lebih rendah daripada num2: false
 Pengendali Bitwise 
 Pengendali 
 Penerangan 
 Sedikit demi sedikit DAN (&) 
melakukan operasi Boolean AND pada setiap bit argumen integernya.
 Bitwise ATAU (|) 
Ia melakukan operasi Boolean ATAU pada setiap bit argumen integernya.
 Bitwise XOR (^) 
Ia melakukan operasi ATAU eksklusif Boolean pada setiap bit argumen integernya.
 Sedikit demi sedikit TIDAK (~) 
Ini adalah pengendali yang tidak berfungsi dan beroperasi dengan membalikkan semua bit dalam operan.
 Pergeseran kiri (<<) 
Ia menggerakkan semua bit pada operan pertamanya ke kiri dengan bilangan tempat yang dinyatakan dalam operan kedua.
 Pergeseran Kanan (>>) 
Nilai operan kiri dipindahkan ke kanan dengan jumlah bit yang ditentukan oleh operan kanan.
 Pergeseran Kanan dengan Nol (>>>) 
Ia serupa dengan pengendali >>, kecuali bahawa bit yang beralih di sebelah kiri selalu sifar.
 Contoh: 
var a: number = 2 // Persembahan bit 10 var b: number = 3 // Persembahan bit 11 hasil keputusan var = (a & b) console.log ('(a & b) =>', hasil) hasil = ( a | b) console.log ('(a | b) =>', hasil)
 Pengeluaran: 
(a & b) => 2 
 (a | b) => 3
 Pengendali Tugasan 
 Pengendali 
 Penerangan 
 Tugasan Ringkas (=) 
Menetapkan nilai dari operan sisi kanan ke operan sisi kiri
 Tambah dan tugasan (+ =) 
Ia menambah operan kanan ke operan kiri dan memberikan hasilnya ke operan kiri.
 Kurangkan dan tugaskan (- =) 
Ia mengurangkan operan kanan dari operan kiri dan memberikan hasilnya ke operan kiri.
 Gandakan dan tugasan (* =) 
Ia mengalikan operan kanan dengan operan kiri dan memberikan hasilnya ke operan kiri.
 Bahagikan dan tugaskan (/ =) 
Ia membahagikan operan kiri dengan operan kanan dan memberikan hasilnya ke operan kiri.
 Contoh: 
var a: number = 12 var b: number = 10 a = b console.log ('a = b:' + a) a + = b console.log ('a + = b:' + a) a - = b konsol .log ('a- = b:' + a)
 Pengeluaran: 
a = b: 10 
 a + = b: 20 
 a - = b: 10
Ini adalah operator yang berbeza. Sekarang mari kita lanjutkan dengan Tutorial TypeScript kami dan belajar mengenai gelung.
 Gelung 
Mungkin ada situasi ketika sekumpulan kod perlu dilaksanakan beberapa kali. A gelung penyataan membolehkan kita melaksanakan penyataan atau kumpulan penyataan berkali-kali.
Gelung TypeScript boleh dikelaskan sebagai:
 Untuk Gelung 
The untuk gelung adalah pelaksanaan gelung pasti.
 Sintaks: 
untuk (ungkapan pertama ungkapan kedua ungkapan ketiga) {// pernyataan akan dilaksanakan berulang kali}
Di sini, ungkapan pertama dilaksanakan sebelum gelung bermula. Ungkapan kedua adalah syarat untuk gelung dilaksanakan. Dan ungkapan ketiga dilaksanakan setelah pelaksanaan setiap blok kod.
 Contoh: 
untuk (let i = 0 i<2 i++) { console.log ('Execute block statement' + i) }
 Pengeluaran: 
Laksanakan penyataan blok 0 
Laksanakan penyataan blok 1
 Semasa Gelung 
The while loop melaksanakan arahan setiap kali keadaan yang ditentukan dinilai benar.
 Sintaks: 
sementara (ungkapan keadaan) {// blok kod yang akan dilaksanakan}
 Contoh: 
let i: number = 1 sambil (i<3) { console.log( 'Block statement execution no.' + i ) i++ }
 Pengeluaran: 
Blok penyataan pelaksanaan no.1 
Blok penyataan pelaksanaan no.2
 Lakukan..Sambil Gelung 
Gelung do & hellip sementara serupa dengan gelung sementara kecuali bahawa ia tidak menilai keadaan untuk pertama kalinya gelung dijalankan.
 Sintaks: 
lakukan {// blok kod yang akan dilaksanakan} sementara (ungkapan keadaan)
 Contoh: 
  
let i: number = 1 do {console.log ('Blok penyataan penyataan eksekusi.' + i) i ++} semasa (i<3)
 Pengeluaran: 
Blok penyataan pelaksanaan no.1 
Blok penyataan pelaksanaan no.2
Selain daripada ini, terdapat pernyataan rehat dan lanjutan dalam TypeScript yang digunakan dalam satu gelung.
 Penyataan Rehat 
Pernyataan rehat digunakan untuk mengawal dari konstruk. Menggunakan pernyataan putus dalam gelung membantu program keluar dari gelung.
 Contoh: 
var i: nombor = 1 sambil (i<=10) { if (i % 5 == 0) { console.log ('The first multiple of 5 between 1 and 10 is : '+i) break //exit the loop if the first multiple is found } i++ } //outputs 5 and exits the loop
 Pengeluaran: 
mencantumkan pokok keputusan keputusan 4 elemen
Gandaan pertama dari 5 antara 1 dan 10 adalah: 5
 Teruskan Penyataan 
Pernyataan terus melangkau pernyataan berikutnya dalam lelaran semasa dan mengambil kawalan kembali ke permulaan gelung.
 Contoh: 
var num: number = 0 var count: number = 0 untuk (num = 0num<=10num++) { if (num % 2==0) { continue } count++ } console.log (' The count of odd values between 0 and 10 is: '+count)
 Pengeluaran: 
Kiraan nilai ganjil antara 0 dan 10 adalah: 5
Ini adalah gelung yang berbeza dalam TypeScript. Sekarang, mari kita teruskan dengan Tutorial TypeScript kami dan fahami fungsinya.
 Fungsi 
Dalam JavaScript, fungsi adalah salah satu bahagian yang paling penting kerana ia adalah bahasa pengaturcaraan yang berfungsi. Fungsi memastikan bahawa program dapat dikekalkan dan dapat digunakan kembali, dan disusun menjadi blok yang dapat dibaca. Walaupun TypeScript menyediakan konsep kelas dan modul, fungsi tetap merupakan bahagian yang tidak dapat dipisahkan dari bahasa.
 Fungsi Dinamakan 
Fungsi bernama digunakan untuk menyatakan dan memanggil fungsi dengan nama yang diberikan.
 Contoh: 
paparan fungsi () {console.log ('TypeScript Function')} paparan ()
 Pengeluaran: 
Fungsi TypeScript
 Fungsi Tanpa Nama 
Fungsi tanpa nama adalah fungsi yang didefinisikan sebagai ungkapan. Ungkapan ini disimpan dalam pemboleh ubah. Fungsi-fungsi ini dipanggil menggunakan nama pemboleh ubah yang disimpan dalam fungsi.
 Contoh: 
biarkan salam = fungsi () {console.log ('TypeScript Function')} ucapan ()
 Pengeluaran: 
Fungsi TypeScript
 Fungsi Anak Panah 
Notasi anak panah lemak digunakan untuk fungsi tanpa nama iaitu ungkapan fungsi. Mereka juga disebut fungsi lambda dalam bahasa lain.
 Sintaks: 
(param1, param2, ..., paramN) => ungkapan
Dengan menggunakan anak panah lemak (=>) mengurangkan keperluan untuk menggunakan kata kunci 'fungsi'. Parameter dilewatkan dalam kurungan sudut, dan ekspresi fungsi tertutup dalam kurungan keriting {}.
 Contoh: 
let sum = (x: number, y: number): number => {return x + y} jumlah (10, 30) // pulangkan 40
 Beban Berfungsi 
TypeScript memberikan konsep fungsi overloading. Oleh itu, anda boleh mempunyai pelbagai fungsi dengan nama yang sama tetapi jenis parameter dan jenis pengembalian yang berbeza.
 Contoh: 
function add (a: string, b: string): string function add (a: number, b: number): number return a + b} add ('Hello', 'Edureka') // mengembalikan 'Hello Edureka' add ( 10, 10) // mengembalikan 20
Dalam contoh di atas, kita mempunyai fungsi tambah yang sama () dengan dua deklarasi fungsi dan satu pelaksanaan fungsi. Tandatangan pertama mempunyai dua parameter rentetan jenis, sedangkan tandatangan kedua mempunyai dua parameter nombor jenis.
Ini adalah pelbagai jenis fungsi. Sekarang, mari kita lanjutkan dengan Tutorial TypeScript kami dan fahami rentetan dalam TypeScript.
 Tutorial Jenis Skrip: Rentetan 
The  adalah jenis data primitif lain yang digunakan untuk menyimpan data teks. Nilai rentetan dikelilingi oleh tanda petik tunggal atau tanda petik berganda.
 Sintaks: 
var var_name = Rentetan baru (rentetan)
Terdapat pelbagai sifat kaedah yang terdapat dalam objek String seperti:
 Pembina - Ia mengembalikan rujukan ke fungsi String yang membuat objek
 Panjang - Ini mengembalikan panjang tali
 Prototaip - Properti ini membolehkan anda menambahkan sifat dan kaedah ke objek
 Contoh: 
let name = String baru ('Welcome to Edureka!') console.log ('Message:' + name) console.log ('Length:' + name.length)
 Pengeluaran: 
Mesej: Selamat datang ke Edureka! 
 Panjang: 19
 Kaedah Rentetan 
Senarai Kaedah dalam Objek String merangkumi:
 Kaedah 
 Penerangan 
 charAt () 
Ia mengembalikan watak pada indeks yang ditentukan
 charCodeAt () 
Ia mengembalikan nombor yang menunjukkan nilai Unicode watak pada indeks yang diberikan
 ringkas () 
Menggabungkan teks dua rentetan dan mengembalikan rentetan baru
 Indeks() 
Mengembalikan indeks dalam objek String panggilan dari kejadian pertama dari nilai yang ditentukan
 lastIndexOf () 
Ia mengembalikan indeks dalam objek String panggilan dari kejadian terakhir dari nilai yang ditentukan
 padanan () 
Digunakan untuk memadankan ungkapan biasa dengan rentetan
 tempatanBandingkan () 
Mengembalikan nombor yang menunjukkan sama ada rentetan rujukan datang sebelum atau sesudah atau sama dengan rentetan yang diberikan mengikut urutan
 cari () 
Ini melaksanakan pencarian padanan antara ungkapan biasa dan rentetan yang ditentukan
 ganti () 
Digunakan untuk mencari padanan antara ungkapan biasa dan rentetan, dan untuk menggantikan substring yang dipadankan dengan substring baru
 kepingan () 
Ia mengekstrak bahagian rentetan dan mengembalikan rentetan baru
 berpecah () 
Membahagi objek String menjadi array rentetan dengan memisahkan string menjadi substring
 substrat () 
Mengembalikan watak dalam rentetan bermula dari lokasi yang ditentukan melalui bilangan watak yang ditentukan
 substring () 
Ia mengembalikan watak dalam rentetan antara dua indeks ke dalam rentetan
 keLocaleLowerCase () 
pl sql tutorial dengan contoh
Karakter dalam rentetan ditukar menjadi huruf kecil sambil menghormati tempat semasa
 keLocaleUpperCase () 
Karakter dalam rentetan ditukar menjadi huruf besar sambil menghormati lokasi semasa
 keLowerCase () 
Ia mengembalikan nilai rentetan panggilan yang ditukar menjadi huruf kecil
 keUpperCase () 
Ia mengembalikan nilai rentetan panggilan yang ditukar menjadi huruf besar
 menjalin() 
Mengembalikan rentetan yang mewakili objek yang ditentukan
 nilai() 
Mengembalikan nilai primitif objek yang ditentukan
 Contoh: 
let str: string = 'Welcome to Edureka' str.charAt (0) // mengembalikan 'w' str.charAt (2) // mengembalikan 'l' 'selamat datang ke Edureka'.charAt (2) mengembalikan' l 'let str1 : string = 'welcome' let str2: string = 'Edureka' str1.concat (str2) // mengembalikan 'welcomeEdureka' str1.concat ('', str2) // mengembalikan 'selamat datang Edureka' str1.concat ('' ke ' ') // mengembalikan' selamat datang ke '
Setelah anda mengetahui tentang rentetan, mari kita lanjutkan dengan tutorial TypeScript ini dan memahami susunan.
 Susunan dalam TypeScript 
Seorang susunan adalah jenis khas jenis data yang menyimpan pelbagai nilai pelbagai jenis data secara berurutan menggunakan sintaks khas. Elemen array dikenal pasti oleh bilangan bulat unik yang disebut subskrip atau indeks elemen.
 Sintaks: 
var array_name [: datatype] // deklarasi array_name = [val1, val2, valn ..] // inisialisasi
 Contoh: 
let names: Array names = ['John', 'Daisy', 'Rachel'] let ids: Array ids [[101, 700, 321]]
 Kaedah Array 
Berikut adalah senarai kaedah Array yang berbeza yang boleh digunakan untuk tujuan yang berbeza:
 Kaedah 
 Penerangan 
 penapis () 
Membuat array baru dengan semua elemen array ini yang fungsi penyaringan yang disediakan kembali benar
 setiap () 
Mengembalikan benar jika setiap elemen dalam larik ini memenuhi fungsi pengujian yang disediakan
 ringkas () 
Mengembalikan tatasusunan baru yang terdiri daripada tatasusunan ini yang digabungkan dengan tatasusunan yang lain
 Indeks() 
Mengembalikan indeks pertama atau paling sedikit elemen dalam array sama dengan nilai yang ditentukan
 untuk setiap() 
Memanggil fungsi untuk setiap elemen dalam array
 sertai () 
Bergabung dengan semua elemen larik menjadi rentetan
 lastIndexOf () 
Mengembalikan indeks elemen terakhir atau terbesar dalam array sama dengan nilai yang ditentukan
 peta () 
Membuat array baru dengan hasil memanggil fungsi yang disediakan pada setiap elemen dalam array ini
 tolak () 
Menambah satu atau lebih elemen pada akhir array dan mengembalikan panjang array yang baru
 pop () 
Mengeluarkan elemen terakhir dari tatasusunan dan mengembalikan elemen itu
 kurangkan () 
Terapkan fungsi secara serentak terhadap dua nilai array dari kiri ke kanan untuk mengurangkannya menjadi satu nilai
 kurangkan Betul () 
Terapkan fungsi secara serentak terhadap dua nilai array dari kanan ke kiri untuk mengurangkannya menjadi satu nilai
 terbalik () 
Membalikkan susunan elemen array
 peralihan () 
Mengeluarkan elemen pertama dari tatasusunan dan mengembalikan elemen itu
 kepingan () 
Mengekstrak bahagian array dan mengembalikan array baru
 sesetengah() 
Ia kembali benar jika sekurang-kurangnya satu elemen dalam larik ini memenuhi fungsi pengujian yang disediakan
 urutkan () 
Ia menyusun unsur array
 menjalin() 
Mengembalikan rentetan yang mewakili susunan dan unsurnya
 sambatan () 
Ia menambah dan / atau membuang unsur dari array
 tidak beralih () 
Menambah satu atau lebih elemen di bahagian depan array dan mengembalikan panjang array yang baru
 Contoh: 
nama var: Array = ['John', 'Daisy', 'Tara'] name.sort () console.log (name) // output: ['Daisy', 'John', 'Tara'] console.log ( name.pop ()) // output: Tara name.push ('Rachel') console.log (name) // output: ['John', 'Daisy', 'Rachel']
Sekarang mari kita teruskan dengan Tutorial TypeScript ini dan pelajari mengenai Interfaces.
 Antara Muka Jenis Skrip 
Antaramuka adalah struktur yang menentukan kontrak dalam aplikasi anda. Ia menentukan sintaks untuk kelas yang diikuti. Ini hanya mengandungi pengisytiharan ahli dan menjadi tanggungjawab kelas penurun untuk menentukan ahli.
 Contoh: 
antara muka Pekerja {empID: number empName: string getSalary: (number) => number // fungsi panah getManagerName (number): string}
Dalam contoh di atas, Pekerja antara muka merangkumi dua sifat empid dan nama emp . Ini juga merangkumi deklarasi kaedah dapatkanSalaray menggunakan fungsi anak panah yang merangkumi satu parameter nombor dan jenis pengembalian nombor. The getManagerName kaedah dinyatakan menggunakan fungsi normal.
 Skrip Jenis  Kelas 
TypeScript memperkenalkan kelas sehingga mereka dapat memanfaatkan kelebihan teknik berorientasikan objek seperti enkapsulasi dan abstraksi. Kelas dalam TypeScript disusun untuk fungsi JavaScript biasa oleh penyusun TypeScript untuk berfungsi di seluruh platform dan penyemak imbas.
Kelas merangkumi yang berikut:
 Pembina 
 Hartanah 
 Kaedah 
 Contoh: 
pekerja kelas {empID: number empName: string konstruktor (ID: number, name: string) {this.empName = name this.empID = ID} getSalary (): number {return 40000}}
 Warisan 
TypeScript menyokong Warisan kerana kemampuan program untuk membuat kelas baru dari kelas yang ada. Kelas yang diperluas untuk membuat kelas yang lebih baru dipanggil kelas induk atau kelas super. Kelas yang baru dibuat dipanggil anak kelas atau kelas bawah.
Kelas mewarisi dari kelas lain menggunakan kata kunci 'memanjangkan'. Kelas anak mewarisi semua harta dan kaedah kecuali ahli persendirian dan pembina dari kelas induk. Tetapi, TypeScript tidak menyokong pelbagai warisan.
 Sintaks: 
class_class_name class memperluaskan nama_class_name
 Contoh: 
Person class {name: string konstruktor (name: string) {this.name = name}} class Employee extends Person {empID: number konstror (empID: number, name: string) {super (name) this.empID = empid} displayName (): void {console.log ('Name =' + this.name + ', Employee ID =' + this.empID)}} let emp = pekerja baru (701, 'Jason') emp.displayName () // Nama = Jason, ID Pekerja = 701
Sekarang setelah anda mengetahui tentang kelas, mari kita teruskan dengan Tutorial Jenis Skrip ini dan belajar mengenai Objek.
 Objek dalam TypeScript 
Objek adalah contoh yang mengandungi kumpulan pasangan kunci-nilai yang berbeza. Nilai boleh berupa nilai atau fungsi skalar atau bahkan array objek lain.
 Sintaks: 
var object_name = {key1: “value1”, // scalar value key2: “value”, key3: function () {// functions}, key4: [“content1”, “content2”]
Objek boleh mengandungi nilai skalar, fungsi dan struktur seperti tatasusunan dan tupel.
 Contoh: 
var person = {nama pertama: 'Danny', nama belakang: 'Green'} // mengakses objek nilai console.log (person.firstname) console.log (person.lastname)
Semasa menyusunnya, ia akan menghasilkan kod yang sama dalam JavaScript.
 Pengeluaran: 
Danny 
 Hijau
Ini adalah elemen penting yang berbeza dari TypeScript. Sekarang, mari kita lanjutkan dengan Tutorial TypeScript ini dan lihat contoh untuk memahami kes penggunaan.
 Tutorial Jenis Skrip: Kes Penggunaan 
Di sini, kita akan belajar bagaimana menukar yang ada  ke TypeScript.
Apabila kita menyusun fail TypeScript, ia menghasilkan fail JavaScript yang sesuai dengan nama yang sama. Di sini, kita perlu memastikan bahawa fail JavaScript asli kita yang bertindak sebagai input tidak boleh berada di direktori yang sama sehingga TypeScript tidak menimpanya.
Proses untuk berpindah dari JavaScript ke TypeScript merangkumi langkah-langkah berikut:
 1. Tambahkan fail tsconfig.json ke projek 
Anda perlu menambahkan fail tsconfig.json ke projek. TypeScript menggunakan fail tsconfig.json untuk menguruskan pilihan penyusunan projek, seperti fail mana yang ingin anda sertakan dan kecualikan.
{'compilerOptions': {'outDir': './built', 'allowJs': true, 'target': 'es5'}, 'include': ['./src/**/*']}
 2. Bersepadu dengan alat binaan 
Sebilangan besar projek JavaScript mempunyai alat binaan bersepadu seperti jurang atau beg web. Anda boleh mengintegrasikan projek dengan beg web dengan cara berikut:
Jalankan arahan berikut di terminal:
$ npm pasang sumber-peta-loader hebat-typecript-loader
Dalam penyatuan beg web, anda menggunakan pemuat-jenis-naskah yang hebat yang digabungkan dengan pemuat-peta-sumber untuk penyahpepijatan kod sumber yang lebih mudah.
Kedua, gabungkan harta konfigurasi modul dalam fail webpack.config.js kami untuk memasukkan pemuat.
 3. Pindahkan semua fail .js ke fail .ts 
Dalam langkah ini, anda harus menamakan semula fail .js menjadi fail .ts. Begitu juga, jika fail menggunakan JSX, anda perlu menamakannya semula menjadi .tsx. Sekarang, jika kita membuka fail itu di editor yang mendukung TypeScript, beberapa kod mungkin mulai memberikan kesalahan kompilasi. Oleh itu, menukar fail satu demi satu membolehkan menangani kesalahan penyusunan dengan lebih mudah. Sekiranya TypeScript menemui kesalahan kompilasi semasa penukaran, ia masih dapat menerjemahkan kod tersebut.
 4. Periksa kesilapan 
Setelah memindahkan file js ke file ts, segera, TypeScript akan memulakan Pemeriksaan Jenis kod kami. Jadi, anda mungkin mendapat ralat diagnostik dalam kod JavaScript.
 5. Gunakan Perpustakaan JavaScript pihak ketiga 
Projek JavaScript menggunakan perpustakaan pihak ketiga seperti  atau Lodash. Untuk menyusun fail, TypeScript perlu mengetahui jenis semua objek di perpustakaan ini. Fail definisi TypeScript untuk pustaka JavaScript sudah tersedia di DefinitelyTyped. Jadi, tidak perlu memasang jenis ini secara luaran. Anda hanya perlu memasang jenis yang digunakan dalam projek kami.
Untuk jQuery, anda boleh memasang definisi:
$ npm install @ types / jquery
Selepas ini, buat perubahan pada projek JavaScript, jalankan alat bina. Sekarang, anda harus menyusun projek TypeScript ke dalam JavaScript biasa yang dapat dijalankan di penyemak imbas.
Dengan ini, kita telah sampai ke akhir Tutorial TypeScript ini. Saya harap anda memahami semua elemen penting TypeScript.
 Lihat     oleh Edureka.  Latihan Pensijilan Pembangunan Web akan membantu anda Mempelajari cara membuat laman web yang mengagumkan menggunakan HTML5, CSS3, Twitter Bootstrap 3, jQuery dan Google API dan menyebarkannya ke Amazon Simple Storage Service (S3). 
 Ada soalan untuk kami? Sila sebutkan di bahagian komen 'TypeScript Tutorial' dan kami akan menghubungi anda.