Neden bir işlevi JavaScript'te tanımlanmadan önce kullanabilirim?

Bu kod, farklı tarayıcılarda bile her zaman çalışır:

function fooCheck() {
  alert(internalFoo()); // We are using internalFoo() here...

  return internalFoo(); // And here, even though it has not been defined...

  function internalFoo() { return true; } //...until here!
}

fooCheck();

Yine de neden çalışması gerektiğine dair tek bir referans bulamadım. Bunu ilk olarak John Resig'in sunum notunda gördüm, ancak sadece bahsedildi. Bu konuda orada veya hiçbir yerde bir açıklama yok.

Birisi beni aydınlatabilir mi?

functionDeklarasyon sihirli ve onun tanımlayıcı * yürütülür onun kod bloğunda şeyden önce tabi olmayı neden olur.

Bu function, normal yukarıdan aşağıya sıralanan bir ifadeye sahip bir ödevden farklıdır .

Örneği şu şekilde değiştirdiyseniz:

var internalFoo = function() { return true; };

çalışmayı bırakırdı.

İşlev bildirimi, neredeyse aynı görünseler ve bazı durumlarda belirsiz olabilse de işlev ifadesinden işlev ifadesinden oldukça farklıdır.

Bu, ECMAScript standardı , bölüm 10.1.3'te belgelenmiştir . Ne yazık ki ECMA-262, standartlar tarafından bile okunabilir bir belge değildir!

*: içeren fonksiyon, blok, modül veya script.

Buna HOISTING - Bir işlevi tanımlanmadan önce çağırma (çağırma) adı verilir.

Hakkında yazmak istediğim iki farklı işlev türü:

İfade İşlevleri ve Bildirim İşlevleri

1. İfade İşlevleri:

   İşlev ifadeleri, işlev adlarına ihtiyaç duymadan bir değişkende saklanabilir. Ayrıca anonim işlev (adsız bir işlev) olarak adlandırılacaktır.

   Bu işlevleri çağırmak (çağırmak) için her zaman değişken bir isme ihtiyaçları vardır . Bu tür bir işlev, tanımlanmadan önce çağrılırsa çalışmaz, bu da Kaldırma'nın burada gerçekleşmediği anlamına gelir. Her zaman önce ifade işlevini tanımlamalı ve sonra çağırmalıyız.

   let lastName = function (family) {
    console.log("My last name is " + family);
   };
   let x = lastName("Lopez");

   ECMAScript 6'da şöyle yazabilirsiniz:

   lastName = (family) => console.log("My last name is " + family);
   
   x = lastName("Lopez");

2. Beyan Fonksiyonları:

   Aşağıdaki sözdizimiyle bildirilen işlevler hemen yürütülmez. "Daha sonra kullanılmak üzere kaydedilirler" ve çağrıldıklarında (çağrıldıklarında) daha sonra çalıştırılırlar. Bu tür bir işlev, tanımlanmış olandan ÖNCE veya SONRA çağırırsanız çalışır. Tanımlama işlevini tanımlanmadan önce çağırırsanız Kaldırma düzgün çalışır.

   function Name(name) {
     console.log("My cat's name is " + name);
   }
   Name("Chloe");

   Kaldırma örneği:

   Name("Chloe");
   function Name(name) {
      console.log("My cat's name is " + name);
   }

Tarayıcı HTML'nizi baştan sona okur ve çalıştırılabilir parçalar halinde (değişken bildirimleri, işlev tanımları vb.) Okunup ayrıştırıldığında yürütebilir. Ancak herhangi bir noktada komut dosyasında tanımlananları yalnızca bu noktadan önce kullanabilir.

Bu, tüm kaynak kodunuzu işleyen (derleyen), belki de referansları çözümlemek için ihtiyacınız olan herhangi bir kütüphaneyle birbirine bağlayan ve yürütme işleminin başladığı yürütülebilir bir modül oluşturan diğer programlama bağlamlarından farklıdır.

Kodunuz, daha sonra tanımlanmış olan adlandırılmış nesnelere (değişkenler, diğer işlevler, vb.) Atıfta bulunabilir, ancak tüm parçalar mevcut olana kadar yönlendirme kodunu yürütemezsiniz.

JavaScript'i tanıdıkça, bir şeyleri doğru sırayla yazma ihtiyacınızın farkında olacaksınız.

Düzeltme: Kabul edilen cevabı onaylamak için (yukarıda), bir web sayfasının komut dosyası bölümüne geçmek için Firebug'u kullanın. Herhangi bir kodu çalıştırmadan önce yalnızca ilk satırı ziyaret ederek işlevden işleve atladığını göreceksiniz.

Bazı diller kullanımdan önce tanımlayıcıların tanımlanması gerekliliğine sahiptir. Bunun bir nedeni, derleyicinin kaynak kodunda tek bir geçiş kullanmasıdır.

Ancak birden fazla geçiş varsa (veya bazı kontroller ertelenirse), bu gereksinim olmadan mükemmel bir şekilde yaşayabilirsiniz. Bu durumda, kod muhtemelen ilk önce okunur (ve yorumlanır) ve sonra bağlantılar ayarlanır.

Sadece biraz JavaScript kullandım. Bunun yardımcı olup olmayacağından emin değilim, ama konuştuğunuz şeye çok benziyor ve biraz fikir verebilir:

http://www.dustindiaz.com/javascript-function-declaration-ambiguity/

"İnternalFoo" işlevinin gövdesinin ayrıştırma zamanında bir yere gitmesi gerekir, bu nedenle kod JS yorumlayıcısı tarafından okunduğunda (aka ayrıştırma), işlevin veri yapısı oluşturulur ve ad atanır.

Ancak daha sonra kod çalıştırılır, JavaScript aslında "internalFoo" nun var olup olmadığını ve ne olduğunu ve çağrılıp çağrılamayacağını vb.

Aynı nedenden ötürü aşağıdakiler daima fooglobal ad alanına konacaktır :

if (test condition) {
    var foo;
}