javascript fonksiyon parametresi nesne gösterimi ile


Arasındaki farklar nelerdir

function updateSomething(item) {}

ve

function updateSomething({items}) {}

? İlkindeki öğe değişkeni de bir nesne olabilir, ikinci olan neden nesne gösterimi kullanıyor? İlkini ve sonrakini ne zaman kullanmalıyım?

Cevap #1

Bu, ES2015'ten gelen parametre yapısal çözümlemesidir. İkinci durumda, bir yerel değişkeni argümanın items özelliğinin değeriyle başlatıyorsunuz.

function updateSomething({items}) {

yaklaşık olarak eşdeğerdir

function updateSomething(obj) {
     var items = obj.items;

Bazı diğer örnekler burada ve burada.

Ve MDN'den: Fonksiyon parametresi olarak geçirilen nesnelerden alanları çekmek

Bu sözdiziminin henüz Edge veya Safari'de mevcut olmadığını unutmayın (uyumluluk haritasına bakın), bu yüzden Babel gibi bir dönüştürücü kullanmak isteyebilirsiniz.

Cevap #2

İkinci örnek, ilk parametrenin bir nesne olduğunu varsayarak, ES6'nın parametre parçalama kısayolunu kullanarak item özelliğini çıkarmaktır:

function destructure({item}) {
  console.log(item);
}

destructure({item: 3}); // logs "3"

ES5 eşdeğeri şun olurdu:

function destructure(arg1) {
  var item = arg1.item; // or throw
  ...
}

2ality tarafından yazılmış bu blog gönderisi, yapısal çözümleme, parametreler ve bunların nasıl birlikte çalıştığı hakkında mükemmel bir yazıya sahip.

Eğer destructure'e verilen ilk argüman bir item özelliğine sahip değilse bu bir hata verecektir.

Parametreyi bölmek için belirtebilir veya bunu varsayılanlarla birleştirebilirsiniz:

function ({foo, bar} = param) {
  console.log(foo, bar); // the rest of param is not available
}

function ({foo, bar = 11} = param) {
  console.log(foo, bar); // bar will be 11 if it was not set in param
}

Bu sözdiziminin birkaç farklı varyasyonu vardır, ancak bu, nesne kısayolu sözdiziminin karşılığıdır:

const item = 3;
destructure({item}); // creates an object like {item: item}