javascript - 首先声明变量函数的目的是什么？ （两次声明变量）

Question

以下是我遇到的代码：

    var c = function() {},
        c = {
            autoSelectFirst: !1,
            appendTo: "body",
            serviceUrl: null,
            lookup: null,
            .. etc..
            lookupFilter: function(a, b, c) {
                return -1 !== a.value.toLowerCase().indexOf(c)
            },
            .. etc..
        };

为什么c首先声明为空函数然后重新声明为对象？不仅仅会覆盖函数声明吗？我想这是一个基本的JS构造。

Answer 1

我在网上找到了有问题的文件，事实证明这是一个很好的理由。

首先，应该注意的是，问题中的代码来自缩进的缩小源。

这是代码的一大块：

var c=function(){},c={autoSelectFirst:!1,appendTo:"body",serviceUrl:null,lookup:null,
onSelect:null,width:"auto",minChars:1,maxHeight:300,deferRequestBy:0,params:{},
formatResult:g.formatResult,delimiter:null,zIndex:9999,type:"GET",noCache:!1,
onSearchStart:c,onSearchComplete:c,onSearchError:c,
// -----------^------------------^---------------^

所以这是问题中的代码，但更多一点。需要注意的重要一点是变量c用于创建对象文字，onSearchStart:c,onSearchComplete:c,onSearchError:c,。

那么在对象中分配的值是c？由于对象仍处于创建过程中，这意味着c仍然引用该函数，因此像onSearchStart这样的属性（似乎是事件处理程序）将空函数作为默认值。 / p>

这更有意义。

为了验证，我还找到了原始的，未经证实的来源。以下是相关代码：

//   v---originally it's called `noop`
var noop = function () { },
    that = this,
    defaults = {
        autoSelectFirst: false,
        appendTo: 'body',
        serviceUrl: null,
        lookup: null,
        onSelect: null,
        width: 'auto',
        minChars: 1,
        maxHeight: 300,
        deferRequestBy: 0,
        params: {},
        formatResult: YithAutocomplete.formatResult,
        delimiter: null,
        zIndex: 9999,
        type: 'GET',
        noCache: false,
        onSearchStart: noop,    // <---here it's being used
        onSearchComplete: noop, // <---here it's being used
        onSearchError: noop,    // <---here it's being used

现在更清楚了noop，它通常代表无操作，有自己的名字，确实用在它下面创建的对象中。此外，这是仅地点noop在整个文件中使用。

显然，minifier足够聪明，可以看到最初调用noop的变量不再被使用，因此可以自由地为该对象重用该变量名。令人印象深刻的代码分析，IMO。

Answer 2

基于原始问题的代码示例：

var c = function() {},
    c = {
        autoSelectFirst: !1,
        appendTo: "body",
        serviceUrl: null,
        lookup: null,
        .. etc..
        lookupFilter: function(a, b, c) {
            return -1 !== a.value.toLowerCase().indexOf(c)
        },
        .. etc..
    };

问题中包含的代码中的c = function() {},部分没有任何意义。这就像在做：

var x = 1, x = 3;

为变量分配一个值，然后立即为其赋值，没有意义。

您显示的代码将产生完全相同的结果（混淆较少）：

    var c = {
        autoSelectFirst: !1,
        appendTo: "body",
        serviceUrl: null,
        lookup: null,
        .. etc..
        lookupFilter: function(a, b, c) {
            return -1 !== a.value.toLowerCase().indexOf(c)
        },
        .. etc..
    };

基于对此代码所在位置的注释，它似乎是某些自动代码生成或最小化过程的一部分。

仅供参考，Javascript不使用短语“associative array”。第二个声明是Javascript对象。