Ví dụ về thời gian khó hiểu javascript Ví dụ

Question

Tôi hiện đang theo dõi một khóa học javascript và đang gặp sự cố khi hiểu những gì đang xảy ra đằng sau hậu trường trong javascript trong một trong các ví dụ (xem mã bên dưới).

Tôi hiểu hầu hết mã và hiểu tại sao đầu ra được ghi lại là -> [sai, đúng, đúng]. Tuy nhiên có một phần được hạch lái xe tôi (tôi chỉ một mũi tên để nó trong mã ở phía dưới):

nhầm lẫn của tôi xoay quanh tham số 1:

biết cuộc hành trình hiện mất thông số 1 kể từ thời điểm nó được thông qua với checkPastLimitSimplified(1) trong var arr5 = mapForEach(arr1, checkPastLimitSimplified(1));.

Tôi hiểu rằng khi checkPastLimitSimplified(1) được gọi một ngữ cảnh thực thi được tạo cho hàm này trong đó tham số 1 nằm trong môi trường biến.

Nhưng bây giờ điều gì xảy ra? Hàm bên trong hàm checkPastLimitSimplified chưa được thực thi nhưng chỉ được trả về. Nó trông như thế nào khi nó được trả lại? tại các biến số limiter nhận tham số 1 là gì?

Tôi hiểu rằng .bind(this, limiter); tạo bản sao của hàm. Là biến số limiter của nó đã là 1 trước khi nó được trả về?

function mapForEach(arr, fn) { 

    var newArr = []; 
    for (var i = 0; i < arr.length; i++) { 
    newArr.push(
     fn(arr[i]) 
    ) 
    }; 

    return newArr; 
} 

var arr1 = [1, 2, 3]; 

var checkPastLimitSimplified = function(limiter) { // < ----CONFUSED 
    return function(limiter, item) { 
    return item > limiter; 
    }.bind(this, limiter); 
}; 

var arr5 = mapForEach(arr1, checkPastLimitSimplified(1)); 
console.log(arr5); 

Answer 1

Cho phép đổi tên biến để xem quan hệ:

var checkPastLimitSimplified = function(outer_limiter) { 
    return function(limiter, item) { 
    return item > limiter; 
    }.bind(this, outer_limiter); 
}; 

bind đổi chức năng chữ ký để được chỉ function(item) trước khi trở lại.
Khi mã khách hàng sẽ gọi checkPastLimitSimplified(1)(item), giới hạn sẽ thay thế từ ngữ cảnh được liên kết.

Answer 2

một cách khác để làm cho nó dễ hiểu hơn là đưa các chức năng bên trong bên ngoài:

var checkPastLimit = function(limiter, item) { 
    return item > limiter; 
}; 

var checkPastLimitSimplified = function(outer_limiter) { 
    return checkPastLimit.bind(this, outer_limiter); 
}; 

Kết quả sẽ là một bản sao của hàm đầu tiên với tham số đầu tiên (giới hạn) đã được xác định.

Chức năng mới này sẽ chỉ cần tham số thứ hai (mục).

Nhưng không có thực thi mã chức năng (so sánh với giới hạn) trên giai đoạn này.