Hướng dẫn what is difference between calling function with and without parentheses javascript? - sự khác biệt giữa chức năng gọi có và không có dấu ngoặc đơn javascript là gì?

Tôi đã xử lý một sự kiện tải lên tệp JavaScript. Và tôi có trình khởi tạo sau và chức năng sau:

Khởi tạo

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

Hàm số

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

Trong bộ khởi tạo, tôi nhận thấy có một sự khác biệt nếu tôi làm

before_add: progressBar.show V.S. before_add: progressBar.show(). Với dấu ngoặc đơn, nó sẽ được gọi một lần ngay cả khi nó bị ràng buộc với tùy chọn before_add và không có dấu ngoặc đơn thì không.

Có một lời giải thích cho hành vi tôi quan sát?

Đã hỏi ngày 10 tháng 6 năm 2015 lúc 9:07Jun 10, 2015 at 9:07

Chris Yeungchris YeungChris Yeung

2.5135 huy hiệu vàng31 Huy hiệu bạc56 Huy hiệu đồng5 gold badges31 silver badges56 bronze badges

2

Với dấu ngoặc đơn, phương pháp được gọi vì dấu ngoặc đơn và kết quả của việc gọi đó sẽ được lưu trữ trong trước_ADD.

Không có dấu ngoặc đơn, bạn lưu trữ một tham chiếu (hoặc "con trỏ" nếu bạn muốn) vào hàm trong biến. Bằng cách đó, nó sẽ được gọi bất cứ khi nào ai đó gọi trước_add ().

Nếu điều đó không rõ ràng mọi thứ, có lẽ điều này sẽ giúp:

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

Nếu sau đó bạn hãy xem cửa sổ bảng điều khiển của trình duyệt, bạn sẽ thấy:

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

Dòng 1 là kết quả của việc gọi Foo(), dòng 2 là kết quả của việc gọi

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

0 "thông qua"

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

1, dòng 3 là "nội dung" của

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

1, dòng 4 là kết quả của dòng

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

3; Hàm thanh được gọi, dòng 5 cho thấy việc gọi

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

0 và gán kết quả cho

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

5 không trả lại bất cứ điều gì (do đó: không xác định).
Line 2 is the result of invoking

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

0 "via"

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

1,
Line 3 is the "contents" of

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

1,
Line 4 is the result of the

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

3 line; the Bar function is invoked,
Line 5 shows that invoking

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

0 and assigning the result to

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

5 didn't return anything (thus: undefined).

Đã trả lời ngày 10 tháng 6 năm 2015 lúc 9:10Jun 10, 2015 at 9:10

Các chức năng là hạng nhất trong JavaScript. Điều này có nghĩa là chúng có thể được truyền xung quanh, giống như bất kỳ tham số hoặc giá trị nào khác. Những gì bạn đang thấy là sự khác biệt giữa việc truyền một hàm và truyền hàm giá trị trả về.

Trong ví dụ của bạn:

before_add: progressBar.show

Bạn muốn vượt qua

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

6 thay vì

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

7 vì cái trước đại diện cho hàm (

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

8) trong khi cái sau đại diện cho kết quả trả về (

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

9).

Đây là một ví dụ khác:

// All this function does is call whatever function is passed to it
var callAnotherFunction = function (func) {
    return func()
}
// Returns 3 — that's all
var return3 = function () { return 3 }

// `callAnotherFunction` is passed `return3`
// so `callAnotherFunction` will `return return3()` === `return 3`
// so `3` is printed
document.write(callAnotherFunction(return3))

// `callAnotherFunction(return3())` is the same as `callAnotherFunction(3)`.
// This will print nothing because, in `callAnotherFunction`
// `func` is 3, not a function
// so it cannot be invoked, so nothing is returned
// and `document.write` doesn't print anything.
document.write(callAnotherFunction(return3()))

Đã trả lời ngày 10 tháng 6 năm 2015 lúc 9:10Jun 10, 2015 at 9:10

Các chức năng là hạng nhất trong JavaScript. Điều này có nghĩa là chúng có thể được truyền xung quanh, giống như bất kỳ tham số hoặc giá trị nào khác. Những gì bạn đang thấy là sự khác biệt giữa việc truyền một hàm và truyền hàm giá trị trả về.royhowie

Trong ví dụ của bạn:14 gold badges49 silver badges67 bronze badges

0

Điều gì xảy ra khi bạn gọi một chức năng không có dấu ngoặc đơn?

Bạn có thể gọi một chức năng mà không có dấu ngoặc đơn JavaScript không?

Tại sao dấu ngoặc đơn được sử dụng để bọc một cuộc gọi chức năng JavaScript?

Dấu ngoặc đơn cho chức năng JavaScript là gì?