javascript - 在 JavaScript 中调用带括号和不带括号的函数的区别

Question

我正在处理一个 JavaScript 文件上传事件。我有以下初始化程序和以下函数:

初始化器

    $('#s3-uploader').S3Uploader({
        allow_multiple_files: false,
        before_add: progressBar.show,
        progress_bar_target: $('.upload-progress-bar'),
        remove_completed_progress_bar: false
    }).bind("s3_upload_complete", function(e, content) {
        console.log(content);
    });

功能

var progressBar = {
    show: function() {
        $('.upload-progress-bar').show();
        return true;
    }
}

在初始化程序中，我注意到如果我这样做会有所不同
before_add: progressBar.show诉 before_add: progressBar.show() .加上括号，即使绑定(bind)到 before_add 也会被调用一次。选项，没有括号就不会。

我观察到的行为有解释吗？

Answer 1

带括号的方法是因为括号而被调用，并且该调用的结果将存储在 before_add 中。

如果没有括号，您将存储对变量中函数的引用(或“指针”，如果您愿意的话)。这样，每当有人调用 before_add() 时都会调用它。

如果这不能解决问题，也许这会有所帮助:

function Foo() {
    return 'Cool!';
}

function Bar(arg) {
    console.log(arg);
}

// Store the >>result of the invocation of the Foo function<< into X
var x = Foo();
console.log(x);

// Store >>a reference to the Bar function<< in y
var y = Bar;
// Invoke the referenced method
y('Woah!');

// Also, show what y is:
console.log(y);

// Now, try Bar **with** parentheses:
var z = Bar('Whut?');

// By now, 'Whut?' as already been output to the console; the below line will
// return undefined because the invocation of Bar() didn't return anything.
console.log(z);

如果您随后查看浏览器的控制台窗口，您应该会看到:

Cool!
Woah!
function Bar(arg)
Whut?
undefined

第 1 行是调用 Foo() 的结果,
第 2 行是调用 Bar() 的结果 “通过” y ,
第 3 行是 y 的“内容” ,
第 4 行是 var z = Bar('Whut?'); 的结果线;条形函数是 调用 ,
第 5 行显示调用 Bar()并将结果分配给 z没有返回任何东西(因此:未定义)。