Tutorial TypeScript: Ketahui Tentang Dasar-dasar TypeScript

TypeScript adalah superset yang sangat diketik dari yang mengkompilasi ke JavaScript biasa. Anda dapat menggunakan bahasa ini untuk pengembangan JavaScript skala aplikasi. Selain itu, dapat dijalankan di browser apa pun, host apa pun, dan Sistem Operasi apa pun. Dalam Tutorial TypeScript ini, kita akan mendalami TypeScript dan memahami dasar-dasar dalam urutan berikut:

• Pengantar TypeScript
• Jenis TypeScript
• Variabel
• Operator
• Loop
• Fungsi
• String
• Array
• Antarmuka
• Kelas
• Objek
• Kasus Penggunaan TypeScript

Pengantar TypeScript

TypeScript adalah superset dari JavaScript yang dikompilasi ke JavaScript biasa. TypeScript murni berorientasi objek dengan kelas, antarmuka, dan bahasa pemrograman yang diketik secara statis seperti C # atau . Ini membutuhkan kompiler untuk mengkompilasi dan menghasilkan dalam file JavaScript. Pada dasarnya, TypeScript adalah JavaScript versi ES6 dengan beberapa fitur tambahan.

Kode TypeScript ditulis dalam file dengan ekstensi .ts dan kemudian dikompilasi menjadi JavaScript menggunakan compiler. Anda dapat menulis file di editor kode apa pun dan kompiler perlu diinstal pada platform Anda. Setelah instalasi, perintahnya tsc .ts mengkompilasi kode TypeScript menjadi file JavaScript biasa.

Sintaksis:

var message: string = 'Selamat datang di Edureka!' console.log (pesan)

Saat kompilasi, ini menghasilkan kode JavaScript berikut:

// Dihasilkan oleh typescript 1.8.10 var message = 'Selamat datang di Edureka!' console.log (pesan)

Fitur TypeScript

• Lintas Platform: Kompiler TypeScript dapat diinstal pada Sistem Operasi apa pun seperti Windows, MacOS dan Linux.

  
  
  

• Bahasa Berorientasi Objek : TypeScript menyediakan fitur seperti Kelas , Antarmuka, dan Modul. Dengan demikian, ia dapat menulis kode berorientasi objek untuk sisi klien serta pengembangan sisi server.

• Pemeriksaan tipe statis : TypeScript menggunakan pengetikan statis dan membantu pemeriksaan pengetikan pada waktu kompilasi. Dengan demikian, Anda dapat menemukan kesalahan saat menulis kode tanpa menjalankan skrip.

• Pengetikan Statis Opsional : TypeScript juga memungkinkan pengetikan statis opsional jika Anda menggunakan pengetikan dinamis JavaScript.

• Manipulasi DOM : Anda dapat menggunakan TypeScript untuk memanipulasi DOM untuk menambah atau menghapus elemen.

• Fitur ES 6 : TypeScript mencakup sebagian besar fitur ECMAScript terencana 2015 (ES 6, 7) seperti kelas, antarmuka, fungsi Panah, dll.

Keuntungan Menggunakan TypeScript

• TypeScript adalah cepat, sederhana, mudah dipelajari dan berjalan di browser atau mesin JavaScript apa pun.

• ini serupa untuk JavaScript dan menggunakan sintaks dan semantik yang sama.

• Ini membantu pengembang backend menulis front-end kode lebih cepat .

• Kode TypeScript dapat dipanggil dari file kode JavaScript yang ada . Selain itu, ini berfungsi dengan framework dan library JavaScript yang ada tanpa masalah apa pun.

• File Definisi, dengan ekstensi .d.ts, memberikan dukungan untuk pustaka JavaScript yang ada seperti Jquery, D3.js , dll. Jadi, kode TypeScript dapat ditambahkan Perpustakaan JavaScript menggunakan definisi jenis untuk memanfaatkan manfaat pemeriksaan jenis, pelengkapan otomatis kode, dan dokumentasi di pustaka JavaScript yang diketik secara dinamis.

• Ini mencakup fitur dari ES6 dan ES7 yang dapat berjalan di mesin JavaScript tingkat ES5 seperti Node.js .

Sekarang setelah Anda memahami apa itu TypeScript, mari kita lanjutkan dengan Tutorial TypeScript dan lihat jenis-jenis yang berbeda.

Jenis TypeScript

Sistem Jenis mewakili berbagai jenis nilai yang didukung oleh bahasa. Ia memeriksa keabsahan dari yang disediakan nilai-nilai sebelum disimpan atau dimanipulasi oleh program.

Ini dapat diklasifikasikan menjadi dua jenis seperti:

• Bawaan : Ini termasuk angka, string, boolean, void, null dan undefined.
• Ditetapkan pengguna : Ini mencakup Enumerasi (enum), kelas, antarmuka, array, dan tuple.

Sekarang mari kita lanjutkan dengan Tutorial TypeScript dan memahami lebih lanjut tentang variabel.

Tutorial TypeScript: Variabel

Variabel adalah ruang bernama dalam memori yang digunakan untuk menyimpan nilai.

Sintaks tipe untuk mendeklarasikan variabel di TypeScript menyertakan titik dua (:) setelah nama variabel, diikuti dengan tipenya. Mirip dengan JavaScript, kami menggunakan var kata kunci untuk mendeklarasikan variabel.

Ada empat opsi saat kami mendeklarasikan variabel:

var [pengenal]: [jenis-anotasi] = nilai

var [pengenal]: [jenis-anotasi]

var [pengidentifikasi] = nilai

var [identifikasi]

Contoh:

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

Saat kompilasi, itu akan menghasilkan kode JavaScript berikut:

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

Keluaran:

nama: Daisy
id karyawan: 1001

Sekarang mari beralih ke topik berikutnya dari Tutorial TypeScript kita.

Operator

Operator digunakan untuk menentukan fungsi yang akan dilakukan pada data. Data tempat kerja operator disebut operand. Ada berbagai jenis operator di TypeScript seperti:

• Operator aritmatika
• Operator logika
• Operator relasional
• Operator bitwise
• Operator penugasan

Operator Aritmatika

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 ('Difference:' + res) res = num1 * num2 console.log ('Produk:' + res)

Keluaran:

Jumlah: 12
Selisih: 8
Produk: 20

Operator Logis

Contoh:

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

Keluaran:

Nilai rata-rata: 20, nilai persentase: 90
(rata-rata> 50) && (persentase> 80): salah

Operator Relasional

Contoh:

var num1: number = 10 var num2: number = 7 console.log ('Nilai num1:' + num1) console.log ('Nilai num2:' + num2) var res = num1> num2 console.log ('num1 lebih besar dari num2: '+ res) res = num1
 Keluaran: 
Nilai num1: 10 
 Nilai num2: 7 
 num1 lebih besar dari num2: true 
 num1 lebih kecil dari num2: false
 Operator Bitwise 
 Operator 
 Deskripsi 
 Bitwise DAN (&) 
melakukan operasi Boolean AND pada setiap bit dari argumen integernya.
 Bitwise ATAU (|) 
Ia melakukan operasi Boolean OR pada setiap bit argumen integernya.
 Bitwise XOR (^) 
Ia melakukan operasi Boolean eksklusif OR pada setiap bit argumen integernya.
 Bitwise NOT (~) 
Ini adalah operator unary dan beroperasi dengan membalik semua bit di operan.
 Pergeseran kiri (<<) 
Ini memindahkan semua bit di operan pertamanya ke kiri dengan jumlah tempat yang ditentukan di operan kedua.
 Shift Kanan (>>) 
Nilai operan kiri dipindahkan ke kanan dengan jumlah bit yang ditentukan oleh operan kanan.
 Shift Kanan dengan Nol (>>>) 
Ini mirip dengan >> operator, kecuali bit yang digeser di sebelah kiri selalu nol.
 Contoh: 
var a: number = 2 // Presentasi bit 10 var b: number = 3 // Presentasi bit 11 var result result = (a & b) console.log ('(a & b) =>', result) result = ( a | b) console.log ('(a | b) =>', hasil)
 Keluaran: 
(a & b) => 2 
 (a | b) => 3
 Operator Penugasan 
 Operator 
 Deskripsi 
 Tugas Sederhana (=) 
Menetapkan nilai dari operan sisi kanan ke operan sisi kiri
 Tambahkan dan tugaskan (+ =) 
Ini menambahkan operan kanan ke operan kiri dan memberikan hasilnya ke operan kiri.
 Kurangi dan tugaskan (- =) 
Ini mengurangi operan kanan dari operan kiri dan memberikan hasilnya ke operan kiri.
 Kalikan dan tugaskan (* =) 
Ini mengalikan operan kanan dengan operan kiri dan memberikan hasilnya ke operan kiri.
 Bagi dan tugaskan (/ =) 
Ini membagi operan kiri dengan operan kanan dan memberikan hasilnya ke operan kiri.
 Contoh: 
var a: nomor = 12 var b: nomor = 10 a = b konsol.log ('a = b:' + a) a + = b konsol.log ('a + = b:' + a) a - = b konsol .log ('a- = b:' + a)
 Keluaran: 
a = b: 10 
 a + = b: 20 
 a - = b: 10
Ini adalah operator yang berbeda. Sekarang mari kita lanjutkan dengan Tutorial TypeScript dan pelajari tentang loop.
 Loop 
Mungkin ada situasi ketika blok kode perlu dieksekusi beberapa kali. SEBUAH lingkaran pernyataan memungkinkan kita untuk mengeksekusi pernyataan atau sekelompok pernyataan beberapa kali.
Loop TypeScript dapat diklasifikasikan sebagai:
 Untuk Loop 
Itu untuk loop merupakan implementasi dari lingkaran pasti.
 Sintaksis: 
for (ekspresi pertama ekspresi kedua ekspresi ketiga) {// pernyataan harus dijalankan berulang kali}
Di sini, ekspresi pertama dieksekusi sebelum loop dimulai. Ekspresi kedua adalah kondisi untuk menjalankan loop. Dan ekspresi ketiga dieksekusi setelah eksekusi setiap blok kode.
 Contoh: 
untuk (misalkan i = 0 i<2 i++) { console.log ('Execute block statement' + i) }
 Keluaran: 
Jalankan pernyataan blok 0 
Jalankan pernyataan blok 1
 Sedangkan Loop 
Perulangan while mengeksekusi instruksi setiap kali kondisi yang ditentukan bernilai true.
 Sintaksis: 
while (ekspresi kondisi) {// blok kode akan dieksekusi}
 Contoh: 
misalkan i: bilangan = 1 sementara (i<3) { console.log( 'Block statement execution no.' + i ) i++ }
 Keluaran: 
Eksekusi pernyataan blok no. 1 
Eksekusi pernyataan blok no. 2
 Do..While Loop 
Pengulangan do & hellip While mirip dengan pengulangan while kecuali ia tidak mengevaluasi kondisi untuk pertama kali pengulangan dijalankan.
 Sintaksis: 
lakukan {// blok kode untuk dieksekusi} sementara (ekspresi kondisi)
 Contoh: 
  
let i: number = 1 do {console.log ('Block statement execution no.' + i) i ++} while (i<3)
 Keluaran: 
Eksekusi pernyataan blok no. 1 
Eksekusi pernyataan blok no. 2
Selain ini, ada pernyataan break dan lanjutkan di TypeScript yang digunakan dalam satu loop.
 Pernyataan Istirahat 
Pernyataan break digunakan untuk mengontrol konstruksi. Menggunakan pernyataan break dalam satu loop membantu program keluar dari loop.
memulai dengan meja kerja mysql
 Contoh: 
var i: number = 1 while (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
 Keluaran: 
Kelipatan 5 pertama antara 1 dan 10 adalah: 5
 Pernyataan Lanjutan 
Pernyataan lanjutkan melompati pernyataan berikutnya dalam iterasi saat ini dan mengambil kendali kembali ke awal pengulangan.
 Contoh: 
var num: number = 0 var count: number = 0 for (num = 0num<=10num++) { if (num % 2==0) { continue } count++ } console.log (' The count of odd values between 0 and 10 is: '+count)
 Keluaran: 
Jumlah nilai ganjil antara 0 dan 10 adalah: 5
Ini adalah loop berbeda dalam TypeScript. Sekarang, mari kita lanjutkan dengan Tutorial TypeScript dan memahami fungsi.
 Fungsi 
Dalam JavaScript, fungsi adalah salah satu bagian terpenting karena merupakan bahasa pemrograman fungsional. Fungsi memastikan bahwa program dapat dipelihara dan digunakan kembali, dan diatur ke dalam blok yang dapat dibaca. Meskipun TypeScript memberikan konsep kelas dan modul, fungsi masih merupakan bagian integral dari bahasa.
 Fungsi Bernama 
Fungsi bernama digunakan untuk mendeklarasikan dan memanggil fungsi dengan nama yang diberikan.
 Contoh: 
function display () {console.log ('TypeScript Function')} tampilan ()
 Keluaran: 
Fungsi TypeScript
 Fungsi Anonim 
Fungsi anonim adalah fungsi yang didefinisikan sebagai ekspresi. Ekspresi ini disimpan dalam sebuah variabel. Fungsi-fungsi ini dipanggil menggunakan nama variabel tempat fungsi tersebut disimpan.
 Contoh: 
biarkan salam = function () {console.log ('TypeScript Function')} salam ()
 Keluaran: 
Fungsi TypeScript
 Fungsi Panah 
Notasi panah gemuk digunakan untuk fungsi anonim yaitu untuk ekspresi fungsi. Mereka juga disebut fungsi lambda dalam bahasa lain.
 Sintaksis: 
(param1, param2, ..., paramN) => ekspresi
Menggunakan panah gemuk (=>) menghilangkan kebutuhan untuk menggunakan kata kunci 'function'. Parameter diteruskan dalam tanda kurung sudut, dan ekspresi fungsi diapit dalam tanda kurung kurawal {}.
 Contoh: 
let sum = (x: number, y: number): number => {return x + y} sum (10, 30) // mengembalikan 40
 Fungsi Overloading 
TypeScript memberikan konsep overloading fungsi. Dengan demikian, Anda dapat memiliki beberapa fungsi dengan nama yang sama tetapi tipe parameter dan tipe kembalian yang berbeda.
 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 memiliki fungsi add () yang sama dengan dua deklarasi fungsi dan satu implementasi fungsi. Tanda tangan pertama memiliki dua parameter tipe string, sedangkan tanda tangan kedua memiliki dua parameter nomor tipe.
Ini adalah berbagai jenis fungsi. Sekarang, mari kita lanjutkan dengan Tutorial TypeScript dan pahami string di TypeScript.
 Tutorial TypeScript: String 
Itu  adalah tipe data primitif lain yang digunakan untuk menyimpan data teks. Nilai string diapit oleh tanda kutip tunggal atau tanda kutip ganda.
 Sintaksis: 
var var_name = String baru (string)
Ada berbagai properti metode yang tersedia di objek String seperti:
 Pembangun - Ini mengembalikan referensi ke fungsi String yang membuat objek
 Panjangnya - Ini mengembalikan panjang string
 Prototipe - Properti ini memungkinkan Anda untuk menambahkan properti dan metode ke objek
 Contoh: 
let name = new String ('Selamat datang di Edureka!') console.log ('Message:' + name) console.log ('Length:' + name.length)
 Keluaran: 
Pesan: Selamat datang di Edureka! 
 Panjang: 19
 Metode String 
Daftar Metode di Objek String meliputi:
 metode 
 Deskripsi 
 charAt () 
Ini mengembalikan karakter pada indeks yang ditentukan
 charCodeAt () 
Ini mengembalikan angka yang menunjukkan nilai Unicode dari karakter pada indeks yang diberikan
 concat () 
Menggabungkan teks dari dua string dan mengembalikan string baru
 Indeks() 
Mengembalikan indeks dalam objek String pemanggil dari kemunculan pertama dari nilai yang ditentukan
 lastIndexOf () 
Ini mengembalikan indeks dalam objek String panggilan dari kemunculan terakhir dari nilai yang ditentukan
 pertandingan() 
Digunakan untuk mencocokkan ekspresi reguler dengan string
substring dalam contoh server sql
 localeCompare () 
Mengembalikan angka yang menunjukkan apakah string referensi muncul sebelum atau sesudah atau sama dengan string yang diberikan dalam urutan
 Cari() 
Ini mengeksekusi pencarian kecocokan antara ekspresi reguler dan string tertentu
 menggantikan() 
Digunakan untuk menemukan kecocokan antara ekspresi reguler dan string, dan untuk mengganti substring yang cocok dengan substring baru
 mengiris() 
Ini mengekstrak bagian dari string dan mengembalikan string baru
 membagi() 
Membagi objek String menjadi larik string dengan memisahkan string menjadi substring
 substr () 
Mengembalikan karakter dalam string yang dimulai di lokasi yang ditentukan melalui jumlah karakter yang ditentukan
 substring () 
Ini mengembalikan karakter dalam string antara dua indeks ke dalam string
 toLocaleLowerCase () 
Karakter dalam string diubah menjadi huruf kecil dengan tetap memperhatikan lokal saat ini
 toLocaleUpperCase () 
Karakter dalam string diubah menjadi huruf besar dengan tetap memperhatikan lokal saat ini
 toLowerCase () 
Ini mengembalikan nilai string panggilan yang dikonversi ke huruf kecil
 toUpperCase () 
Ini mengembalikan nilai string panggilan yang diubah menjadi huruf besar
 toString () 
Mengembalikan string yang mewakili objek tertentu
 Nilai dari() 
Mengembalikan nilai primitif dari objek yang ditentukan
 Contoh: 
let str: string = 'Selamat datang di Edureka' str.charAt (0) // return 'w' str.charAt (2) // return 'l' 'Welcome to Edureka'.charAt (2) return' l 'let str1 : string = 'welcome' let str2: string = 'Edureka' str1.concat (str2) // return 'welcomeEdureka' str1.concat ('', str2) // return 'welcome Edureka' str1.concat ('' to ' ') // mengembalikan' selamat datang di '
Sekarang setelah Anda mengetahui tentang string, mari kita lanjutkan dengan tutorial TypeScript dan memahami array.
 Array dalam TypeScript 
Sebuah Himpunan adalah tipe khusus dari tipe data yang menyimpan banyak nilai dari tipe data berbeda secara berurutan menggunakan sintaks khusus. Elemen array diidentifikasi oleh integer unik yang disebut subskrip atau indeks elemen.
 Sintaksis: 
var array_name [: datatype] // deklarasi nama_array = [val1, val2, valn ..] // inisialisasi
 Contoh: 
let names: Array names = ['John', 'Daisy', 'Rachel'] let ids: Array ids = [101, 700, 321]
 Metode Array 
Berikut adalah daftar metode Array berbeda yang dapat digunakan untuk tujuan berbeda:
 metode 
 Deskripsi 
 Saring() 
Membuat larik baru dengan semua elemen larik ini yang fungsi pemfilterannya mengembalikan nilai true
 setiap() 
Mengembalikan nilai true jika setiap elemen dalam larik ini memenuhi fungsi pengujian yang disediakan
 concat () 
Mengembalikan larik baru yang terdiri dari larik ini yang digabungkan dengan larik lain
 Indeks() 
Mengembalikan indeks pertama atau terkecil dari sebuah elemen dalam larik yang sama dengan nilai yang ditentukan
 untuk setiap() 
Memanggil fungsi untuk setiap elemen dalam larik
 Ikuti() 
Menggabungkan semua elemen array menjadi string
 lastIndexOf () 
Mengembalikan indeks terakhir atau terbesar dari sebuah elemen dalam larik yang sama dengan nilai yang ditentukan
 peta() 
Membuat array baru dengan hasil pemanggilan fungsi yang disediakan pada setiap elemen dalam array ini
 Dorong() 
Menambahkan satu atau lebih elemen ke akhir larik dan mengembalikan panjang larik yang baru
 pop () 
Menghapus elemen terakhir dari larik dan mengembalikan elemen itu
 mengurangi() 
Menerapkan fungsi secara bersamaan terhadap dua nilai larik dari kiri ke kanan untuk menguranginya menjadi satu nilai
 reduceRight () 
Menerapkan fungsi secara bersamaan terhadap dua nilai array dari kanan ke kiri untuk menguranginya menjadi satu nilai
 balik() 
Membalik urutan elemen array
 bergeser() 
Menghapus elemen pertama dari array dan mengembalikan elemen itu
 mengiris() 
Mengekstrak bagian dari larik dan mengembalikan larik baru
 beberapa() 
Ini mengembalikan nilai true jika setidaknya satu elemen dalam larik ini memenuhi fungsi pengujian yang disediakan
 menyortir() 
Ini mengurutkan elemen dari sebuah array
 toString () 
Mengembalikan string yang mewakili larik dan elemennya
 sambatan() 
Ini menambah dan / atau menghapus elemen dari array
 unshift () 
Menambahkan satu atau lebih elemen ke depan larik dan mengembalikan panjang larik yang baru
 Contoh: 
var name: Array = ['John', 'Daisy', 'Tara'] name.sort () console.log (name) // output: ['Daisy', 'John', 'Tara'] console.log ( name.pop ()) // keluaran: Tara name.push ('Rachel') console.log (name) // keluaran: ['John', 'Daisy', 'Rachel']
Sekarang mari kita lanjutkan dengan Tutorial TypeScript dan pelajari tentang Antarmuka.
 Antarmuka TypeScript 
Antarmuka adalah struktur yang menentukan kontrak dalam aplikasi Anda. Ini mendefinisikan sintaks untuk diikuti kelas. Ini hanya berisi pernyataan anggota dan itu adalah tanggung jawab kelas turunan untuk mendefinisikan anggota.
 Contoh: 
antarmuka Karyawan {empID: number empName: string getSalary: (number) => number // fungsi panah getManagerName (number): string}
Dalam contoh di atas, file Karyawan antarmuka mencakup dua properti empID dan empName . Ini juga mencakup deklarasi metode getSalaray menggunakan fungsi panah yang mencakup satu parameter angka dan tipe pengembalian angka. Itu getManagerName metode dideklarasikan menggunakan fungsi normal.
 TypeScript  Kelas 
TypeScript memperkenalkan kelas sehingga mereka dapat memanfaatkan manfaat dari teknik berorientasi objek seperti enkapsulasi dan abstraksi. Kelas di TypeScript dikompilasi ke fungsi JavaScript biasa oleh compiler TypeScript untuk bekerja di seluruh platform dan browser.
Kelas A mencakup yang berikut:
 Pembangun 
 Properti 
 Metode 
 Contoh: 
class Karyawan {empID: number empName: konstruktor string (ID: number, name: string) {this.empName = name this.empID = ID} getSalary (): number {return 40000}}
 Warisan 
TypeScript mendukung Warisan karena ini adalah kemampuan program untuk membuat kelas baru dari kelas yang sudah ada. Kelas yang diperluas untuk membuat kelas yang lebih baru disebut kelas induk atau kelas super. Kelas yang baru dibuat disebut anak atau sub kelas.
Sebuah kelas mewarisi dari kelas lain menggunakan kata kunci 'meluas'. Kelas anak mewarisi semua properti dan metode kecuali anggota pribadi dan konstruktor dari kelas induk. Tapi, TypeScript tidak mendukung multiple inheritance.
 Sintaksis: 
class child_class_name extends parent_class_name
 Contoh: 
class Person {name: string constructor (name: string) {this.name = name}} class Employee extends Person {empID: number constructor (empID: number, name: string) {super (name) this.empID = empid} displayName (): void {console.log ('Name =' + this.name + ', Employee ID =' + this.empID)}} biarkan emp = new Employee (701, 'Jason') emp.displayName () // Nama = Jason, ID Karyawan = 701
Sekarang setelah Anda mengetahui tentang kelas, mari lanjutkan dengan Tutorial TypeScript dan pelajari tentang Objek.
 Objek di TypeScript 
Objek adalah instance yang berisi kumpulan pasangan kunci-nilai yang berbeda. Nilainya dapat berupa nilai atau fungsi skalar atau bahkan larik objek lain.
 Sintaksis: 
var object_name = {key1: 'value1', // scalar value key2: 'value', key3: function () {// functions}, key4: ['content1', 'content2']
Sebuah objek dapat berisi nilai skalar, fungsi dan struktur seperti array dan tupel.
 Contoh: 
var person = {firstname: 'Danny', lastname: 'Green'} // akses nilai objek console.log (person.firstname) console.log (person.lastname)
Saat kompilasi, itu akan menghasilkan kode yang sama di JavaScript.
 Keluaran: 
Danny 
 hijau
Ini adalah elemen penting yang berbeda dari TypeScript. Sekarang, mari kita lanjutkan dengan Tutorial TypeScript dan lihat contoh untuk memahami kasus penggunaan.
 Tutorial TypeScript: Kasus Penggunaan 
Di sini, kita akan belajar bagaimana mengubah yang sudah ada  ke TypeScript.
Saat kami mengompilasi file TypeScript, ini menghasilkan file JavaScript yang sesuai dengan nama yang sama. Di sini, kita perlu memastikan bahwa file JavaScript asli kita yang bertindak sebagai input tidak boleh berada di direktori yang sama sehingga TypeScript tidak menimpanya.
Proses untuk bermigrasi dari JavaScript ke TypeScript mencakup langkah-langkah berikut:
 1. Tambahkan file tsconfig.json ke proyek 
Anda perlu menambahkan file tsconfig.json ke proyek. TypeScript menggunakan file tsconfig.json untuk mengelola opsi kompilasi proyek, seperti file mana yang ingin Anda sertakan dan kecualikan.
{'compilerOptions': {'outDir': './built', 'allowJs': true, 'target': 'es5'}, 'include': ['./src/**/*']}
 2. Integrasikan dengan alat pembuat 
Sebagian besar proyek JavaScript memiliki alat build terintegrasi seperti gulp atau webpack. Anda dapat mengintegrasikan proyek dengan webpack dengan cara berikut:
Jalankan perintah berikut di terminal:
$ npm install awesome-typescript-loader source-map-loader
Dalam integrasi webpack, Anda menggunakan awesome-typescript-loader yang dikombinasikan dengan source-map-loader untuk memudahkan proses debug kode sumber.
Kedua, gabungkan properti config modul di file webpack.config.js kita untuk menyertakan loader.
 3. Pindahkan semua file .js ke file .ts 
Pada langkah ini, Anda harus mengganti nama file .js menjadi file .ts. Demikian pula, jika file menggunakan JSX, Anda perlu mengganti namanya menjadi .tsx. Sekarang, jika kita membuka file itu di editor yang mendukung TypeScript, beberapa kode mungkin mulai memberikan kesalahan kompilasi. Jadi, mengonversi file satu per satu memungkinkan penanganan kesalahan kompilasi lebih mudah. Jika TypeScript menemukan kesalahan kompilasi selama konversi, itu masih dapat menerjemahkan kode.
 4. Periksa kesalahan 
Setelah memindahkan file js ke file ts, segera TypeScript akan memulai Type Checking dari kode kita. Jadi, Anda mungkin mendapatkan kesalahan diagnostik dalam kode JavaScript.
 5. Gunakan Pustaka JavaScript pihak ketiga 
Proyek JavaScript menggunakan pustaka pihak ketiga seperti  atau Lodash. Untuk mengompilasi file, TypeScript perlu mengetahui tipe semua objek di pustaka ini. File definisi TypeScript Type untuk pustaka JavaScript sudah tersedia di DefinitelyTyped. Jadi, tidak perlu menginstal jenis ini secara eksternal. Anda hanya perlu menginstal jenis yang digunakan dalam proyek kami.
Untuk jQuery, Anda dapat menginstal definisi:
$ npm install @ types / jquery
Setelah ini, buat perubahan pada proyek JavaScript, jalankan alat build. Sekarang, Anda harus memiliki proyek TypeScript yang dikompilasi menjadi JavaScript biasa yang dapat dijalankan di browser.
Dengan ini, kita sampai pada akhir Tutorial TypeScript. Saya harap Anda memahami semua elemen penting dari TypeScript.
 Lihat     oleh Edureka.  Pelatihan Sertifikasi Pengembangan Web akan membantu Anda Mempelajari cara membuat situs web yang mengesankan menggunakan HTML5, CSS3, Twitter Bootstrap 3, jQuery, dan Google API, serta menerapkannya ke Amazon Simple Storage Service (S3). 
 Ada pertanyaan untuk kami? Harap sebutkan di bagian komentar 'Tutorial TypeScript' dan kami akan menghubungi Anda kembali.