ES6 Argümanları ve Parametreleri Nasıl Kullanılır

Yayınlanan: 2022-03-10
Kısa özet ↬ Geliştiriciler, ECMAScript 6 özelliklerini giderek daha fazla kullanıyor ve yakında bu özellikler kaçınılmaz olacak. Bu öğreticide, ECMAScript 6'nın JavaScript'te parametre işlemeyi nasıl yükselttiğini ve daha fazlasını öğreneceksiniz.

ECMAScript 6 (veya ECMAScript 2015), ECMAScript standardının en yeni sürümüdür ve JavaScript'te önemli ölçüde geliştirilmiş parametre işleme özelliğine sahiptir. Artık diğer yeni özelliklerin yanı sıra dinlenme parametrelerini, varsayılan değerleri ve yıkımı kullanabiliriz.

Bu öğreticide, argümanları ve parametreleri ayrıntılı olarak inceleyeceğiz ve ECMAScript 6'nın bunları nasıl yükselttiğini göreceğiz.

Argümanlar ve Parametreler

Argümanlar ve parametreler genellikle birbirinin yerine kullanılır. Bununla birlikte, bu eğitimin amacı için bir ayrım yapacağız. Çoğu standartta, parametreler (veya resmi parametreler) fonksiyon bildiriminde verilenlerdir ve argümanlar (veya gerçek parametreler) fonksiyona aktarılanlardır. Bu işlevi düşünün:

 function foo(param1, param2) { // do something } foo(10, 20);

Bu fonksiyonda param1 ve param2 fonksiyon parametreleridir ve fonksiyona ( 10 ve 20 ) iletilen değerler argümanlardır.

Yayılma Operatörü (…)

ECMAScript 5'te, application apply() yöntemi, bir diziyi bir işleve argüman olarak iletmek için uygun bir araçtır. Örneğin, bir dizideki en yüksek değeri bulmak için yaygın olarak Math.max() yöntemiyle birlikte kullanılır. Bu kod parçasını düşünün:

 var myArray = [5, 10, 50]; Math.max(myArray); // Error: NaN Math.max.apply(Math, myArray); // 50

Math.max() yöntemi dizileri desteklemez; sadece sayıları kabul eder. Math.max() işlevine bir dizi iletildiğinde, bir hata verir. Ancak application() yöntemi kullanıldığında, dizi ayrı sayılar olarak gönderilir, böylece apply() Math.max() yöntemi onu işleyebilir.

Atlamadan sonra daha fazlası! Aşağıdan okumaya devam edin ↓

Neyse ki, ECMAScript 6'da spread operatörünün tanıtılmasıyla, artık application apply() yöntemini kullanmamıza gerek kalmadı. Spread operatörü ile bir ifadeyi kolayca birden çok argümana genişletebiliriz:

 var myArray = [5, 10, 50]; Math.max(...myArray); // 50

Burada, yayılma operatörü, işlev için ayrı değerler oluşturmak üzere myArray genişletir. ECMAScript 5'te application apply() kullanarak spread operatörünü simüle etmek mümkün olsa da, sözdizimi kafa karıştırıcıdır ve spread operatörünün esnekliğinden yoksundur. Yayma operatörünün kullanımı daha kolay olmakla kalmaz, aynı zamanda daha fazla özellik içerir. Örneğin, birden çok kez kullanılabilir ve bir function çağrısında diğer argümanlarla karıştırılabilir:

 function myFunction() { for(var i in arguments){ console.log(arguments[i]); } } var params = [10, 15]; myFunction(5, ...params, 20, ...[25]); // 5 10 15 20 25

Yayma operatörünün bir başka avantajı, yapıcılarla kolayca kullanılabilmesidir:

 new Date(...[2016, 5, 6]); // Mon Jun 06 2016 00:00:00 GMT-0700 (Pacific Daylight Time)

Elbette, ECMAScript 5'te önceki kodu yeniden yazabiliriz, ancak bir tür hatası almamak için karmaşık bir kalıp kullanmamız gerekir:

 new Date.apply(null, [2016, 4, 24]); // TypeError: Date.apply is not a constructor new (Function.prototype.bind.apply(Date, [null].concat([2016, 5, 6]))); // Mon Jun 06 2016 00:00:00 GMT-0700 (Pacific Daylight Time)

Fonksiyon Çağrılarında Yaygın Operatör Tarayıcı Desteği

Masaüstü tarayıcılar:

Krom Firefox Internet Explorer Microsoft Kenarı Opera Safari
46 27 - Desteklenen - 7.1

Mobil tarayıcılar:

Android için Chrome Firefox Mobil Safari Mobil Opera Mobil IE Mobil
46 27 8 - -

Dinlenme parametreleri

rest parametresi, spread operatörüyle aynı sözdizimine sahiptir, ancak bir diziyi parametrelere genişletmek yerine parametreleri toplar ve bir diziye dönüştürür.

 function myFunction(...options) { return options; } myFunction('a', 'b', 'c'); // ["a", "b", "c"]

Argüman yoksa, rest parametresi boş bir diziye ayarlanır:

 function myFunction(...options) { return options; } myFunction(); // []

Bir rest parametresi, değişken bir işlev (değişken sayıda argüman kabul eden bir işlev) oluştururken özellikle yararlıdır. Dizi olma avantajına sahip olan rest parametreleri, kolayca arguments nesnesinin yerini alabilir (ki bunu bu öğreticide daha sonra açıklayacağız). ECMAScript 5'te yazılmış bu işlevi göz önünde bulundurun:

 function checkSubstrings(string) { for (var i = 1; i < arguments.length; i++) { if (string.indexOf(arguments[i]) === -1) { return false; } } return true; } checkSubstrings('this is a string', 'is', 'this'); // true

Bu işlev, bir dizenin birkaç alt dize içerip içermediğini kontrol eder. Bu işlevle ilgili ilk sorun, birden çok argüman aldığını görmek için function gövdesinin içine bakmamız gerektiğidir. İkinci sorun, yinelemenin 0 yerine 1 başlaması gerektiğidir, çünkü arguments[0] ilk argümana işaret eder. Daha sonra dizeden önce veya sonra başka bir parametre eklemeye karar verirsek, döngüyü güncellemeyi unutabiliriz. Geri kalan parametrelerle, bu sorunlardan kolayca kaçınırız:

 function checkSubstrings(string, ...keys) { for (var key of keys) { if (string.indexOf(key) === -1) { return false; } } return true; } checkSubstrings('this is a string', 'is', 'this'); // true

Bu işlevin çıktısı öncekiyle aynıdır. Burada yine, parametre string ilk iletilen argümanla doldurulur, ancak geri kalan argümanlar bir diziye konur ve keys değişkenine atanır.

arguments nesnesi yerine rest parametresinin kullanılması, kodun okunabilirliğini artırır ve JavaScript'teki optimizasyon sorunlarını önler. Bununla birlikte, dinlenme parametresinin sınırlamaları yoktur. Örneğin, son argüman olmalıdır; aksi takdirde, bir sözdizimi hatası oluşacaktır:

 function logArguments(a, ...params, b) { console.log(a, params, b); } logArguments(5, 10, 15); // SyntaxError: parameter after rest parameter

Diğer bir sınırlama, function bildiriminde yalnızca bir dinlenme parametresine izin verilmesidir:

 function logArguments(...param1, ...param2) { } logArguments(5, 10, 15); // SyntaxError: parameter after rest parameter

Dinlenme Parametreleri Tarayıcı Desteği

Masaüstü tarayıcılar:

Krom Firefox Internet Explorer Microsoft Kenarı Opera Safari
47 15 - Desteklenen 34 -

Mobil tarayıcılar:

Android için Chrome Firefox Mobil Safari Mobil Opera Mobil IE Mobil
47 15 - - -

Varsayılan Parametreler

ECMAScript 5'te Varsayılan Parametreler

JavaScript, ECMAScript 5'teki varsayılan parametreleri desteklemez, ancak kolay bir geçici çözüm vardır. İşlev içinde mantıksal bir OR operatörü ( || ) kullanarak, ECMAScript 5'te varsayılan parametreleri kolayca simüle edebiliriz. Şu işlevi göz önünde bulundurun:

 function foo(param1, param2) { param1 = param1 || 10; param2 = param2 || 10; console.log(param1, param2); } foo(5, 5); // 5 5 foo(5); // 5 10 foo(); // 10 10

Bu işlev iki bağımsız değişken bekler, ancak bağımsız değişkenler olmadan çağrıldığında varsayılan değerleri kullanır. İşlevin içinde, eksik bağımsız değişkenler otomatik olarak tanımsız olarak ayarlanır; böylece, bu argümanları tespit edebilir ve onlar için varsayılan değerler bildirebiliriz. Eksik argümanları tespit etmek ve varsayılan değerleri ayarlamak için mantıksal OR operatörünü ( || ) kullanırız. Bu operatör ilk argümanını inceler: Eğer doğruysa, operatör onu döndürür; değilse, operatör ikinci argümanını döndürür.

Bu yaklaşım, işlevlerde yaygın olarak kullanılır, ancak bir kusuru vardır. 0 veya null değerini geçmek, bunlar sahte değerler olarak kabul edildiğinden, varsayılan bir değeri de tetikleyecektir. Dolayısıyla, bu fonksiyona gerçekten 0 veya null gerekiyorsa, bir argümanın eksik olup olmadığını kontrol etmek için alternatif bir yola ihtiyacımız olacaktır:

 function foo(param1, param2) { if(param1 === undefined){ param1 = 10; } if(param2 === undefined){ param2 = 10; } console.log(param1, param2); } foo(0, null); // 0, null foo(); // 10, 10

Bu işlevin içinde, varsayılan değerler atanmadan önce tanımsız olduklarından emin olmak için geçirilen argüman türleri kontrol edilir. Bu yaklaşım biraz daha fazla kod gerektirir, ancak daha güvenli bir alternatiftir ve fonksiyona 0 ve null izin verir.

ECMAScript 6'da Varsayılan Parametreler

ECMAScript 6 ile artık varsayılan parametreleri simüle etmek için tanımsız değerleri kontrol etmemize gerek yok. Artık function bildirimine varsayılan değerleri koyabiliriz:

 function foo(a = 10, b = 10) { console.log(a, b); } foo(5); // 5 10 foo(0, null); // 0 null

Gördüğünüz gibi, bir bağımsız değişkeni atlamak varsayılan değeri tetikler, ancak 0 veya null değeri geçmek olmaz. Varsayılan parametreler için değerleri almak için işlevleri bile kullanabiliriz:

 function getParam() { alert("getParam was called"); return 3; } function multiply(param1, param2 = getParam()) { return param1 * param2; } multiply(2, 5); // 10 multiply(2); // 6 (also displays an alert dialog)

getParam işlevinin yalnızca ikinci bağımsız değişken atlanırsa çağrıldığını unutmayın. Bu yüzden multiply() fonksiyonunu iki parametre ile çağırdığımızda uyarı görüntülenmeyecektir.

Varsayılan parametrelerin bir başka ilginç özelliği, function bildiriminde diğer parametrelere ve değişkenlere başvurabilmemizdir:

 function myFunction(a=10, b=a) { console.log('a = ' + a + '; b = ' + b); } myFunction(); // a=10; b=10 myFunction(22); // a=22; b=22 myFunction(2, 4); // a=2; b=4

Hatta function bildiriminde işlemler gerçekleştirebilirsiniz:

 function myFunction(a, b = ++a, c = a*b) { console.log(c); } myFunction(5); // 36

Diğer bazı dillerden farklı olarak JavaScript'in varsayılan parametreleri arama zamanında değerlendirdiğini unutmayın:

 function add(value, array = []) { array.push(value); return array; } add(5); // [5] add(6); // [6], not [5, 6]

Varsayılan Parametre Tarayıcı Desteği

Masaüstü tarayıcılar:

Özellik Krom Firefox Internet Explorer Microsoft Kenarı Opera Safari
Temel destek 49 15 - 14 - -
Varsayılan parametreden sonra varsayılan olmayan parametreler 49 26 - 14 - -

Mobil tarayıcılar:

Özellik Android için Chrome Firefox Mobil Safari Mobil Opera Mobil IE Mobil
Temel destek 49 15 - - -
Varsayılan parametreden sonra varsayılan olmayan parametreler 46 26 - - -

Şeklini bozma

Yıkım, ECMAScript 6'da dizilerden ve nesneden değerler çıkarmamıza ve bunları nesne ve dizi değişmez değerlerine benzer bir sözdizimi kullanarak değişkenlere atamamıza olanak tanıyan yeni bir özelliktir. Sözdizimi açık ve anlaşılması kolaydır ve özellikle argümanları bir işleve iletirken kullanışlıdır.

ECMAScript 5'te, özellikle özelliklerin sırası önemli olmadığında, çok sayıda isteğe bağlı parametreyi işlemek için genellikle bir yapılandırma nesnesi kullanılır. Bu işlevi düşünün:

 function initiateTransfer(options) { var protocol = options.protocol, port = options.port, delay = options.delay, retries = options.retries, timeout = options.timeout, log = options.log; // code to initiate transfer } options = { protocol: 'http', port: 800, delay: 150, retries: 10, timeout: 500, log: true }; initiateTransfer(options);

Bu model JavaScript geliştiricileri tarafından yaygın olarak kullanılır ve iyi çalışır, ancak hangi parametreleri beklediğini görmek için function gövdesinin içine bakmamız gerekir. Bozulmuş parametrelerle, function bildirimindeki parametreleri açıkça belirtebiliriz:

 function initiateTransfer({protocol, port, delay, retries, timeout, log}) { // code to initiate transfer }; var options = { protocol: 'http', port: 800, delay: 150, retries: 10, timeout: 500, log: true } initiateTransfer(options);

Bu fonksiyonda, bir konfigürasyon nesnesi yerine bir nesne yok etme modeli kullandık. Bu, işlevimizi yalnızca daha özlü kılmakla kalmaz, aynı zamanda okunmasını da kolaylaştırır.

Bozulmuş parametreleri normal olanlarla da birleştirebiliriz:

 function initiateTransfer(param1, {protocol, port, delay, retries, timeout, log}) { // code to initiate transfer } initiateTransfer('some value', options);

function çağrısında parametreler atlanırsa bir tür hatasının atılacağını unutmayın:

 function initiateTransfer({protocol, port, delay, retries, timeout, log}) { // code to initiate transfer } initiateTransfer(); // TypeError: Cannot match against 'undefined' or 'null'

Parametrelerin gerekli olmasına ihtiyacımız olduğunda istenen davranış budur, ancak bunların isteğe bağlı olmasını istiyorsak ne olur? Parametreler eksik olduğunda bu hatayı önlemek için, bozulan parametrelere varsayılan bir değer atamamız gerekiyor:

 function initiateTransfer({protocol, port, delay, retries, timeout, log} = {}) { // code to initiate transfer } initiateTransfer(); // no error

Bu işlevde, yapısı bozulan parametreler için varsayılan değer olarak boş bir nesne sağlanır. Şimdi, bu fonksiyon herhangi bir parametre olmadan çağrılırsa, herhangi bir hata oluşmayacaktır.

Ayrıca her bir tahrip edilmiş parametreye bir varsayılan değer atayabiliriz:

 function initiateTransfer({ protocol = 'http', port = 800, delay = 150, retries = 10, timeout = 500, log = true }) { // code to initiate transfer }

Bu örnekte, her özelliğin bir varsayılan parametresi vardır ve bu, tanımsız parametreleri manuel olarak kontrol etmemize ve function gövdesi içinde varsayılan değerler atamamıza gerek kalmaz.

Tarayıcı Desteğini Yok Etme

Masaüstü tarayıcılar:

Özellik Krom Firefox Internet Explorer Microsoft Kenarı Opera Safari
Temel destek 49 2.0 - 14 - 7.1
Varsayılan değer atamalı yapısı bozulmuş parametre 49 47 - 14 - -

Mobil tarayıcılar:

Özellik Android için Chrome Firefox Mobil Safari Mobil Opera Mobil IE Mobil
Temel destek 49 1 8 - -
Varsayılan parametreden sonra varsayılan olmayan parametreler 49 47 - - -

Argümanları Geçmek

Bir fonksiyona argüman iletmenin iki yolu vardır: referansa göre veya değere göre. Başvuruyla iletilen bir bağımsız değişkenin değiştirilmesi genel olarak yansıtılır, ancak değere göre iletilen bir bağımsız değişkenin değiştirilmesi yalnızca işlevin içinde yansıtılır.

Visual Basic ve PowerShell gibi bazı dillerde, bir argümanın referansa mı yoksa değere göre mi iletileceğini belirtme seçeneğimiz vardır, ancak JavaScript'te durum böyle değildir.

Değere Göre Argümanları Geçmek

Teknik olarak, JavaScript yalnızca değere göre geçebilir. Bir fonksiyona değerine göre bir argüman ilettiğimizde, function kapsamında o değerin bir kopyası oluşturulur. Bu nedenle, değerdeki herhangi bir değişiklik yalnızca function içine yansıtılır. Bu örneği düşünün:

 var a = 5; function increment(a) { a = ++a; console.log(a); } increment(a); // 6 console.log(a); // 5

Burada, fonksiyon içindeki argümanı değiştirmenin orijinal değer üzerinde hiçbir etkisi yoktur. Bu nedenle, değişken fonksiyonun dışından günlüğe kaydedildiğinde, yazdırılan değer hala 5 .

Referansa Göre Argümanları Geçmek

JavaScript'te her şey değere göre iletilir, ancak bir nesneye (diziler dahil) başvuran bir değişken ilettiğimizde, "değer" nesneye bir başvurudur ve bir değişken tarafından başvurulan bir nesnenin özelliğini değiştirmek, nesneyi değiştirir. temel nesne.

Bu işlevi düşünün:

 function foo(param){ param.bar = 'new value'; } obj = { bar : 'value' } console.log(obj.bar); // value foo(obj); console.log(obj.bar); // new value

Gördüğünüz gibi, nesnenin özelliği işlevin içinde değiştirilir, ancak değiştirilen değer işlevin dışında görünür.

Bir dizi veya nesne gibi ilkel olmayan bir değeri ilettiğimizde, sahnenin arkasında orijinal nesnenin bellekteki konumuna işaret eden bir değişken oluşturulur. Bu değişken daha sonra işleve iletilir ve değiştirilmesi orijinal nesneyi etkiler.

Tip Kontrolü ve Eksik veya Ekstra Parametreler

Kesin olarak yazılan bir dilde, function bildiriminde parametre türünü belirtmemiz gerekir, ancak JavaScript'te bu özellik yoktur. JavaScript'te, bir işleve ne tür veri veya kaç argüman ilettiğimiz önemli değildir.

Sadece bir argümanı kabul eden bir fonksiyonumuz olduğunu varsayalım. Bu işlevi çağırdığımızda, işleve yalnızca bir argüman iletmekle sınırlı değiliz; bir, iki veya daha fazla argüman geçmekte özgürüz! Hatta hiçbir şey iletmemeyi seçebiliriz ve hiçbir hata oluşmaz.

Argüman ve parametre sayısı iki şekilde farklılık gösterebilir:

  • Parametrelerden daha az argüman .
    Eksik parametreler undefined değerine eşit olacaktır.
  • Parametrelerden daha fazla argüman .
    Fazladan parametreler yok sayılır ancak özel dizi benzeri değişken argümanları aracılığıyla alınabilir (sırada ele alınacaktır).

Zorunlu Argümanlar

Bir function çağrısında bir bağımsız değişken eksikse, undefined olarak ayarlanır. Bu davranıştan yararlanabilir ve bir argüman atlanırsa bir hata verebiliriz:

 function foo(mandatory, optional) { if (mandatory === undefined) { throw new Error('Missing parameter: mandatory'); } }

ECMAScript 6'da bunu daha ileri götürebilir ve zorunlu argümanları ayarlamak için varsayılan parametreleri kullanabiliriz:

 function throwError() { throw new Error('Missing parameter'); } function foo(param1 = throwError(), param2 = throwError()) { // do something } foo(10, 20); // ok foo(10); // Error: missing parameter

Argümanlar Nesne

Dinlenme parametreleri desteği, arguments nesnesini değiştirmek amacıyla ECMAScript 4'e eklendi, ancak ECMAScript 4 hiçbir zaman meyve vermedi. ECMAScript 6'nın piyasaya sürülmesiyle birlikte, JavaScript artık resmi olarak geri kalan parametreleri desteklemektedir. Ayrıca, arguments nesnesi için desteği düşürme planını da karıştırdı.

arguments nesnesi, tüm işlevlerde kullanılabilen dizi benzeri bir nesnedir. İşleve iletilen argument değerlerinin ada göre değil sayıya göre alınmasına izin verir. Nesne, bir fonksiyona herhangi bir sayıda argüman iletmemize izin verir. Aşağıdaki kod parçasını göz önünde bulundurun:

 function checkParams(param1) { console.log(param1); // 2 console.log(arguments[0], arguments[1]); // 2 3 console.log(param1 + arguments[0]); // 2 + 2 } checkParams(2, 3);

Bu işlev yalnızca bir bağımsız değişken almayı bekler. Onu iki argümanla çağırdığımızda, ilk argümana fonksiyonda param1 parametre ismi veya argümanlar nesne arguments[0] ile erişilebilir, ancak ikinci argümana sadece arguments[1] olarak erişilebilir. Ayrıca, arguments nesnesinin adlandırılmış argümanlarla birlikte kullanılabileceğini unutmayın.

arguments nesnesi, işleve iletilen her argüman için bir girdi içerir ve ilk girdinin dizini 0 başlar. Yukarıdaki örnekte daha fazla argümana erişmek isteseydik, arguments[2] , arguments[3] vb. yazardık.

Adlandırılmış parametreleri ayarlamayı tamamen atlayabilir ve yalnızca arguments nesnesini kullanabiliriz:

 function checkParams() { console.log(arguments[1], arguments[0], arguments[2]); } checkParams(2, 4, 6); // 4 2 6

Aslında, adlandırılmış parametreler bir zorunluluk değil kolaylıktır. Benzer şekilde, geri kalan parametreler, iletilen argümanları yansıtmak için kullanılabilir:

 function checkParams(...params) { console.log(params[1], params[0], params[2]); // 4 2 6 console.log(arguments[1], arguments[0], arguments[2]); // 4 2 6 } checkParams(2, 4, 6);

arguments nesnesi dizi benzeri bir nesnedir, ancak slice() ve foreach() gibi dizi yöntemlerinden yoksundur. arguments nesnesinde dizi yöntemlerini kullanmak için, nesnenin önce gerçek bir diziye dönüştürülmesi gerekir:

 function sort() { var a = Array.prototype.slice.call(arguments); return a.sort(); } sort(40, 20, 50, 30); // [20, 30, 40, 50]

Bu işlevde, Array.prototype.slice.call() , arguments nesnesini bir diziye dönüştürmenin hızlı bir yolu olarak kullanılır. Ardından, sort() yöntemi dizinin öğelerini sıralar ve döndürür.

ECMAScript 6'nın daha da basit bir yolu var. ECMAScript 6'daki yeni bir ekleme olan Array.from() , herhangi bir dizi benzeri nesneden yeni bir dizi oluşturur:

 function sort() { var a = Array.from(arguments); return a.sort(); } sort(40, 20, 50, 30); // [20, 30, 40, 50]

Uzunluk Özelliği

Argümanlar nesnesi teknik olarak bir dizi olmasa da, bir işleve iletilen argüman sayısını kontrol etmek için kullanılabilecek bir length özelliğine sahiptir:

 function countArguments() { console.log(arguments.length); } countArguments(); // 0 countArguments(10, null, "string"); // 3

length özelliğini kullanarak, bir işleve iletilen argümanların sayısı üzerinde daha iyi bir kontrole sahibiz. Örneğin, bir işlevin çalışması için iki argüman gerekiyorsa, geçirilen argümanların sayısını kontrol etmek için length özelliğini kullanabilir ve beklenenden daha azsa bir hata verebiliriz:

 function foo(param1, param2) { if (arguments.length < 2) { throw new Error("This function expects at least two arguments"); } else if (arguments.length === 2) { // do something } }

Dinlenme parametreleri dizilerdir, bu nedenle bir length özelliğine sahiptirler. ECMAScript 6'da önceki kod, dinlenme parametreleriyle yeniden yazılabilir:

 function foo(...params) { if (params.length < 2) { throw new Error("This function expects at least two arguments"); } else if (params.length === 2) { // do something } }

Arayan ve Arayan Özellikleri

callee özelliği, o anda çalışmakta olan işleve başvurur ve caller , o anda yürütülmekte olan işlevi çağırmış olan işleve başvurur. ECMAScript 5 katı modunda, bu özellikler kullanımdan kaldırılmıştır ve bunlara erişmeye çalışmak bir TypeError'a neden olur.

arguments.callee özelliği, özyinelemeli işlevlerde (özyinelemeli bir işlev, kendisine adıyla başvuran normal bir işlevdir), özellikle işlev adı mevcut olmadığında (anonim bir işlev) yararlıdır. Anonim bir işlevin bir adı olmadığından, ona başvurmanın tek yolu arguments.callee .

 var result = (function(n) { if (n <= 1) { return 1; } else { return n * arguments.callee(n - 1); } })(4); // 24

Kesin ve Kesin Olmayan Modlarda Argümanlar Nesnesi

ECMAScript 5 katı olmayan modda, arguments nesnesinin alışılmadık bir özelliği vardır: Değerlerini karşılık gelen adlandırılmış parametrelerin değerleriyle senkronize tutar.

Aşağıdaki kod parçasını göz önünde bulundurun:

 function foo(param) { console.log(param === arguments[0]); // true arguments[0] = 500; console.log(param === arguments[0]); // true return param } foo(200); // 500

Bu işlevin içinde, arguments[0] yeni bir değer atanır. arguments değerleri her zaman adlandırılmış parametrelerin değerleriyle senkronize kaldığından, arguments[0] da yapılan değişiklik aynı zamanda param değerini de değiştirecektir. Aslında, aynı değişken için iki farklı isim gibidirler. ECMAScript 5 katı modunda, arguments nesnesinin bu kafa karıştırıcı davranışı kaldırıldı:

 "use strict"; function foo(param) { console.log(param === arguments[0]); // true arguments[0] = 500; console.log(param === arguments[0]); // false return param } foo(200); // 200

Bu sefer, arguments[0] değiştirmek param etkilemez ve çıktı beklendiği gibi olur. Bu işlevin ECMAScript 6'daki çıktısı, ECMAScript 5 katı modundakiyle aynıdır, ancak function bildiriminde varsayılan değerler kullanıldığında, arguments nesnesinin etkilenmediğini unutmayın:

 function foo(param1, param2 = 10, param3 = 20) { console.log(param1 === arguments[0]); // true console.log(param2 === arguments[1]); // true console.log(param3 === arguments[2]); // false console.log(arguments[2]); // undefined console.log(param3); // 20 } foo('string1', 'string2');

Bu işlevde, param3 varsayılan bir değere sahip olsa da, işleve yalnızca iki argüman iletildiği için arguments[2] eşit değildir. Başka bir deyişle, varsayılan değerlerin ayarlanması, arguments nesnesi üzerinde hiçbir etkiye sahip değildir.

Çözüm

ECMAScript 6, JavaScript'e yüzlerce küçük ve büyük iyileştirme getirdi. Geliştiriciler giderek daha fazla ECMAScript 6 özelliklerini kullanıyor ve yakında bu özellikler kaçınılmaz olacak. Bu öğreticide, ECMAScript 6'nın JavaScript'te parametre işlemeyi nasıl yükselttiğini öğrendik, ancak ECMAScript 6'nın yüzeyini henüz çizdik. Dilin birçok başka yeni ve ilginç özelliği kontrol edilmeye değer.

Bağlantılar

  • ECMAScript 6 Uyumluluk Tablosu, Juriy Zaytsev
  • “ECMAScript 2015 Dil Belirtimi,” ECMA International