Neden aynı satırda anonim bir işlevi çağırmanız gerekiyor?

Kapaklar hakkında bazı yazılar okuyordum ve bunu her yerde gördüm, ama nasıl çalıştığına dair net bir açıklama yok - her zaman bana kullanmam söylendi ...

// Create a new anonymous function, to use as a wrapper
(function(){
    // The variable that would, normally, be global
    var msg = "Thanks for visiting!";

    // Binding a new function to a global object
    window.onunload = function(){
        // Which uses the 'hidden' variable
        alert( msg );
    };
// Close off the anonymous function and execute it
})();

Tamam, yeni anonim işlev oluşturacağımızı ve sonra çalıştıracağımızı görüyorum. Bundan sonra bu basit kod çalışmalı (ve çalışıyor):

(function (msg){alert(msg)})('SO');

Sorum şu, burada ne tür bir büyü oluyor? Ben yazarken düşündüm:

(function (msg){alert(msg)})

"" (msg) işlevi gibi yeni bir adsız işlev oluşturulur ...

ama o zaman bu neden çalışmıyor?

(function (msg){alert(msg)});
('SO');

Neden aynı çizgide olması gerekiyor?

Bana bazı yayınları gösterebilir veya bana bir açıklama yapabilir misiniz?

İşlev tanımından sonra noktalı virgül bırakın.

(function (msg){alert(msg)})
('SO');

Yukarıda çalışmalı.

DEMO Sayfası: https://jsfiddle.net/e7ooeq6m/

Bu yazıda bu tür bir desen tartıştım:

jQuery ve $ soruları

DÜZENLE:

ECMA komut dosyası belirtimine bakarsanız, bir işlevi tanımlamanın 3 yolu vardır. (Sayfa 98, Kısım 13 İşlev Tanımı)

1. İşlev yapıcısını kullanma

var sum = new Function('a','b', 'return a + b;');
alert(sum(10, 20)); //alerts 30

2. İşlev bildirimini kullanma.

function sum(a, b)
{
    return a + b;
}

alert(sum(10, 10)); //Alerts 20;

3. İşlev İfadesi

var sum = function(a, b) { return a + b; }

alert(sum(5, 5)); // alerts 10

O zaman şunu sorabilirsiniz: Beyan ve ifade arasındaki fark nedir?

ECMA Script spesifikasyonundan:

İşlev Bildirimi: işlev Tanımlayıcısı (FormalParameterListopt) {FunctionBody}

İşlev İfadesi: işlev Identifieropt (FormalParameterListopt) {FunctionBody}

Dikkat ederseniz, işlev tanımlaması için 'tanımlayıcı' isteğe bağlıdır . Bir tanımlayıcı vermezseniz, anonim bir işlev oluşturursunuz. Bu, bir tanımlayıcı belirleyemeyeceğiniz anlamına gelmez.

Bu, aşağıdakilerin geçerli olduğu anlamına gelir.

var sum = function mySum(a, b) { return a + b; }

Dikkat edilmesi gereken önemli nokta, 'mySum'u dışarıda değil, yalnızca mySum işlev gövdesi içinde kullanabilmenizdir. Aşağıdaki örneğe bakın:

var test1 = function test2() { alert(typeof test2); }

alert(typeof(test2)); //alerts 'undefined', surprise! 

test1(); //alerts 'function' because test2 is a function.

Canlı Demo

Bunu şununla karşılaştır:

 function test1() { alert(typeof test1) };

 alert(typeof test1); //alerts 'function'

 test1(); //alerts 'function'

Bu bilgiyle donanmış olarak, kodunuzu analiz etmeye çalışalım.

Gibi bir kodunuz olduğunda,

    function(msg) { alert(msg); }

Bir işlev ifadesi oluşturdunuz. Ve bu işlev ifadesini parantez içine sararak yürütebilirsiniz.

    (function(msg) { alert(msg); })('SO'); //alerts SO.

Buna kendi kendine çağrılan işlev denir.

Aradığınızda yaptığınız (function(){})şey bir işlev nesnesi döndürmektir. Eklediğinizde (), çağrılır ve vücuttaki herhangi bir şey yürütülür. ;2 çağırma neden başarısız olduğunu, deyimi bitiş gösterir.

Kafa karıştırıcı bulduğum bir şey, "()" operatörleri gruplamak.

İşte size bildirilen temel işlev.

Ör. 1:

var message = 'SO';

function foo(msg) {
    alert(msg);
}

foo(message);

İşlevler nesnedir ve gruplandırılabilir. Öyleyse işlevin etrafına parens atalım.

Ör. 2:

var message = 'SO';

function foo(msg) {  //declares foo
    alert(msg);
}

(foo)(message);     // calls foo

Şimdi aynı işlevi çağırmak ve hemen çağırmak yerine, onu adlandırdığımız gibi tanımlamak için temel ikameyi kullanabiliriz.

Ör. 3.

var message = 'SO';

(function foo(msg) {
    alert(msg);
})(message);          // declares & calls foo

Son olarak, bu ekstra fooya ihtiyacımız yok çünkü adı aramak için kullanmıyoruz! Fonksiyonlar isimsiz olabilir.

Ör. 4.

var message = 'SO';

(function (msg) {   // remove unnecessary reference to foo
    alert(msg);
})(message);

Sorunuzu cevaplamak için Örnek 2'ye bakınız. İlk satırınız isimsiz bir fonksiyon bildirir ve gruplandırır, ancak çağırmaz. İkinci satır bir dizeyi gruplandırır. Her ikisi de hiçbir şey yapmaz. (Vincent'ın ilk örneği.)

(function (msg){alert(msg)});  
('SO');                       // nothing.

(foo); 
(msg); //Still nothing.

Fakat

(foo)
(msg); //works

Anonim işlev, "" adında bir işlev değil. Basitçe adı olmayan bir işlevdir.

JavaScript'teki diğer herhangi bir değer gibi, bir işlevin de oluşturulması için bir ad gerekmez. Her ne kadar başka bir değer gibi bir isme bağlanmak çok daha yararlı olsa da.

Ancak diğer herhangi bir değer gibi, bazen onu bir ada bağlamadan kullanmak istersiniz. Kendini çağıran model budur.

İşte bir fonksiyon ve bir sayı, bağlı değil, hiçbir şey yapmazlar ve asla kullanılamazlar:

function(){ alert("plop"); }
2;

Bu yüzden, bunları diğer değerlerde olduğu gibi kullanabilmek için bir değişkende saklamamız gerekir:

var f = function(){ alert("plop"); }
var n = 2;

İşlevi bir değişkene bağlamak için sözdizimi şekeri de kullanabilirsiniz:

function f(){ alert("plop"); }
var n = 2;

Ancak bunları adlandırmak gerekli değilse ve daha fazla karışıklığa ve daha az okunabilirliğe yol açarsa, bunları hemen kullanabilirsiniz.

(function(){ alert("plop"); })(); // will display "plop"
alert(2 + 3); // will display 5

Burada, işlevim ve sayılarım bir değişkene bağlı değil, ancak yine de kullanılabilirler.

Böyle söylendiğinde, kendini çağırma işlevinin gerçek bir değeri yok gibi görünüyor. Ancak, JavaScript kapsam sınırlayıcısının blok ({}) değil, işlev olduğunu unutmayın.

Yani, kendini çağırma işlevi aslında bir C ++, C # veya Java bloğu ile aynı anlama sahiptir. Bu, içinde oluşturulan değişkenin kapsam dışında "sızmayacağı" anlamına gelir. Bu, küresel kapsamı kirletmemek için JavaScript'te çok yararlıdır.

JavaScript böyle çalışır. Adlandırılmış bir işlev bildirebilirsiniz:

function foo(msg){
   alert(msg);
}

Ve ara:

foo("Hi!");

Veya anonim bir işlev bildirebilirsiniz:

var foo = function (msg) {
    alert(msg);
}

Ve şöyle deyin:

foo("Hi!");

Veya işlevi asla bir isme bağlayamazsınız:

(function(msg){
   alert(msg);
 })("Hi!");

İşlevler işlevleri de döndürebilir:

function make_foo() {
    return function(msg){ alert(msg) };
}

(make_foo())("Hi!");

Gövdesinde "var" ile tanımlanan tüm değişkenlerin make_foo,make_foo . Bu bir kapanıştır ve bir işlev tarafından değerde yapılan herhangi bir değişikliğin diğeri tarafından görüleceği anlamına gelir.

Bu, dilerseniz bilgileri kapsüllemenizi sağlar:

function make_greeter(msg){
    return function() { alert(msg) };
}

var hello = make_greeter("Hello!");

hello();

Java'nın neredeyse tüm programlama dilleri bu şekilde çalışır.

Gösterdiğiniz kod,

(function (msg){alert(msg)});
('SO');

iki ifadeden oluşur . Birincisi, bir fonksiyon nesnesi veren bir ifadedir (daha sonra kaydedilmediğinden toplanacaktır). İkincisi, bir dize veren bir ifadedir. İşlevi dizeye uygulamak için, dizeyi oluşturulduğunda işleve bağımsız değişken olarak iletmeniz (yukarıda da gösterdiğiniz gibi) veya işlevi bir değişkende depolamanız gerekir. daha sonra, boş zamanlarınızda uygulayın. Şöyle ki:

var f = (function (msg){alert(msg)});
f('SO');

Anonim bir işlevi (lambda işlevi) bir değişkene kaydederek etkin bir şekilde bir ad verdiğinizi unutmayın. Bu nedenle, normal bir işlevi de tanımlayabilirsiniz:

function f(msg) {alert(msg)};
f('SO');

Önceki yorumların özeti:

function() {
  alert("hello");
}();

bir değişkene atanmadığında, bir sözdizimi hatası verir. Kod, kapanış parantezlerini sözdizimsel olarak yanlış yapan bir işlev ifadesi (veya tanımı) olarak ayrıştırılır. İşlev kısmının etrafına parantez eklemek yorumlayıcıya (ve programcıya) bunun bir işlev ifadesi (veya çağırma) olduğunu söyler,

(function() {
  alert("hello");
})();

Bu, kendi kendini çağıran bir işlevdir, yani anonim olarak oluşturulur ve çağrılma bildirildiği aynı satırda gerçekleştiği için hemen çalışır. Bu kendi kendine yürütmesini fonksiyonu no-argüman işlevi çağırmak için tanıdık sözdizimi ile gösterilen artı fonksiyon isminden parantez eklenir: (myFunction)();.

Orada iyi SO tartışma JavaScript işlevi sözdizimi .

Bu cevap kesinlikle soru ile ilgili değildir, ancak bu tür bir sözdizimi özelliğinin işlevlere özgü olmadığını öğrenmek isteyebilirsiniz. Örneğin, her zaman böyle bir şey yapabiliriz:

alert(
    {foo: "I am foo", bar: "I am bar"}.foo
); // alerts "I am foo"

Fonksiyonlarla ilgili. Function.prototype'den devralınan nesneler oldukları için şunları yapabiliriz:

Function.prototype.foo = function () {
    return function () {
        alert("foo");
    };
};

var bar = (function () {}).foo();

bar(); // alerts foo

Ve biliyorsunuz, onları yerine getirmek için fonksiyonları parantez içine almamız bile gerekmiyor. Her neyse, sonucu bir değişkene atamaya çalıştığımız sürece.

var x = function () {} (); // this function is executed but does nothing

function () {} (); // syntax error

İşlevlerle yapabileceğiniz bir diğer şey, onları bildirir bildirmez, newoperatörü bunlara çağırmak ve bir nesne elde etmektir. Aşağıdakiler eşdeğerdir:

var obj = new function () {
    this.foo = "bar";
};

var obj = {
    foo : "bar"
};

JavaScript işlevinin sahip olduğu bir özellik daha var. Aynı anonim işlevi özyinelemeli olarak çağırmak istiyorsanız.

(function forInternalOnly(){

  //you can use forInternalOnly to call this anonymous function
  /// forInternalOnly can be used inside function only, like
  var result = forInternalOnly();
})();

//this will not work
forInternalOnly();// no such a method exist

Sorucunun sorusunu anlamam şu şekildedir:

Bu sihir nasıl çalışır:

(function(){}) ('input')   // Used in his example

Yanılıyor olabilirim. Bununla birlikte, insanların aşina olduğu alışılmış uygulama:

(function(){}('input') )

Bunun nedeni, AKA JavaScript parantezlerinin ()ifadeleri içerememesidir ve ayrıştırıcı işlev anahtar sözcüğüyle karşılaştığında, bunu bir işlev bildirimi olarak değil bir işlev ifadesi olarak ayrıştırmayı bilir.

Kaynak: blog yazısı Hemen Çalıştırılan İşlev İfadesi (IIFE)

köşeli parantezsiz örnekler:

void function (msg) { alert(msg); }
('SO');

(bu boşluğun tek gerçek kullanımıdır, afaik)

veya

var a = function (msg) { alert(msg); }
('SO');

veya

!function (msg) { alert(msg); }
('SO');

iş de. voidatama ve şüphesiz, hem de ekspresyon değerlendirmek neden olmaktadır. Sonuncusu ile çalışır ~, +, -, delete, typeof, tekli operatörlerden bazıları ( voidsıra biridir). çalışmayan bir değişkeni gereği ++, --çünkü.

satır sonu gerekli değildir.

Kendiliğinden çalışan anonim bir işlevdir. İlk köşeli ayraç kümesi yürütülecek ifadeleri içerir ve ikinci köşeli ayraç kümesi bu ifadeleri yürütür.

(function () {
    return ( 10 + 20 );
})();

Peter Michaux Önemli Bir Parantez Çifti arasındaki farkı tartışıyor .

Üst ad alanından değişkenleri gizlemeye çalışırken yararlı bir yapıdır. Fonksiyon içindeki tüm kodlar fonksiyonun özel kapsamındadır, yani fonksiyonun dışından hiç erişilemez, bu da onu gerçekten özel yapar.

Görmek:

1. Kapanış (bilgisayar bilimi)
2. JavaScript Ad Aralığı
3. Önemli Javascript Parantezleri Çifti

Başka bir bakış açısı

İlk olarak, anonim bir işlev bildirebilirsiniz:

var foo = function(msg){
 alert(msg);
}

O zaman siz deyin:

foo ('Few');

Çünkü foo = function (msg) {alert (msg);} böylece foo'yu aşağıdaki gibi değiştirebilirsiniz :

function(msg){
 alert(msg);
} ('Few');

Ancak, ayrıştırırken işlev bildirme sözdizimi hatasını önlemek için tüm anonim işlevinizi parantez çifti içine sarmalısınız. Sonra,

(function(msg){
 alert(msg);
}) ('Few');

Bu şekilde benim için kolay anlaşılır.

Yaptığınız zaman:

(function (msg){alert(msg)});
('SO');

('SO')Noktalı virgül nedeniyle işlevi daha önce sonlandırdınız . Sadece yazarsanız:

(function (msg){alert(msg)})
('SO');

Çalışacak.

Çalışma örneği: http://jsfiddle.net/oliverni/dbVjg/

Çalışmamasının basit nedeni ;, anonim işlevin sonunu göstermekten değil . Çünkü ()bir işlev çağrısının sonunda, bir işlev çağrısı değildir. Yani,

function help() {return true;}

Eğer çağırırsanız result = help();bu bir fonksiyon çağrısıdır ve true değerini döndürür.

Eğer ararsan result = help; bu bir çağrı değildir. Yardımın sonuca atanacak veriler gibi ele alındığı bir görevdir.

Yaptığınız şey noktalı virgül ekleyerek anonim bir işlevi bildirmek / başlatmaktı,

(function (msg) { /* Code here */ });

ve sonra sadece parantez kullanarak başka bir deyimde çağırmayı denedim ... Açıkçası işlevin adı yok, ancak bu işe yaramaz:

('SO');

Tercüman, ikinci satırdaki parantezleri yeni bir talimat / ifade olarak görür ve bu şekilde yapsanız bile çalışmaz:

(function (msg){/*code here*/});('SO');

Hala çalışmıyor, ancak noktalı virgül kaldırdığınızda çalışıyor, çünkü yorumlayıcı beyaz boşlukları ve arabaları yok sayar ve kodun tamamını tek bir deyim olarak görür.

(function (msg){/*code here*/})        // This space is ignored by the interpreter
('SO');

Sonuç: ()başka bir işlev tarafından çağrılma gibi belirli koşullar altında, yani onload = 'help' parantezler dahil edilmemiş olsa bile yardım işlevini yürütmezse, işlev çağrısı, sonu olmayan bir işlev çağrısı değildir. Ben setTimeout ve setInterval da bu tür bir işlev çağrısı da izin inanıyorum, ve ben de yorumcu "nasıl bir işlev çağrısı parantez olmadan bir işlev çağrısı değil" geri getiriyor perde arkasında parantez ekler inanıyorum.

(function (msg){alert(msg)})
('SO');

Bu, anonim bir işlevi birçok JavaScript çerçevesinin kullandığı bir kapak olarak kullanmanın yaygın bir yöntemidir.

Çağrılan bu işlev, kod derlendiğinde otomatik olarak başlar.

;İlk satıra yerleştirilirse , derleyici iki farklı satır olarak kabul etti. Yani yukarıdakiyle aynı sonuçları elde edemezsiniz.

Bu ayrıca şu şekilde de yazılabilir:

(function (msg){alert(msg)}('SO'));

Daha fazla ayrıntı için JavaScript / Anonim İşlevler konusuna bakın .

1. Anonim işlevler, çalışma zamanında dinamik olarak bildirilen işlevlerdir. Anonim işlevler olarak adlandırılırlar, çünkü normal işlevlerle aynı şekilde bir ad verilmezler.

   Anonim işlevler, işlev bildirimi yerine işlev operatörü kullanılarak bildirilir. İfade koymak için geçerli olan her yerde yeni bir işlev oluşturmak için işlev operatörünü kullanabilirsiniz. Örneğin, yeni bir işlevi bir işlev çağrısına parametre olarak veya başka bir nesnenin özelliğini atamak için bildirebilirsiniz.

   Aşağıda, adlandırılmış bir işlevin tipik bir örneği verilmiştir:

   işlevi flyToTheMoon () {alert ("Zoom! Zoom! Zoom!"); } aya uç(); Anonim işlev olarak oluşturulan aynı örnek şöyledir:

   var flyToTheMoon = function () {alert ("Yakınlaştır! Yakınlaştır! Yakınlaştır!"); } aya uç();

   Ayrıntılar için lütfen burayı okuyun:

   http://helephant.com/2008/08/23/javascript-anonymous-functions/

IIFE basitçe işlevi bölümlere ayırır ve msgdeğişkeni, genel ad alanını "kirletmeyecek" şekilde gizler . Gerçekte, basit olun ve bir milyar dolarlık web sitesi oluşturmadığınız sürece aşağıdakileri yapın.

var msg = "later dude";
window.onunload = function(msg){
  alert( msg );
};

Eğer ad alanı olabilir msgbir kullanarak tesisle Revealing Modül Desen gibi:

var myScript = (function() {
    var pub = {};
    //myscript.msg
    pub.msg = "later dude";
    window.onunload = function(msg) {
        alert(msg);
    };
    //API
    return pub;
}());

Anonim işlevler, sağladığınız bir girdiden sizden bir çıktı oluşturması için anında bir işlevi tanımladığınız tek seferlik bir anlaşma anlamına gelir. Bunun dışında girdiyi sağlamadınız. Bunun yerine, ikinci satıra bir şeyler yazdınız ('SO'); - işlevle ilgisi olmayan bağımsız bir ifade. Ne bekliyordun? :)