В функциях JavaScript вы можете установить this.function = function?

Question

Я столкнулся с этим плагином jquery, и я вполне понимаю, как это работает:

$.functionone = function(){

    function setOptions(newOptions){
        ...
    }
    this.setOptions = setOptions;
}

Что я не понимаю, что это на самом деле делает?this.setOptions = setOptions Вы можете вызвать функцию без скобок?Какая связь между this.setOptions и setOptions сама по себе?

Answer 1

Функции в JavaScript - это объекты, подобные (почти) всем остальным. Когда вы делаете это:

this.setOptions = setOptions;

вы не вызываете функцию setOptions, вы просто присваиваете ссылку на функцию свойству, точно так же, как присваиваете свойство любому другому объекту, например:

var dt;
dt = new Date();
this.today = dt;

С функциями вы могли бы сделать это, чтобы позже вы могли вызвать функцию через свойство (которое устанавливает значение this в качестве объекта, к которому относится свойство, что удобно). Немного яснее, что происходит, если вы используете другое имя для свойства, чем для функции:

function functionName() { ... }   // Declares the function
this.propertyName = functionName; // Sets the property
functionName();                   // Calls the function (with `this` = the global object ["window", on browsers])
this.propertyName();              // Also calls the function (but with `this` = the object the property's on)

Шаблон, который вы определили, объявляя функцию и затем отдельно устанавливая ссылку на нее на объекте, часто используется, чтобы убедиться, что полученная функция имеет имя . Вы можете создать функцию и связать ее со свойством, подобным этому:

this.setOptions = function() {
    ...
};

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

Вы могли бы подумать, что можете объединить вещи, как это:

this.setOptions = function setOptions() {  // <=== DON'T DO THIS
    ...
};

... но, хотя это в основном работает, оно вызывает ошибку в Internet Explorer / JScript (он создает две разные функции для этого кода, что в лучшем случае является пустой тратой памяти, а в худшем случае очень тонкой и бесполезной тратой времени, как это было в этом вопросе ).

Answer 2

Функция setOptions вызывается только при добавлении круглых скобок: setOptions(). Если вы не добавляете круглые скобки, у вас есть ссылка на функцию. Это как обычная переменная, только она содержит ссылку на функцию вместо некоторого другого значения.

Если вы установите this.setOptions = setOptions, вы создадите функцию setOptions для объекта this, которая указывает на ту же функцию, что и setOptions. То есть, если вы вызываете его с помощью this.setOptions(), будет вызвана ссылочная функция.