Hvorfor legge Javascript klasse i en anonym funksjon () kaller?

stemmer
17

Jeg leste om den nye Javascript-lignende språk fra Microsoft kalt Loggfila . I lekeplass (eksempel avsnitt) , er det en enkel klasse i Loggfila syntaks konvertert til Javascript-kode. Kommer fra en Java-programmering bakgrunn, var det interessant for meg å lære hvordan OOP gjøres i Javascript som samlet fra Loggfila.

Loggfila kode:

class Greeter {
    greeting: string;
    constructor (message: string) {
        this.greeting = message;
    }
    greet() {
        return Hello,  + this.greeting;
    }
}   

var greeter = new Greeter(world);

var button = document.createElement('button')
button.innerText = Say Hello
button.onclick = function() {
    alert(greeter.greet())
}

document.body.appendChild(button)

Og tilsvarende Javascript-kode:

var Greeter = (function () {
    function Greeter(message) {
        this.greeting = message;
    }
    Greeter.prototype.greet = function () {
        return Hello,  + this.greeting;
    };
    return Greeter;
})();
var greeter = new Greeter(world);
var button = document.createElement('button');
button.innerText = Say Hello;
button.onclick = function () {
    alert(greeter.greet());
};
document.body.appendChild(button);

Loggfila delen er veldig lik Java slik jeg forstår det. Nå er spørsmålet mitt er hvorfor i Javascript kroppen av Greeterklassen er innebygd i en en anonym function()samtale?

Hvorfor ikke skrive det slik?

function Greeter(message) {
    this.greeting = message;
}
Greeter.prototype.greet = function () {
    return Hello,  + this.greeting;
};

Hva er fordelen / ulempen med hver metode?

Publisert på 02/10/2012 klokken 14:27
kilden bruker
På andre språk...                            


6 svar

stemmer
14

Følgende kalles en Umiddelbart påkalte funksjon Expression :

(function(){ ... })();

Den brukes til å holde den globale omfang ren. Skjønt, i dette tilfellet er det ikke nødvendig siden returverdien er tilordnet en variabel Greeter. Den eneste gangen dette mønsteret er nyttig er når du vil "private" statiske medlemmer.

Eg:

var Greeter = (function () {
    var foo = 'foo', bar = 'bar'; /* only accessible from function's defined
                                     in the local scope ... */

    function Greeter(message) {
        this.greeting = message;
    }
    Greeter.prototype.greet = function () {
        return "Hello, " + this.greeting;
    };
    return Greeter;
})();
Svarte 02/10/2012 kl. 14:30
kilden bruker

stemmer
3

Foruten de åpenbare scoping / nedleggelse resonnement. Ved hjelp av en anonym funksjon som påkaller seg umiddelbart pre-belastning (tolker) klassedefinisjon. Dette gjør det mulig for eventuelle JIT optimaliseringer som skal fram lastet i utførelsen. Kort sagt, for større mer komplekse applikasjoner vil det forbedre ytelsen.

Svarte 02/10/2012 kl. 14:44
kilden bruker

stemmer
2

Dette er for å gi rom for private medlemmer. I dette eksemplet, alle medlemmer er offentlig, slik at to konstruksjoner er likeverdige. Men hvis du ønsker å gi for private medlemmer du trenger å skjule dem fra å ringe omfang via en nedleggelse. Således hvis du har en privat medlem som så:

class Greeter {
    private greeting: string;
    constructor (message: string) {
        this.greeting = message;
    }
    greet() {
        return "Hello, " + this.greeting;
    }
} 

Du vil trolig få noe som dette:

var Greeter = (function () {
    var greeting="";
    function Greeter(message) {
        greeting = message;
    }
    Greeter.prototype.greet = function () {
        return "Hello, " + greeting;
    };
    return Greeter;
})();

Hilsenen variable vil være tilgjengelig til alle funksjoner definert innenfor den anonyme funksjonen, men usynlig overalt ellers.

Svarte 02/10/2012 kl. 14:36
kilden bruker

stemmer
2

Den anonym funksjon / selvstendig utførelse av lukkeanordningen er vanligvis anvendes for å innkapsle omfang, slik at bare den returnerte verdi er tilgjengelig utenfor den. (Eller noe du fester seg til andre objekter, som vindu)

Svarte 02/10/2012 kl. 14:31
kilden bruker

stemmer
1

Den anonym funksjon er trolig der for å hindre navn collition med andre deler av koden. Tenk på det på denne måten, inni anonym funksjon, kan du selv erklære en variabel kalt "$" for å bli hva du vil, og på samme tid, skal bruke jQuery på andre deler av koden uten konflikt.

Svarte 02/10/2012 kl. 14:31
kilden bruker

stemmer
-4

Lukke er det eneste middel til å ringe konstruktørene med parametere:

var w = new Greeter("hello")

Det finnes andre metoder, men alle komplisert og med begrensninger og ulemper.

Svarte 18/07/2014 kl. 08:13
kilden bruker

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more