¿Por qué integrar la clase JavaScript en una función anónima () llamar?

votos
17

Estaba leyendo sobre el nuevo lenguaje JavaScript similar de Microsoft llamada mecanografiado . En el patio de recreo (ejemplo sección) , hay una clase simple en la sintaxis de mecanografiado convertido a código JavaScript. Viniendo de un fondo de programación Java, fue interesante para mí de aprender cómo se hace en programación orientada a objetos JavaScript como compilado a partir de mecanografiado.

El código mecanografiado:

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)

Y el código JavaScript equivalente:

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);

La parte de imprenta es muy similar a Java por lo que entiendo eso. Ahora mi pregunta es ¿por qué en JavaScript del cuerpo de la Greeterclase se incrusta en una anónima una function()llamada?

Por qué no escribir esto así?

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

¿Cuál es la ventaja / desventaja de cada método?

Publicado el 02/10/2012 a las 15:27
fuente por usuario
En otros idiomas...                            


6 respuestas

votos
14

La siguiente se llama una expresión de función Inmediatamente Se invoca :

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

Se utiliza para mantener el ámbito global limpio. Sin embargo, en este caso no es necesario, ya que se le asigna el valor devuelto a una variable Greeter. La única vez que este patrón es útil es cuando se quiere "privadas" estáticas miembros.

P.ej:

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;
})();
Respondida el 02/10/2012 a las 15:30
fuente por usuario

votos
3

Además de la obvia razón de alcance / cierre. Utilizando una función anónima que llama a sí mismo inmediatamente precarga (interpreta) la definición de clase. Esto permite que cualquier optimizaciones JIT a ser cargados delante dentro de la ejecución. En resumen, para aplicaciones más grandes y complejas que mejorará el rendimiento.

Respondida el 02/10/2012 a las 15:44
fuente por usuario

votos
2

Esto es para permitir que los miembros privados. En este ejemplo, todos los miembros son públicas por lo que sus dos construcciones son equivalentes. Sin embargo, si desea proporcionar a los miembros privados que necesita para ocultarlos del ámbito de aplicación llama a través de un cierre. Por lo tanto, si usted tiene un miembro privado de este modo:

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

Es probable que obtener algo como esto:

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

La variable saludo estará disponible para cualquier función definida dentro de la función anónima, pero invisible en todas partes.

Respondida el 02/10/2012 a las 15:36
fuente por usuario

votos
2

El cierre se ejecuta la función anónima / auto por lo general se utiliza para encapsular el alcance de modo que sólo el valor devuelto es accesible fuera de ella. (O cualquier cosa que conceden a otros objetos, como ventana)

Respondida el 02/10/2012 a las 15:31
fuente por usuario

votos
1

La función anónima es probablemente allí para prevenir nombre Collition con otras partes del código. Piénsalo de esta manera, dentro de su función anónima, incluso se podría declarar una variable llamada "$" para ser lo que quieras, y al mismo tiempo, a utilizar jQuery en otras partes de su código sin conflicto.

Respondida el 02/10/2012 a las 15:31
fuente por usuario

votos
-4

El cierre es el único medio para llamar a los constructores con parámetros:

var w = new Greeter("hello")

Hay otros métodos, pero nada complicado y con las limitaciones y desventajas.

Respondida el 18/07/2014 a las 09:13
fuente por usuario

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