具有两个函数的 JavaScript 闭包作用域

Question

我正在努力解决 JavaScrit 函数中的闭包范围问题。下面的函数应该创建三个具有不同图像的样本(可以工作)，然后当单击这些样本时，应该切换样式表。

问题在于，尽管单步执行显示第一个函数中的 theme 变量确实发生了变化，但相同的对象仍被传递给 switchTheme 函数。

var switcherConfig = {
    themes: 
        {
            'Orangeness': {
                folder: 'ui-lightness'
            },
            'Red Matter': {
                folder: 'blitzer'
            },
            'Flubber': {
                folder: 'south-street'
            }
        }
}
function createThemeSwitcher(placeholderSelector) {
    for (var themeName in switcherConfig.themes) {
        var theme = switcherConfig.themes[themeName];
        var anchor = $('<a/>')
            //.text(theme.title)
            .attr('title', theme.title)
            .attr('href', '#')
            .on('click', function () { switchTheme(theme); })
            // append to DOM etc
    }
}
function switchTheme(theme) {
    var themeDirectory = switcherConfig.baseDirectory + '/' + theme.folder + '/';
    // 'theme' variable is always the last in my 'themes' config object
}

Answer 1

switchTheme(theme) 使用的值将是调用该函数时 theme 所处的状态，该值在您创建该函数时并未绑定(bind)匿名回调。使用闭包来绑定(bind)该特定值:

.on('click', (function (t) {
    return function () { switchTheme(t); };
})(theme))