JavaScript işlev isimlerim neden çakışıyor?

Aşağıdaki betiği sadece bir değişken ile ona atanmış bir işleve sahip bir işlevin adları çakıştığında ne olacağını görmek için yazdım:

var f = function() {
    console.log("Me original.");
}

function f() {
    console.log("Me duplicate.");
}

f();

Aldığım çıktı "Ben orjinalim." Diğer işlev neden çağrılmadı?

Ayrıca, orijinal atamamı olarak değiştirirsem var f = new function() {, "Ben orijinal" ve ardından bir TypeError ifadesi alırım object is not a function. Lütfen birisi açıklayabilir mi?

İşlev bildirimleri JavaScript'te kaldırılır (en üste taşınır). Ayrıştırma sırası açısından yanlış olsa da, sahip olduğunuz kod anlamsal olarak aşağıdaki ile aynıdır çünkü işlev bildirimleri kaldırılmıştır:

function f() {
    console.log("Me duplicate.");
}
var f = function() {
    console.log("Me original.");
}


f();

Sırasıyla, işlevin adı dışında aşağıdakilerle aynıdır:

var f = function() {
    console.log("Me duplicate.");
}
var f = function() {
    console.log("Me original.");
}


f();

Bu da değişken kaldırma nedeniyle aşağıdakilerle aynıdır:

var f;
f = function() {
    console.log("Me duplicate.");
}
f = function() {
    console.log("Me original.");
}

f();

Bu da ne elde ettiğinizi açıklar, işlevi geçersiz kılarsınız. Daha genel olarak, varJavaScript'te birden çok bildirime izin verilir - var x = 3; var x = 5tamamen yasaldır. Yeni ECMAScript 6 standardında letifadeler bunu yasaklamaktadır.

@Kangax tarafından yazılan bu makale , javascript'teki işlevlerin gizemini çözmede harika bir iş çıkarıyor

Takip eden sorunuzu kimse yanıtlamazsa, bu yüzden burada cevaplayacağım, ancak genellikle takip sorularını ayrı sorular olarak sormalısınız.

Bunun nedenini sordun:

var f = new function() {
    console.log("Me original.");
}

function f() {
    console.log("Me duplicate.");
}

f();

"Ben orijinal" yazdırır. ve sonra bir hata.

Burada olan şey new, fonksiyonun yapıcı olarak kullanılmasına neden olan nedenlerdir. Yani bu şuna eşdeğerdir:

function myConstructor() {
    console.log("Me original.");
}
var f = new myConstructor();

function f() {
    console.log("Me duplicate.");
}

f();

Ve Benjamin'in açıkladığı kaldırma işlevi sayesinde, yukarıdakiler esasen buna eşdeğerdir:

var myConstructor = function() {
    console.log("Me original.");
};
var f = function() {
    console.log("Me duplicate.");
};

f = new myConstructor();

f();

Bu ifade:

var f = new function() {
    console.log("Me original.");
}

yapıcı folarak anonim bir işlev kullanılarak yeni bir nesnenin oluşturulmasına ve atanmasına neden olur . "Ben orjinalim." yapıcı yürütürken yazdırılır. Ancak inşa edilen nesnenin kendisi bir işlev değildir, dolayısıyla bu sonunda çalıştırıldığında:

f();

fbir işlev olmadığı için hata alırsınız .

Bir nokta eklemenin yanlış yolu buysa beni affet. Buralarda pek bulunmadım ve yapıcı yön ve / veya eleştiriyi memnuniyetle karşılarım.

Benjamin'in cevabı, OP'nin sorusuna mükemmel bir şekilde hitap ediyor, ancak bize kaldırma ve tuhaflıkları hakkında tam bir tur verecek bir ince ayar eklemek istiyorum.

Orijinal koda şöyle bir çağrı ile başlarsak f:

f();

var f = function() {
   console.log("Me original.");
};

function f() {
   console.log("Me duplicate.");
}

f();

Çıktı daha sonra:

Me duplicate.
Me original.

Bunun nedeni varve functionifadeler biraz farklı şekillerde yükseltilmiştir.

İçin beyanı geçerli kapsamı * üstüne taşınır, ancak herhangi bir atama çekilmez. Bildirilen değişkenin değeri gittiği sürece, orijinal atama satırına ulaşılana kadar tanımsızdır.var

İçin functionifadeleri , beyan hem ve tanımı askıya alır. Yapıda kullanılan işlev ifadelerivar f = function() {... kaldırılmaz.

Yani kaldırma işleminden sonra yürütme, kod sanki:

var f; // declares var f, but does not assign it.

// name and define function f, shadowing the variable
function f() { 
  console.log("Me duplicate.");
}

// call the currently defined function f
f(); 

// assigns the result of a function expression to the var f,
// which shadows the hoisted function definition once past this point lexically
f = function() { 
  console.log("Me original."); 
}

// calls the function referenced by the var f
f();

* Tüm JavaScript kapsamı sözcüksel veya işlev, kapsamdır, ancak o noktada f sözcüğünü kullanmak bazı şeyleri karıştıracak gibi görünüyordu.