TypeScript - İşlevler

İşlevler, okunabilir, bakımı yapılabilir ve yeniden kullanılabilir kodun yapı taşlarıdır. Bir işlev, belirli bir görevi yerine getirmek için bir dizi deyimdir. Fonksiyonlar programı mantıksal kod blokları halinde düzenler. Tanımlandıktan sonra, işlevler erişim koduna çağrılabilir. Bu, kodu yeniden kullanılabilir hale getirir. Dahası, işlevler programın kodunu okumayı ve korumayı kolaylaştırır.

Bir işlev bildirimi, derleyiciye bir işlevin adı, dönüş türü ve parametreleri hakkında bilgi verir. Bir işlev tanımı, işlevin gerçek gövdesini sağlar.

Sr.No İşlevler ve Açıklama
1. Bir Fonksiyonun Tanımlanması

Bir işlev tanımı, belirli bir görevin ne ve nasıl yapılacağını belirtir.

2. Bir Fonksiyon Çağırma

Çalıştırmak için bir işlev çağrılmalıdır.

3. Geri Dönen İşlevler

Fonksiyonlar ayrıca kontrol ile birlikte arayana geri dönebilir.

4. Parametreli Fonksiyon

Parametreler, değerleri işlevlere iletmek için bir mekanizmadır.

Opsiyonel Parametreler

Bir işlevin yürütülmesi için bağımsız değişkenlerin zorunlu olarak iletilmesi gerekmediğinde isteğe bağlı parametreler kullanılabilir. Bir parametre, adına bir soru işareti eklenerek isteğe bağlı olarak işaretlenebilir. İsteğe bağlı parametre, bir işlevdeki son bağımsız değişken olarak ayarlanmalıdır. İsteğe bağlı parametre ile bir işlev bildirmek için sözdizimi aşağıda verildiği gibidir -

function function_name (param1[:type], param2[:type], param3[:type])

Örnek: İsteğe Bağlı Parametreler

function disp_details(id:number,name:string,mail_id?:string) { 
   console.log("ID:", id); 
   console.log("Name",name); 
   
   if(mail_id!=undefined)  
   console.log("Email Id",mail_id); 
}
disp_details(123,"John");
disp_details(111,"mary","[email protected]");
  • Yukarıdaki örnek, parametreli bir işlevi bildirir. Burada üçüncü parametre, yani mail_id isteğe bağlı bir parametredir.

  • İşlev çağrısı sırasında isteğe bağlı bir parametreye bir değer iletilmezse, parametrenin değeri tanımsız olarak ayarlanır.

  • İşlev, mail_id değerini yalnızca bağımsız değişken bir değer iletilirse yazdırır.

Derleme sırasında aşağıdaki JavaScript kodunu oluşturacaktır -

//Generated by typescript 1.8.10
function disp_details(id, name, mail_id) {
   console.log("ID:", id);
   console.log("Name", name);
	
   if (mail_id != undefined)
      console.log("Email Id", mail_id);
}
disp_details(123, "John");
disp_details(111, "mary", "[email protected]");

Yukarıdaki kod aşağıdaki çıktıyı üretecektir -

ID:123 
Name John 
ID: 111 
Name  mary 
Email Id [email protected]

Dinlenme Parametreleri

Rest parametreleri Java'daki değişken argümanlara benzer. Rest parametreleri, bir işleve geçirebileceğiniz değerlerin sayısını sınırlamaz. Ancak, aktarılan değerlerin tümü aynı türde olmalıdır. Diğer bir deyişle, rest parametreleri aynı türden birden çok argüman için yer tutucu görevi görür.

Bir rest parametresi bildirmek için, parametre adı üç nokta ile başlar. Rest olmayan herhangi bir parametre rest parametresinden önce gelmelidir.

Örnek: Dinlenme Parametreleri

function addNumbers(...nums:number[]) {  
   var i;   
   var sum:number = 0; 
   
   for(i = 0;i<nums.length;i++) { 
      sum = sum + nums[i]; 
   } 
   console.log("sum of the numbers",sum) 
} 
addNumbers(1,2,3) 
addNumbers(10,10,10,10,10)
  • AddNumbers () bildirimi, bir rest parametresi nums kabul eder . Rest parametresinin veri türü bir dizi olarak ayarlanmalıdır. Ayrıca, bir fonksiyon en fazla bir dinlenme parametresine sahip olabilir.

  • İşlev, sırasıyla üç ve altı değer iletilerek iki kez çağrılır.

  • For döngüsü, bağımsız değişken listesini yineler, işleve iletilir ve bunların toplamını hesaplar.

Derleme sırasında aşağıdaki JavaScript kodunu oluşturacaktır -

function addNumbers() {
   var nums = [];
   for (var _i = 0; _i < arguments.length; _i++) {
      nums[_i - 0] = arguments[_i];
   }
	var i;
   var sum = 0;
	
   for (i = 0; i < nums.length; i++) {
      sum = sum + nums[i];
   }
   console.log("sum of the numbers", sum);
}
addNumbers(1, 2, 3);
addNumbers(10, 10, 10, 10, 10);

Yukarıdaki kodun çıktısı aşağıdaki gibidir -

sum of numbers 6 
sum of numbers 50

Varsayılan Parametreler

Fonksiyon parametrelerine varsayılan olarak değerler de atanabilir. Bununla birlikte, bu tür parametreler açıkça geçirilen değerler de olabilir.

Sözdizimi

function function_name(param1[:type],param2[:type] = default_value) { 
}

Note - Bir parametre aynı anda hem isteğe bağlı hem de varsayılan olarak tanımlanamaz.

Örnek: Varsayılan parametreler

function calculate_discount(price:number,rate:number = 0.50) { 
   var discount = price * rate; 
   console.log("Discount Amount: ",discount); 
} 
calculate_discount(1000) 
calculate_discount(1000,0.30)

Derleme sırasında aşağıdaki JavaScript kodunu oluşturacaktır -

//Generated by typescript 1.8.10
function calculate_discount(price, rate) {
   if (rate === void 0) { rate = 0.50; }
   var discount = price * rate;
   console.log("Discount Amount: ", discount);
}
calculate_discount(1000);
calculate_discount(1000, 0.30);

Çıktısı aşağıdaki gibidir -

Discount amount : 500 
Discount amount : 300
  • Örnek, calculate_discount işlevini bildirir . İşlevin iki parametresi vardır - fiyat ve oran.

  • Parametre oranının değeri varsayılan olarak 0,50'ye ayarlanmıştır .

  • Program işlevi çağırır ve ona sadece fiyat parametresinin değerini iletir. Burada oran değeri 0,50'dir (varsayılan)

  • Aynı işlev çağrılır, ancak iki bağımsız değişkenle birlikte. Oranın varsayılan değerinin üzerine yazılır ve açıkça aktarılan değere ayarlanır.

Anonim İşlev

Bir tanımlayıcıya (işlev adı) bağlı olmayan işlevler şu şekilde adlandırılır: anonymous functions. Bu işlevler, çalışma zamanında dinamik olarak bildirilir. Anonim işlevler, tıpkı standart işlevlerin yaptığı gibi, girdileri kabul edebilir ve çıktıları döndürebilir. Anonim bir işleve genellikle ilk oluşturulduktan sonra erişilemez.

Değişkenlere anonim bir işlev atanabilir. Böyle bir ifadeye işlev ifadesi denir.

Sözdizimi

var res = function( [arguments] ) { ... }

Örnek ─ Basit Anonim bir işlev

var msg = function() { 
   return "hello world";  
} 
console.log(msg())

Derleme sırasında aynı kodu JavaScript'te üretecektir.

Aşağıdaki çıktıyı üretecektir -

hello world

Örnek ─ Parametreli anonim işlev

var res = function(a:number,b:number) { 
   return a*b;  
}; 
console.log(res(12,2))

Anonim işlev, kendisine iletilen değerlerin çarpımını döndürür.

Derleme sırasında aşağıdaki JavaScript kodunu oluşturacaktır -

//Generated by typescript 1.8.10
var res = function (a, b) {
   return a * b;
};
console.log(res(12, 2));

Yukarıdaki kodun çıktısı aşağıdaki gibidir -

24

İşlev İfadesi ve İşlev Bildirimi ─ Eşanlamlı mı?

İşlev ifadesi ve işlev bildirimi eşanlamlı değildir. Bir işlev ifadesinden farklı olarak, bir işlev bildirimi işlev adına bağlıdır.

İkisi arasındaki temel fark, işlev bildirimlerinin yürütülmeden önce çözümlenmesidir. Öte yandan, işlev ifadeleri yalnızca komut dosyası motoru yürütme sırasında onunla karşılaştığında çözümlenir.

JavaScript ayrıştırıcısı ana kod akışında bir işlev gördüğünde, İşlev Bildirimi'ni varsayar. Bir işlev bir ifadenin parçası olarak geldiğinde, bu bir İşlev İfadesidir.

İşlev Oluşturucu

TypeScript ayrıca Function () adlı yerleşik JavaScript yapıcısı ile bir işlev tanımlamayı destekler.

Sözdizimi

var res = new Function( [arguments] ) { ... }.

Misal

var myFunction = new Function("a", "b", "return a * b"); 
var x = myFunction(4, 3); 
console.log(x);

Yeni Function (), oluşturucuya yapılan ve bir işlev referansı oluşturan ve döndüren bir çağrıdır.

Derleme sırasında aynı kodu JavaScript'te üretecektir.

Yukarıdaki örnek kodun çıktısı aşağıdaki gibidir -

12

Özyineleme ve TypeScript İşlevleri

Özyineleme, bir sonuca ulaşana kadar kendisine bir işlev çağrısı yaparak bir işlemi yineleme tekniğidir. Özyineleme en iyi, aynı işlevi bir döngü içinden farklı parametrelerle tekrar tekrar çağırmanız gerektiğinde uygulanır.

Örnek - Özyineleme

function factorial(number) {
   if (number <= 0) {         // termination case
      return 1; 
   } else {     
      return (number * factorial(number - 1));     // function invokes itself
   } 
}; 
console.log(factorial(6));      // outputs 720

Derleme sırasında aynı kodu JavaScript'te üretecektir.

İşte çıktısı -

720

Örnek: Anonim Özyinelemeli İşlev

(function () { 
   var x = "Hello!!";   
   console.log(x)     
})()      // the function invokes itself using a pair of parentheses ()

Derleme sırasında aynı kodu JavaScript'te üretecektir.

Çıktısı aşağıdaki gibidir -

Hello!!

Lambda İşlevleri

Lambda, programlamadaki anonim işlevleri ifade eder. Lambda işlevleri, anonim işlevleri temsil eden kısa bir mekanizmadır. Bu işlevlere aynı zamandaArrow functions.

Lambda İşlevi - Anatomi

Bir Lambda işlevinin 3 bölümü vardır -

  • Parameters - Bir işlev isteğe bağlı olarak parametrelere sahip olabilir

  • The fat arrow notation/lambda notation (=>) - Operatöre gider olarak da adlandırılır

  • Statements - fonksiyonun komut setini temsil eder

Tip - Geleneksel olarak, kompakt ve kesin bir fonksiyon bildirimi için tek harfli parametrenin kullanımı teşvik edilir.

Lambda İfadesi

Tek bir kod satırına işaret eden anonim bir işlev ifadesidir. Sözdizimi aşağıdaki gibidir -

( [param1, parma2,…param n] )=>statement;

Örnek: Lambda İfadesi

var foo = (x:number)=>10 + x 
console.log(foo(100))      //outputs 110

Program bir lambda ifade işlevi bildirir. İşlev, 10'un toplamını ve iletilen bağımsız değişkeni döndürür.

Derleme sırasında aşağıdaki JavaScript kodunu oluşturacaktır.

//Generated by typescript 1.8.10
var foo = function (x) { return 10 + x; };
console.log(foo(100));      //outputs 110

İşte yukarıdaki kodun çıktısı -

110

Lambda Bildirimi

Lambda ifadesi, bir kod bloğuna işaret eden anonim bir işlev bildirimidir. Bu sözdizimi, işlev gövdesi birden çok satıra yayıldığında kullanılır. Sözdizimi aşağıdaki gibidir -

( [param1, parma2,…param n] )=> {
 
   //code block
}

Örnek: Lambda ifadesi

var foo = (x:number)=> {    
   x = 10 + x 
   console.log(x)  
} 
foo(100)

Fonksiyonun referansı döndürülür ve değişkende saklanır foo.

Derleme sırasında aşağıdaki JavaScript kodunu oluşturacaktır -

//Generated by typescript 1.8.10
var foo = function (x) {
   x = 10 + x;
   console.log(x);
};
foo(100);

Yukarıdaki programın çıktısı aşağıdaki gibidir -

110

Sözdizimsel Varyasyonlar

Parametre tipi Çıkarım

Bir parametrenin veri tipinin belirtilmesi zorunlu değildir. Böyle bir durumda parametrenin veri türü herhangi bir türdür. Aşağıdaki kod parçasına bir göz atalım -

var func = (x)=> { 
   if(typeof x=="number") { 
      console.log(x+" is numeric") 
   } else if(typeof x=="string") { 
      console.log(x+" is a string") 
   }  
} 
func(12) 
func("Tom")

Derleme sırasında aşağıdaki JavaScript kodunu oluşturur -

//Generated by typescript 1.8.10
var func = function (x) {
   if (typeof x == "number") {
      console.log(x + " is numeric");
   } else if (typeof x == "string") {
      console.log(x + " is a string");
   }
};
func(12);
func("Tom");

Çıktısı aşağıdaki gibidir -

12 is numeric 
Tom is a string

Tek bir parametre için isteğe bağlı parantezler

var display = x=> { 
   console.log("The function got "+x) 
} 
display(12)

Derleme sırasında aşağıdaki JavaScript kodunu oluşturacaktır -

//Generated by typescript 1.8.10
var display = function (x) {
   console.log("The function got " + x);
};
display(12);

Çıktısı aşağıdaki gibidir -

The function got 12

Tek bir ifade için isteğe bağlı küme parantezleri, Parametre olmadan boş parantezler

Aşağıdaki örnek, bu iki Sözdizimsel varyasyonu göstermektedir.

var disp =()=> { 
   console.log("Function invoked"); 
} 
disp();

Derleme sırasında aşağıdaki JavaScript kodunu oluşturacaktır -

//Generated by typescript 1.8.10
var disp = function () {
   console.log("Function invoked");
};
disp();

Çıktısı aşağıdaki gibidir -

Function invoked

Fonksiyon Aşırı Yükleri

Fonksiyonlar, kendilerine sağlanan girdiye göre farklı şekilde çalışma yeteneğine sahiptir. Başka bir deyişle, bir programın farklı uygulamalarda aynı adı taşıyan birden çok yöntemi olabilir. Bu mekanizma, İşlev Aşırı Yüklemesi olarak adlandırılır. TypeScript, işlev aşırı yüklemesi için destek sağlar.

TypeScript'te bir işlevi aşırı yüklemek için, aşağıda verilen adımları izlemeniz gerekir -

Step 1- Aynı adla ancak farklı işlev imzasıyla birden fazla işlevi bildirin. İşlev imzası aşağıdakileri içerir.

  • The data type of the parameter

function disp(string):void; 
function disp(number):void;
  • The number of parameters

function disp(n1:number):void; 
function disp(x:number,y:number):void;
  • The sequence of parameters

function disp(n1:number,s1:string):void; 
function disp(s:string,n:number):void;

Note - İşlev imzası, işlevin dönüş türünü içermez.

Step 2- Bildirimin ardından işlev tanımı gelmelidir. Parametre türleri şu şekilde ayarlanmalıdır:anyaşırı yük sırasında parametre türleri farklıysa. Ek olarak,case b yukarıda açıklandığı gibi, işlev tanımı sırasında bir veya daha fazla parametreyi isteğe bağlı olarak işaretlemeyi düşünebilirsiniz.

Step 3 - Son olarak, işlevsel hale getirmek için işlevi çağırmalısınız.

Misal

Şimdi aşağıdaki örnek koda bir göz atalım -

function disp(s1:string):void; 
function disp(n1:number,s1:string):void; 

function disp(x:any,y?:any):void { 
   console.log(x); 
   console.log(y); 
} 
disp("abc") 
disp(1,"xyz");
  • İlk iki satır, fonksiyon aşırı yük bildirimini gösterir. Fonksiyonun iki aşırı yüklemesi vardır -

    • Tek bir dize parametresini kabul eden işlev.

    • Sırasıyla sayı ve dize türünün iki değerini kabul eden işlev.

  • Üçüncü satır, işlevi tanımlar. Parametrelerin veri türü şu şekilde ayarlanır:any. Üstelik burada ikinci parametre isteğe bağlıdır.

  • Aşırı yüklenmiş fonksiyon, son iki ifade tarafından çağrılır.

Derleme sırasında aşağıdaki JavaScript kodunu oluşturacaktır -

//Generated by typescript 1.8.10
function disp(x, y) {
   console.log(x);
   console.log(y);
}
disp("abc");
disp(1, "xyz");

Yukarıdaki kod aşağıdaki çıktıyı üretecektir -

abc 
1 
xyz