Yazılım

TypeScript Nedir?

TypeScript bilinenin aksine bir programlama dili değil bizlerin yazılım geliştirme aşamasında JavaScript dilini daha düzenli ve stabil bir şekilde geliştirmemizi sağlayan bir arayüzdür.

Peki neden JavaScript dili varken yeni bir arayüz ile geliştirme ihtiyacı duyalım?

Öncelikle bilindiği üzere JavaScript dilinin son yıllardaki yükselişi hepimiz tarafından farkedilmiştir.

Bu yükseliş ile beraber JavaScript Client taraflı bir programlama dilinden çıkarak gerek Server taraflı (NodeJS) gerek mobil programlama (Hybrid) gerekse masaüstü uygulama geliştirme (elektron.js) yeteneklerini de bünyesine katmıştır.

Tabi bu özellikleri bünyesine katması sonucunda yazacağımız kodların boyutlarının çoğalması sebebiyle düzenli yazılmasına ve özellikle tip yapılarına ihtiyaç duyulmaktaydı. İşte TypeScript in ismini oluşturan özelliği buradan gelmektedir.

Bünyesinde Tip özelliklerini barındıran ve Script diline dönüştürülebilen arayüz = TypeScript.

Başka bir deyişle TypeScript bizlere Backend yazılım dillerinde sıklıkla kullandığımız (NameSpace -Class – Enum – Interface vb..) yapıları kullandırarak JavaScript dilinde kod geliştirmemizi sağlamaktadır.

Peki bu işlem nasıl oluyor bir örnek ile görelim.

Not: Buradaki kodlar daha önceden Backend yazılım dilleriyle geliştirme yapmadıysanız karmaşık gelecektir. Buradaki asıl amaç TypeScript ile JavaScript arasındaki kod yazım düzeninin belirtilmek istenmesi olduğundan örnekteki kodlar ileri seviyedeki makale konularını kapsamaktadır.

namespace INSAN{
export class OGRENCI {

private _Ad : string;
public get Ad() : string {
return this._Ad;
}
public set Ad(v : string) {
this._Ad = v;
}

private _Soyad : string;
public get Soyad() : string {
return this._Soyad;
}
public set Soyad(v : string) {
this._Soyad = v;
}

public Selamla() {
console.log(“Merhaba “+this._Ad+” “+this._Soyad);
}
}
}
Öncelikle INSAN adlı bir NameSpace içeriğinde OGRENCI adında bir class tanımlayarak bu class içeriğinde Ogrenci tipindeki nesneye ait Ad ve Soyad bilgilerini işleyebileceğimiz propertyler ve bu propertylerin get ve set işlevlerini yazıyoruz.
Bu işlemden sonra Console ekranına İletimizi yazdırmak amacıyla Selamla adında bir metod tanımlayarak bu metod içeriğinde Ad ve Soyad bilgilerimizi yazdırıyoruz.

namespace ISLEMLER{

export class ISLEM {
constructor() {
let _ogr=new INSAN.OGRENCI();

_ogr.Ad=”Erkan”;
_ogr.Soyad=”Kilmen”;

_ogr.Selamla();
}
}
}

let _isl=new ISLEMLER.ISLEM();

Bu kodumuzda ise ISLEMLER adından farklı bir NameSpace tanımlaması yaparak bu NameSpace içeriğinde daha önceden tanımlamış olduğumuz OGRENCİ adındaki class dan nesne oluşturarak içeriğine veri gönderen ISLEM adında farklı bir class oluşturuyoruz.
Bu classdan yeni bir nesne oluşturulduğu anda işlemlerin gerçekleşmesini talep ettiğimizden kodlarımızı constructure metodumuz içeriğine yazıyoruz.
Ardından ISLEM classından _isl adında bir nesne oluşturarak kodumuzun işleyişini başlatıyoruz.
Yazmış olduğumuz bu kodumuzu .ts uzantılı bir dosya içeriğinde kaydederek TypeScript Compiler aracılığı ile aşağıdaki gibi derlediğimizde
C:\TypeScriptCode> tsc .\Demo1.ts
Bize TypeScript dosyamıza vermiş olduğumuz isimde bir JavaScript dosyası oluşturacaktır. (Demo1.js)
Bu JavaScript dosyası içeriğine baktığımızda ise aşağıdaki gibi bir kod bizi karşılayacaktır.

var INSAN;
(function (INSAN) {
var OGRENCI = /** @class */ (function () {
function OGRENCI() {
}
Object.defineProperty(OGRENCI.prototype, "Ad", {
get: function () {
return this._Ad;
},
set: function (v) {
this._Ad = v;
},
enumerable: true,
configurable: true
});
Object.defineProperty(OGRENCI.prototype, "Soyad", {
get: function () {
return this._Soyad;
},
set: function (v) {
this._Soyad = v;
},
enumerable: true,
configurable: true
});
OGRENCI.prototype.Selamla = function () {
console.log("Merhaba " + this._Ad + " " + this._Soyad);
};
return OGRENCI;
}());
INSAN.OGRENCI = OGRENCI;
})(INSAN || (INSAN = {}));
var ISLEMLER;
(function (ISLEMLER) {
var ISLEM = /** @class */ (function () {
function ISLEM() {
var _ogr = new INSAN.OGRENCI();
_ogr.Ad = "Erkan";
_ogr.Soyad = "Kilmen";
_ogr.Selamla();
}
return ISLEM;
}());
ISLEMLER.ISLEM = ISLEM;
})(ISLEMLER || (ISLEMLER = {}));
var _isl = new ISLEMLER.ISLEM();

Yapısal olarak TypeScript dosyası içeriğinden daha karmaşık olan bu kodumuz bizim projelerimizde kullanabileceğimiz JavaScript dosyamızdır.
Örnek ile de gördüğümüz üzere TypeScript in bize sağlamış olduğu en büyük kolaylık daha anlaşılır kod yazımı ile işlerimizi halledebilmemizdir.
Bu makalemizde TypeScript ile tanışarak bizlere sunduğu yararlardan kolay kod yazımını inceledik. Bir sonraki makalemizde TypeScript ile geliştirme yapabilmemiz için gerekli ortamın kurulumlarını inceleyeceğiz.

1 Comment

Bir cevap yazın

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