KnockoutJS自定义绑定范围问题

Question

I have a custom binding that overrides knockout's click handler like so:

var originalInit = ko.bindingHandlers.click.init,
    originalUpdate = ko.bindingHandlers.click.update;

ko.bindingHandlers.click = {
    init: function(element, valueAccessor, allBindingsAccessor, viewModel, context) {

        var wrappedValueAccessor = function() {
            return function(data, event) {
                var disabled = allBindingsAccessor.get('disabled');
                var clickResult = valueAccessor().call(viewModel, data, event);

                if (clickResult && typeof clickResult.always === "function") {
                    $(element).attr('disabled','disabled');
                    clickResult.always(function(){
                        $(element).removeAttr('disabled');
                    });
                }

            };

        };

        originalInit(element, wrappedValueAccessor, allBindingsAccessor, viewModel, context);
    },
    update: originalUpdate
};

Find the fiddle here: http://jsfiddle.net/92q5vgfp/

The problem is when I try to access allBindingsAccessor inside the click from the chrome debugger, it's not available.

However, if i have a console.log(allBindingsAccessor), chrome's debugger can see it.

Update So, while I was writing this, we tried a random thing, which was to assign the function to a variable before returning it. That worked. Don't know why or how.

var wrappedValueAccessor = function() {
            var test = function(data, event) {
                ...
            };
            return test;
};

So that's my question, WHY would assigning the function to a local var and returning it work but not directly returning it? Is this a bug in chrome or expected (somehow)?

Answer 1

In the linked snippet allBindingsAccessor is not accessed inside the inner function so v8 simply optimizes it out and don't add to the function closure. See crbug.com/172386 for more details.