Почему встроить класс JavaScript в анонимной функции () вызов?

Question

Почему встроить класс JavaScript в анонимной функции () вызов?

голоса

17

Я читал о новом JavaScript-подобном языке от Microsoft под названием машинопись . В детской площадке (например , раздел) , есть простой класс в синтаксисе машинописи преобразуется в код JavaScript. Исходя из фона программирования Java, это было интересно для меня , чтобы узнать , как ООП делаются в JavaScript составленные из машинописи.

Код Машинопись:

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)

И эквивалентный код JavaScript:

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

Машинопись часть очень похожа на Java , так что я понимаю , что. Теперь мой вопрос , почему в JavaScript тело Greeterкласса встроено в анонимном function()звонке?

Почему бы не написать это?

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

Что такое преимущество / недостаток каждого метода?

javascript typescript

Задан 02/10/2012 в 15:27
источник пользователем AlexStack

На других языках...

6 ответов

голоса

3

Помимо очевидного обзорное / закрытия рассуждений. Используя анонимную функцию, которая вызывает сама сразу предзагрузок (интерпретирует) определение класса. Это позволяет любой JIT оптимизации, которые будут загружены в передней исполнения. Короче говоря, для более крупных более сложных приложений, это улучшит производительность.

Ответил 02/10/2012 в 15:44
источник пользователем Louis Ricci

голоса

2

Это позволит для частных пользователей. В этом примере, все члены являются открытыми, так что ваши две конструкции эквивалентны. Тем не менее, если вы хотите, чтобы обеспечить для частных членов вам нужно, чтобы скрыть их от вызывающей рамки через закрытие. Таким образом, если у вас есть частный член, как так:

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

Вы, вероятно, получить что-то вроде этого:

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

Переменная приветствие будет доступна для любой функции, определенной внутри анонимной функции, но невидимое везде.

Ответил 02/10/2012 в 15:36
источник пользователем Mark Porter

голоса

2

Анонимная функция / само выполнение закрытия, как правило, используется для инкапсуляции рамки так, что только возвращаемое значение доступно за его пределами. (Или что-нибудь прикрепить к другим объектам, как окна)

Ответил 02/10/2012 в 15:31
источник пользователем Jordan Denison

голоса

1

Анонимная функция, вероятно, есть, чтобы предотвратить имя collition с другими частями кода. Подумайте об этом таким образом, внутри анонимной функции, можно даже объявить переменную «$», чтобы быть все, что вы хотите, и в то же время быть с помощью JQuery на другие части вашего кода без конфликтов.

Ответил 02/10/2012 в 15:31
источник пользователем Deleteman

голоса

-4

Закрытие является единственным средним для вызова конструкторов с параметрами:

var w = new Greeter("hello")

Существуют и другие методы, но все сложно и с ограничениями и недостатками.

Ответил 18/07/2014 в 09:13
источник пользователем Thinol

xandercoded · Accepted Answer · 2012-10-02 15:30

Называется следующая Сразу Вызывается функция Expression :

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

Он используется , чтобы сохранить глобальный охват чистой. Хотя, в данном случае это не является необходимым , так как возвращаемое значение присваивается переменной Greeter. Единственный раз , когда эта модель полезна , когда вы хотите «частные» статические члены.

Например:

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