Typescript ve jQuery

Typescript ve jQuery javascript kütüphanesini birlikte nasıl kullanabiliriz?

Typescript, microsoft tarafından geliştirilmiş olan, açık kaynak kodlu bir programlama dilidir. Javascriptin bir üst kümesidir. Peki Typescript diye bir dile neden gereksinim duyulmuştur?

Şöyle söyleyelim, Typescript bize javascriptin mevcut haliyle desteklemediği sınıf bazlı nesne yönelimli, es2015 standardında kod yazma imkanları sunmaktadır. Bunun dışında statik tip kontrolü yaparak, bizi olması muhtemel pek çok bug’dan kurtarmaktadır. Düz javascript yazarken bildiğiniz gibi, bir değişkene istediğiniz tipten veriyi set edebiliyoruz. Örneğin değişkene numerik bir değer verdiğimiz satırdan bir kaç satır sonra, aynı değişkene string değerini set edebiliyoruz. Typescript compileri (tsc.exe) kodumuzu düz javascript koduna çevirirken, bu tutarsızlıkları kontrol ederek bize uyarı vermektedir.

Node.js ile Ortamımızı Oluşturuyoruz

Bir klasör oluşturalım.

Ortamımızda node.js kurulu olması gerekiyor, çünkü nodejs ile birlikte gelen npm aracını kullanacağız.

Öncelikle typescript ve typings paketlerini global olarak kuralım.

jquery type dosyalarını yükleyelim

jquery’nin kendisini yükleyelim.

Normalde tsc.exe komutunu kullanırken, bazı parametreleri girmemiz gerekiyor. Fakat biz her seferinde aynı parametreleri girmek istemediğimiz için tsconfig.json dosyası oluşturup, parametrelerimizi orada belirteceğiz.

tsconfig.json dosyası:

Kök dizinimize app.ts dosyasını ekleyelim: İlk satırda,  referans belirttiğimiz için, Visual Studio Code’da kod tamamlama (intellisense) özellikleri de çalışacaktır.

Yine kök dizinine Index.html dosyasını ekleyelim; Bu dosyada, hem jquery hem de app.js dosyalarını script src olarak eklememiz gerekiyor:

Görüldüğü gibi Typescript sayesinde app.ts’de es2015 standardıyla gelmiş olan lambda özelliğini ve let değişken tanımlama yapısını kullanabildik. Bu basit temel üzerinde denemeler yapabilirsiniz. Örneğin jquery text() metoduna iki parametre girecek olursanız, Typescript derleyicisi bize uyarı verecektir. Düz javascript kodu yazdığımızda ise herhangi bir uyarı vermeyeceği için, hatayı ancak çalışma zamanında ortaya çıkınca görebileceğiz. Bu açıdan bakıldığında, Typescript, kodlarımızı daha sağlam ve bakımı kolay bir noktaya taşıyacaktır.

Yorum Gönder

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir