TypeScript dilinin ne olduğunu açıklayabilir misiniz?
JavaScript'in ya da mevcut kütüphanelerin yapamadığı neyi yapabilir ki onu düşünmem için bir sebep olsun?
Bu cevabı ilk olarak Typescript henüz baskıdan yeni çıktı. Beş yıl sonra, bu iyi bir genel bakış, ama bakın daha fazla derinlik için aşağıdaki Lodewijk'in cevabına bakınız
Ne demek istediğimi anlamak için dille ilgili Microsoft'un tanıtım videosunu izleyin.
Büyük bir JavaScript projesi için TypeScript'in benimsenmesi, normal bir JavaScript uygulamasının çalışacağı yerlere dağıtılabilirken daha sağlam bir yazılımla sonuçlanabilir.
Açık kaynak kodludur, ancak yalnızca desteklenen bir IDE kullanıyorsanız yazarken akıllı Intellisense'e sahip olursunuz. Başlangıçta, bu yalnızca Microsoft'un Visual Studio'suydu (ayrıca Miguel de Icaza blog yazısında da belirtilmiştir). Bu günlerde, diğer IDE'ler de TypeScript desteği sunuyor.
Örnek olarak, işte biraz TypeScript (bununla TypeScript Playground'da oynayabilirsiniz)
class Greeter {
greeting: string;
constructor (message: string) {
this.greeting = message;
}
greet() {
return "Hello, " + this.greeting;
}
}
Ve işte üreteceği JavaScript
var Greeter = (function () {
function Greeter(message) {
this.greeting = message;
}
Greeter.prototype.greet = function () {
return "Hello, " + this.greeting;
};
return Greeter;
})();
TypeScript'in üye değişkenlerin ve sınıf yöntemi parametrelerinin türünü nasıl tanımladığına dikkat edin. Bu JavaScript'e çevrilirken kaldırılır, ancak IDE ve derleyici tarafından yapıcıya sayısal bir tür geçirmek gibi hataları tespit etmek için kullanılır.
Ayrıca, açıkça bildirilmemiş türleri de çıkarabilir; örneğin, greet()
yönteminin bir string döndürdüğünü belirleyebilir.
TypeScript, JavaScript'in düz olarak derlenen bir üst kümesidir JavaScript - typescriptlang.org. JavaScript, birçok farklı paydaştan oluşan bir grup insan olan EMCA's Technical Committee 39 tarafından geliştirilen bir programlama dilidir. TC39, ECMA tarafından barındırılan bir komitedir: bir iç standartlar organizasyonu. JavaScript'in birçok farklı satıcı tarafından (örneğin Google, Microsoft, Oracle, vb.) birçok farklı uygulaması vardır. JavaScript'in amacı web'in ortak dili olmaktır. TypeScript, JavaScript dilinin tek bir açık kaynak derleyicisine sahip olan ve esas olarak tek bir satıcı tarafından geliştirilen bir üst kümesidir: Microsoft. TypeScript'in amacı, bir tip sistemi aracılığıyla hataları erken yakalamaya yardımcı olmak ve JavaScript geliştirmeyi daha verimli hale getirmektir. Esasen TypeScript hedeflerine üç şekilde ulaşır:
- Modern JavaScript özellikleri için destek - JavaScript dili (çalışma zamanı değil) ECMAScript standartları aracılığıyla standartlaştırılmıştır. Tüm tarayıcılar ve JavaScript çalışma zamanları tüm ECMAScript standartlarının tüm özelliklerini desteklemez (bkz. bu genel bakış). TypeScript, en son ECMAScript özelliklerinin çoğunun kullanılmasına izin verir ve bunları seçtiğiniz eski ECMAScript hedeflerine çevirir (`--target' derleyici seçeneği altındaki derleme hedefleri listesine bakın). Bu, eski tarayıcılar ve JavaScript çalışma zamanlarıyla geriye dönük uyumlu kalırken modüller, lambda fonksiyonları, sınıflar, yayma operatörü ve yeniden yapılandırma gibi yeni özellikleri güvenle kullanabileceğiniz anlamına gelir.
- Gelişmiş tip sistemi - Tip desteği ECMAScript standardının bir parçası değildir ve JavaScript'in derlenmiş doğası yerine yorumlanmış doğası nedeniyle muhtemelen hiçbir zaman olmayacaktır. TypeScript'in tip sistemi inanılmaz derecede zengindir ve şunları içerir: arayüzler, enum'lar, hibrit tipler, jenerikler, union/kesişim tipleri, erişim değiştiricileri ve çok daha fazlası. TypeScript'in resmi web sitesi bu özelliklere genel bir bakış sunmaktadır. Typescript'in tip sistemi diğer tipli dillerin çoğuyla aynı seviyededir ve bazı durumlarda tartışmasız daha güçlüdür.
- Geliştirici araç desteği - TypeScript'in derleyicisi, hem artımlı derlemeyi hem de IDE entegrasyonunu desteklemek için bir arka plan işlemi olarak çalışabilir, böylece kod tabanınızda daha kolay gezinebilir, sorunları belirleyebilir, olasılıkları inceleyebilir ve yeniden düzenleyebilirsiniz.
TypeScript'in diğer JavaScript hedefleme dilleriyle ilişkisi
TypeScript, JavaScript'e derlenen diğer dillere kıyasla benzersiz bir felsefeye sahiptir. JavaScript kodu geçerli TypeScript kodudur; TypeScript JavaScript'in bir üst kümesidir. Neredeyse
.js
dosyalarınızı.ts
dosyaları olarak yeniden adlandırabilir ve TypeScript kullanmaya başlayabilirsiniz (aşağıdaki "JavaScript birlikte çalışabilirliği" bölümüne bakın). TypeScript dosyaları okunabilir JavaScript'e derlenir, böylece geri geçiş mümkündür ve derlenmiş TypeScript'i anlamak hiç de zor değildir. TypeScript, JavaScript'in zayıf yönlerini geliştirirken başarılarını da temel alır. Bir yandan, modern ECMAScript standartlarını alan ve en popüler olanı Babel olan eski JavaScript sürümlerine kadar derleyen geleceğe yönelik araçlara sahipsiniz. Öte yandan, JavaScript'i hedef alan CoffeeScript, Clojure, Dart, Elm, Haxe, Scala.js ve çok daha fazlası gibi JavaScript'ten tamamen farklı olabilecek dillere sahipsiniz (bu listeye bakın). Bu diller, JavaScript'in geleceğinden daha iyi olsalar da, geleceklerinin garanti altına alınması için yeterli benimsenme bulamama riski daha yüksektir. Ayrıca, bu dillerden bazıları için deneyimli geliştirici bulmakta daha fazla sorun yaşayabilirsiniz, ancak bulacaklarınız genellikle daha hevesli olabilir. JavaScript ile etkileşim de biraz daha karmaşık olabilir, çünkü JavaScript'in gerçekte ne olduğundan daha uzaktırlar. TypeScript bu iki uç arasında yer alır ve böylece riski dengeler. TypeScript herhangi bir standarda göre riskli bir seçim değildir. Tamamen farklı bir dil olmadığı, mükemmel JavaScript birlikte çalışabilirlik desteğine sahip olduğu ve son zamanlarda çok fazla benimsendiği için JavaScript'e aşina iseniz alışmak çok az çaba gerektirir.İsteğe bağlı olarak statik tipleme ve tip çıkarımı
JavaScript dinamik olarak yazılır. Bu, JavaScript'in bir değişkenin çalışma zamanında gerçekten örneklenene kadar ne tür olduğunu bilmediği anlamına gelir. Bu aynı zamanda çok geç olabileceği anlamına da gelir. TypeScript, JavaScript'e tür desteği ekler. Bazı değişkenlerin belirli bir türde olduğuna dair yanlış varsayımlardan kaynaklanan hatalar, kartlarınızı doğru oynarsanız tamamen ortadan kaldırılabilir (kodunuzu ne kadar sıkı yazdığınız veya kodunuzu hiç yazıp yazmadığınız size bağlıdır). TypeScript, tip çıkarımını kullanarak yazmayı biraz daha kolay ve çok daha az açık hale getirir. Örneğin: TypeScript'te
var x = "hello"
,var x : string = "hello"
ile aynıdır. Tip basitçe kullanımından çıkarılır. Tipleri açıkça yazmasanız bile, aksi takdirde çalışma zamanı hatasına neden olacak bir şey yapmaktan sizi kurtarmak için hala oradalar. TypeScript varsayılan olarak isteğe bağlı olarak yazılır. Örneğinfunction divideByTwo(x) { return x / 2 }
TypeScript'te herhangi bir tür parametre ile çağrılabilen geçerli bir fonksiyondur, ancak bir dize ile çağrılması açıkça çalışma zamanı hatasına neden olur. Tıpkı JavaScript'te alışık olduğunuz gibi. Bu işe yarar, çünkü divideByTwo örneğinde olduğu gibi, açıkça bir tür atanmadığında ve tür çıkarılamadığında, TypeScript dolaylı olarakany
türünü atayacaktır. Bu, divideByTwo fonksiyonunun tip imzasının otomatik olarakfunction divideByTwo(x : any) : any
olacağı anlamına gelir. Bu davranışa izin vermemek için bir derleyici bayrağı vardır:--noImplicitAny
. Bu bayrağı etkinleştirmek size daha fazla güvenlik sağlar, ancak aynı zamanda daha fazla yazmanız gerekeceği anlamına gelir. Türlerin kendileriyle ilişkili bir maliyeti vardır. Her şeyden önce, bir öğrenme eğrisi vardır ve ikincisi, elbette, uygun katı yazım kullanarak bir kod tabanı kurmak da size biraz daha fazla zamana mal olacaktır. Benim deneyimlerime göre, başkalarıyla paylaştığınız ciddi bir kod tabanında bu maliyetler tamamen buna değer. Github'da Programlama Dilleri ve Kod Kalitesi Üzerine Büyük Ölçekli Bir Çalışma, "statik olarak yazılan dillerin genel olarak dinamik tiplere göre daha az hataya eğilimli olduğunu ve aynı bağlamda güçlü yazmanın zayıf yazmaya göre daha iyi olduğunu" öne sürmektedir. Aynı makalenin TypeScript'in JavaScript'ten daha az hataya eğilimli olduğunu bulması ilginçtir: Pozitif katsayılara sahip olanlar için dilin ceteris paribus, daha fazla sayıda kusur düzeltmesi ile ilişkilidir. Bu diller arasında C, C++, JavaScript, Objective-C, Php ve Python. Clojure, Haskell, Ruby, Scala ve TypeScript dilleri, hepsinin negatif katsayıları vardır, bu da bu dillerin daha az hata düzeltici taahhütlerle sonuçlanma olasılığı ortalamadan daha yüksektir.Geliştirilmiş IDE desteği
TypeScript ile geliştirme deneyimi JavaScript'e göre büyük bir gelişmedir. IDE, TypeScript derleyicisi tarafından zengin tür bilgileri hakkında gerçek zamanlı olarak bilgilendirilir. Bu, birkaç önemli avantaj sağlar. Örneğin, TypeScript ile kod tabanınızın tamamında yeniden adlandırma gibi refactoring işlemlerini güvenle yapabilirsiniz. Kod tamamlama sayesinde, bir kütüphanenin sunabileceği her türlü işlev hakkında satır içi yardım alabilirsiniz. Artık bunları hatırlamanıza veya çevrimiçi referanslarda aramanıza gerek yok. Derleme hataları, siz kodlama ile meşgulken doğrudan IDE'de kırmızı dalgalı bir çizgi ile bildirilir. Sonuç olarak, bu JavaScript ile çalışmaya kıyasla üretkenlikte önemli bir kazanç sağlar. Kişi kodlamaya daha fazla, hata ayıklamaya ise daha az zaman ayırabilir. Visual Studio Code, WebStorm, Atom ve Sublime gibi TypeScript için mükemmel desteğe sahip çok çeşitli IDE'ler vardır.
Sıkı null kontrolleri
Tanımlanmamış 'x' özelliği okunamıyor
veya
tanımlanmamış bir fonksiyon değilşeklindeki çalışma zamanı hataları genellikle JavaScript kodundaki hatalardan kaynaklanır. TypeScript derleyicisi tarafından bilinmeyen bir değişken kullanılamayacağı için (
herhangitipteki değişkenlerin özellikleri hariç), TypeScript zaten bu tür hataların oluşma olasılığını azaltır. Yine de
undefinedolarak ayarlanmış bir değişkeni yanlışlıkla kullanmak hala mümkündür. Ancak TypeScript'in 2.0 sürümüyle birlikte, nullable olmayan türlerin kullanımıyla bu tür hataları tamamen ortadan kaldırabilirsiniz. Bu şu şekilde çalışır: Sıkı null kontrolleri etkinleştirildiğinde (
--strictNullChecksderleyici bayrağı), TypeScript derleyicisi, siz açıkça nullable türde olduğunu bildirmediğiniz sürece bir değişkene
undefinedatanmasına izin vermez. Örneğin,
let x : number = undefinedbir derleme hatasıyla sonuçlanacaktır. Bu,
undefinedbir sayı olmadığı için tip teorisine mükemmel bir şekilde uyar. Bunu düzeltmek için
x,
numberve
undefinedtürlerinin toplamı olacak şekilde tanımlanabilir: let x : sayı | tanımsız = tanımsız
. Bir türün nullable olduğu bilindiğinde, yaninull
veyaundefined
değerine sahip olabilecek bir türde olduğunda, TypeScript derleyicisi kontrol akışı tabanlı tür analizi yoluyla kodunuzun bir değişkeni güvenli bir şekilde kullanıp kullanamayacağını belirleyebilir. Başka bir deyişle, örneğin birif
deyimi aracılığıyla bir değişkeninundefined
olduğunu kontrol ettiğinizde, TypeScript derleyicisi, kodunuzun kontrol akışının o dalındaki türün artık null olmadığını ve bu nedenle güvenle kullanılabileceğini çıkaracaktır. İşte basit bir örnek:
let x: number | undefined;
if (x !== undefined) x += 1; // this line will compile, because x is checked.
x += 1; // this line will fail compilation, because x might be undefined.
TypeScript'in 2016 konferansı eş tasarımcısı Anders Hejlsberg, yapı sırasında bu özelliğin ayrıntılı bir açıklamasını ve gösterimini yaptı: video (44:30'dan 56:30'a kadar).
TypeScript'i kullanmak için JavaScript koduna derlemek üzere bir derleme işlemine ihtiyacınız vardır. Derleme işlemi, elbette projenizin boyutuna bağlı olarak genellikle yalnızca birkaç saniye sürer. TypeScript derleyicisi, sonraki tüm değişikliklerin daha hızlı derlenebilmesi için artımlı derlemeyi (--watch
derleyici bayrağı) destekler.
TypeScript derleyicisi, oluşturulan .js dosyalarında kaynak eşleme bilgilerini satır içine alabilir veya ayrı .map dosyaları oluşturabilir. Kaynak haritası bilgileri, Chrome DevTools ve diğer IDE'ler gibi hata ayıklama yardımcı programları tarafından JavaScript'teki satırları TypeScript'te bunları oluşturan satırlarla ilişkilendirmek için kullanılabilir. Bu, çalışma zamanı sırasında doğrudan TypeScript kodunuz üzerinde kesme noktaları ayarlamanızı ve değişkenleri incelemenizi mümkün kılar. Kaynak haritası bilgileri oldukça iyi çalışır, TypeScript'ten çok önce de vardı, ancak TypeScript'te hata ayıklama genellikle doğrudan JavaScript kullanırken olduğu kadar iyi değildir. Örneğin this
anahtar sözcüğünü ele alalım. ES2015'ten bu yana this
anahtar sözcüğünün kapanışlarla ilgili değişen semantiği nedeniyle, this
aslında çalışma zamanı sırasında _this
adlı bir değişken olarak var olabilir (bkz. bu yanıt). Bu, hata ayıklama sırasında kafanızı karıştırabilir, ancak bunu biliyorsanız veya JavaScript kodunu incelerseniz genellikle sorun olmaz. Babel'in de aynı tür bir sorundan muzdarip olduğu unutulmamalıdır.
TypeScript derleyicisinin yapabileceği decorators'e dayalı durdurma kodu oluşturma, farklı modül sistemleri için modül yükleme kodu oluşturma ve JSX'i ayrıştırma gibi birkaç numara daha vardır. Ancak, muhtemelen Typescript derleyicisinin yanı sıra bir derleme aracına ihtiyacınız olacaktır. Örneğin, kodunuzu sıkıştırmak istiyorsanız, bunu yapmak için derleme sürecinize başka araçlar eklemeniz gerekecektir.
Webpack]13, Gulp, Grunt ve hemen hemen tüm diğer JavaScript derleme araçları için TypeScript derleme eklentileri mevcuttur. TypeScript dokümantasyonunda derleme araçlarıyla entegrasyon hakkında hepsini kapsayan bir bölüm vardır. Daha fazla derleme zamanı kontrolü istemeniz durumunda bir linter de mevcuttur. Ayrıca TypeScript'i Angular 2, React, Ember, SystemJS, Webpack, Gulp, vb. gibi bir dizi başka teknolojiyle birlikte kullanmaya başlamanızı sağlayacak çok sayıda tohum proje de bulunmaktadır.
TypeScript, JavaScript ile çok yakından ilişkili olduğu için birlikte çalışabilirlik açısından harika özelliklere sahiptir, ancak TypeScript'te JavaScript kütüphaneleri ile çalışmak için bazı ekstra çalışmalar yapılması gerekir. TypeScript derleyicisinin _.groupBy
veya angular.copy
veya $.fadeOut
gibi işlev çağrılarının aslında yasa dışı ifadeler olmadığını anlaması için TypeScript tanımları gereklidir. Bu işlevler için tanımlar .d.ts
dosyalarına yerleştirilir.
Bir tanımın alabileceği en basit biçim, bir tanımlayıcının herhangi bir şekilde kullanılmasına izin vermektir. Örneğin, Lodash kullanırken, tek satırlık bir tanım dosyası declare var _ : any
, _
üzerinde istediğiniz herhangi bir işlevi çağırmanıza izin verecektir, ancak bu durumda elbette yine de hata yapabilirsiniz: _.foobar()` yasal bir TypeScript çağrısı olabilir, ancak elbette çalışma zamanında yasadışı bir çağrıdır. Uygun tip desteği ve kod tamamlama istiyorsanız, tanım dosyanızın daha kesin olması gerekir (bir örnek için lodash definitions'ye bakın).
Kendi tür tanımlarıyla önceden paketlenmiş olarak gelen Npm modülleri, TypeScript derleyicisi tarafından otomatik olarak anlaşılır (bkz. belgeler). Kendi tanımlarını içermeyen hemen hemen tüm diğer yarı popüler JavaScript kütüphaneleri için birileri zaten başka bir npm modülü aracılığıyla tür tanımlarını kullanılabilir hale getirmiştir. Bu modüllerin önüne "@types/" eklenir ve DefinitelyTyped adlı bir Github deposundan gelir.
Bir uyarı var: tip tanımları, çalışma zamanında kullandığınız kütüphanenin sürümüyle eşleşmelidir. Aksi takdirde TypeScript, derleme zamanında türler çalışma zamanıyla eşleşmediği için var olan bir işlevi çağırmanıza veya bir değişkene atıfta bulunmanıza izin vermeyebilir ya da var olmayan bir işlevi çağırmanıza veya bir değişkene atıfta bulunmanıza izin verebilir. Bu nedenle, kullandığınız kütüphanenin doğru sürümü için tür tanımlarının doğru sürümünü yüklediğinizden emin olun.
Dürüst olmak gerekirse, bu biraz zahmetli bir iştir ve TypeScript'i seçmemenizin nedenlerinden biri olabilir, bunun yerine Babel gibi tip tanımlarını almak zorunda kalmayan bir şeyi tercih edebilirsiniz. Öte yandan, ne yaptığınızı biliyorsanız, yanlış veya eksik tanım dosyalarının neden olduğu her türlü sorunun üstesinden kolayca gelebilirsiniz.
Herhangi bir .js' dosyası bir
.ts' dosyası olarak yeniden adlandırılabilir ve TypeScript derleyicisinden geçirilerek sözdizimsel olarak aynı JavaScript kodu çıktı olarak alınabilir (eğer ilk etapta sözdizimsel olarak doğruysa). TypeScript derleyicisi derleme hataları alsa bile yine de bir .js
dosyası üretecektir. Hatta --allowJs
bayrağı ile .js
dosyalarını girdi olarak kabul edebilir. Bu, TypeScript ile hemen başlamanızı sağlar. Ne yazık ki, başlangıçta derleme hataları oluşması muhtemeldir. Bunların diğer derleyicilerde alışık olduğunuz gibi gösteriyi durduran hatalar olmadığını unutmamak gerekir.
Bir JavaScript projesini TypeScript projesine dönüştürürken başlangıçta karşılaşılan derleme hataları, TypeScript'in doğası gereği kaçınılmazdır. TypeScript tüm kodların geçerliliğini kontrol eder ve bu nedenle kullanılan tüm fonksiyonlar ve değişkenler hakkında bilgi sahibi olması gerekir. Bu nedenle, tür tanımlarının hepsi için yerinde olması gerekir, aksi takdirde derleme hatalarının oluşması kaçınılmazdır. Yukarıdaki bölümde belirtildiği gibi, hemen hemen her JavaScript çerçevesi için DefinitelyTyped paketlerinin kurulumuyla kolayca elde edilebilecek .d.ts
dosyaları vardır. Bununla birlikte, TypeScript tanımlarının bulunmadığı belirsiz bir kütüphane kullanmış veya bazı JavaScript ilkellerini çoklu doldurmuş olabilirsiniz. Bu durumda, derleme hatalarının ortadan kalkması için bu bitler için tip tanımları sağlamanız gerekir. Sadece bir .d.ts' dosyası oluşturun ve TypeScript derleyicisi tarafından her zaman dikkate alınması için tsconfig.json'ın
files' dizisine ekleyin. İçinde TypeScript'in bilmediği bitleri any
tipi olarak bildirin. Tüm hataları ortadan kaldırdıktan sonra, ihtiyaçlarınıza göre bu kısımlara kademeli olarak yazım ekleyebilirsiniz.
TypeScript'i derleme işlem hattına dahil etmek için derleme işlem hattınızı (yeniden) yapılandırma üzerinde de biraz çalışmanız gerekecektir. Derleme ile ilgili bölümde de belirtildiği gibi çok sayıda iyi kaynak bulunmaktadır ve çalışmak istediğiniz araçların kombinasyonunu kullanan tohum projeleri aramanızı tavsiye ederim.
En büyük engel öğrenme eğrisidir. İlk başta küçük bir proje ile oynamanızı öneririm. Nasıl çalıştığına, nasıl derlendiğine, hangi dosyaları kullandığına, nasıl yapılandırıldığına, IDE'nizde nasıl çalıştığına, nasıl yapılandırıldığına, hangi araçları kullandığına vb. bakın. Ne yaptığınızı bildiğinizde büyük bir JavaScript kod tabanını TypeScript'e dönüştürmek mümkündür. Örnek için bu blogu okuyun 600 bin satırı 72 saatte typeScript'e dönüştürme). Sadece atlama yapmadan önce dili iyi bir şekilde kavradığınızdan emin olun.
TypeScript açık kaynaklıdır (Apache 2 lisanslıdır, bkz. GitHub) ve Microsoft tarafından desteklenmektedir. C#'ın baş mimarı Anders Hejlsberg projeye öncülük etmektedir. Bu çok aktif bir projedir; TypeScript ekibi son birkaç yıldır birçok yeni özellik yayınlamaktadır ve hala birçok harika özelliğin gelmesi planlanmaktadır (bkz. yol haritası). Benimsenme ve popülerlik hakkında bazı gerçekler:
"TypeScript Fundamentals" -- Dan Wahlin ve John Papa tarafından hazırlanan bir Pluralsight video-kursu, TypeScript 1.8'i yansıtacak şekilde güncellenmiş (25 Mart 2016), Typescript'e gerçekten iyi bir giriş niteliğindedir.
Benim için gerçekten iyi özellikler, intellisense için güzel olasılıkların yanı sıra, sınıflar, arayüzler, modüller, AMD'yi uygulama kolaylığı ve IE ile çağrıldığında Visual Studio Typescript hata ayıklayıcısını kullanma olasılığıdır.
Özetlemek gerekirse: Amaçlandığı gibi kullanılırsa, Typescript JavaScript programlamayı daha güvenilir ve daha kolay hale getirebilir. Tüm SDLC boyunca JavaScript programcısının üretkenliğini önemli ölçüde artırabilir.