Question

我试图用一堆变量来防止污染全球空间，而且由于我还不能使用let，我必须做出闭包。所以我有一个带有自举手风琴的基本网页，每张卡都隐藏了不同的例子。在一个我有一个表格，问<select>你的立场是什么。 OnChange它将获取eventData对象，调用spillObject（）（闭包方法），并用其内容填充另一个手风琴卡。有效，但问题是，我似乎无法使其成为一个简单的闭包。似乎没有什么事情发生，因为你无法调试一个闭包，除了让它在任何地方吐出console.logs（）之外，我无法找出它的错误。

以下是代码：

$(function() {

    $("#position").change( /*(*/ function(eventData) {
        var div = $('#explodedObject');
        div.html('');
        var result = spillObject('#explodedObject', eventData, '');
        /*};*/
        div.append(result);

    } /*)()*/ );


    var spillObject = (function(dataParent, obj, heirarchy) {
        var heirArr = heirarchy == '' ? [] : heirarchy.split('_');
        heirArr.push(1);
        var teir = heirArr.length - 1;

        var id = "#collapse" + heirArr.join('');
        var headerID = 'header' + heirArr.join('');



        var card = document.createElement('div');
        card.classList.add('card');


        var cardHeader = document.createElement('div');
        cardHeader.classList.add('card-header');
        cardHeader.id = headerID;
        var h5 = document.createElement('h5');
        h5.classList.add('mb-0');
        var button = document.createElement('button');
        button.classList.add('btn', 'btn-link');
        button.setAttribute('data-toggle', 'collapse');
        button.setAttribute('data-target', id);


        var cardBody = document.createElement('div');
        cardBody.classList.add('card-body');
        var collapse = document.createElement('div');

        collapse.id = id.substr(1, id.length - 1);
        collapse.classList.add('collapse');
        collapse.setAttribute('data-parent', dataParent);


        var dl = document.createElement('dl');
        dl.id = '#' + heirArr.join('');
        var dt;
        var dd;
        var x;
        return function() {

        for (x in obj) {
                dt = document.createElement('dt');
                dd = document.createElement('dd');

                dt.innerHTML = x;
                if (typeof obj[x] == 'object' && heirArr.length < 3) {
                    heirArr[teir]++;

                    innerObj = spillObject(dl.id, obj[x], heirArr.join('_'));
                    dd.appendChild(innerObj);
                } else {
                    dd.innerHTML = obj[x];
                }

                dl.append(dt);
                dl.append(dd);
            }

            heirArr.pop();
            heirArr[heirArr.length - 1] = parseInt(heirArr[heirArr.length - 1]);
            heirArr[heirArr.length - 1]--;

            collapse.appendChild(cardBody);

            button.innerHTML = 'card ' + heirArr.join('.');
            h5.appendChild(button);
            cardHeader.appendChild(h5);
            card.appendChild(cardHeader);
            card.appendChild(collapse);
            cardBody.appendChild(dl);
            return card;
        };
    });

})();

更基本的是，我关注此模板：

var method = (function(param){
    var var1 = 'default value';

    return function(){
        var1 = 'something else';
    };
})();

我是否应该使用这个，如果是这样，它会隐藏变量吗？

var method2 = function(param) {
        return function() {
            var var1 = 'default value';
        };
    };

Answer 1

因为spillObject的结果是一个函数，你必须调用该函数。这是您正在做的简化版本。

＆＃13;

var spillObject = (function(dataParent, obj, heirarchy) {
  
  console.log('first function')
  
  return function() {
    console.log('second function')
  };
  
});

var result = spillObject()

console.log(result)

result()

＆＃13;

我的关闭不会起作用

1 个答案: