javascript - 为什么 window.addEventListener 不起作用？

Question

在 window.onload 事件中，我想调用一个函数。如果我将其定义如下，则不会调用该函数。

try {
    window.addEventListener("load", initialiseTable, false);
} catch(e) {
    window.onload = initialiseTable;
}

var initialiseTable = function () {
    console.log("hello world!!");
};

但是如果我将函数声明更改为

function initialiseTable() {
    console.log("hello world!!");};

它有效，有什么想法吗？

Answer 1

当您使用var x = function(){}声明函数时，应该在调用函数之前声明它。

By function x (){},x将存在于当前范围内，无论它如何声明。因为有这样的副作用，所以var x = function(){}比较推荐。例如：

var user = 'alien';
if( user == 'alien') {
    function salute () { console.log("Welcome to Earth!"); }
} else {
    function salute (){ console.log("Good day!"); }
}

salute()无论如何都会打印Good day!，即使它根本不是我们想要的。

Answer 2

之前声明函数。

var initialiseTable = function () {
    console.log("hello world!!");
};
try {
    window.addEventListener("load", initialiseTable, false);
} catch(e) {
    window.onload = initialiseTable;
}

有关声明函数的更多信息，请阅读： var functionName = function() {} vs function functionName() {}

Answer 3

只需将函数initialiseTable放在第一个位置，例如：

var initialiseTable = function (){ /*[...]*/ }

继续调用后。

Answer 4

因为你来自 C#，所以区别很像：

class A {
    public int method2() {
        //I can call method1 even though it *declared* later below
        int a = method1(); 
    }

    public int method1() {

    }
}

对比

class B {
    public int method2() {
        bool a = method1(3); //I can't call it because it is *assigned* later below.
                         //In fact I cannot even compile it 
        Func<int, bool> method1 = x => x == 3;
    }
}

如果您查看以下内容，您可能会注意到 javascript 的不同之处：

function a() {

}

任何地方都没有任务。

显然有var a = function(){}赋值，它类似于后一个 C# 示例。

Answer 5

函数声明应始终在其调用之前。

在这一行：-

window.addEventListener("load", initialiseTable, false);

initialiseTable 是未知的，所以它应该放在函数定义之后。实际上，函数语句会导致其标识符在其代码块*中的任何内容被执行之前被绑定。函数声明在任何代码执行之前加载。它不同于以正常自上而下顺序计算的函数表达式。仅当解释器到达该行代码时才加载函数表达式。所以如果你使用： -

var initialiseTable = function () {
    console.log("hello world!!");
};

它不起作用，但这有效：-

function initialiseTable() {
    console.log("hello world!!");};