Question

更新

问题解决了！我意识到这是因为'吊装'。基本上，JavaScript解释器解析代码并在函数开头声明所有变量（但不初始化它们）。这就是为什么第二个例子不起作用的原因。因为JavaScript解释器在函数的开头声明var changed;，但是不会初始化它，直到它到达代码的主体。

对于像第一个例子那样的函数声明，而不是像第二个例子那样向上移动变量名称，它向上移动（或“升起”）向上移动整个函数在父函数的开头，这就是它工作的原因！

无论如何，我写这篇文章仅供个人参考，感谢答案......

这个有效： http://jsbin.com/emarat/7/edit

$(function(){
  $name = $('#test');
  $name.change(changedName);

  function changedName (e){
      console.log('e: ', e); 
      console.log('e.currentTarget: ', e.currentTarget); 
      console.log('$(e.currentTarget).val(): ', $(e.currentTarget).val());
      $('#test-display').text($(e.currentTarget).val());
    }
});

，但这不是： http://jsbin.com/emarat/9/edit

$(function(){
  $name = $('#test');
  $name.change(changed);

  var changed = function(e){
      console.log('e: ', e); 
      console.log('e.currentTarget: ', e.currentTarget); 
      console.log('$(e.currentTarget).val(): ', $(e.currentTarget).val());
      $('#test-display').text($(e.currentTarget).val());
    };
});

为什么吗

Answer 1

后者相当于：

$(function(){
  var changed;
  $name = $('#test');
  $name.change(changed);

  changed = function(e){
      //...
    };
});

这使得它无法正常工作变得明显。在使用时，changed变量尚未初始化（undefined）。

但是如果使用function yourFunctionName()语法声明一个函数，它在整个范围中都可用。（在JavaScript中，它是父函数。）否则，在声明之前不可能使用函数。它被称为吊装。

另见：

var functionName = function() {} vs function functionName() {}

Surprised that global variable has undefined value in JavaScript

Answer 2

因为变量在之后定义<。>

var a = 1;
var c = a + b;
var b = 2;

您不希望该代码运行。

Answer 3

第一个定义范围中的函数。第二个创建内联函数并在局部变量changed中存储对它的引用。问题是你在使用它后填充变量。

这样可行：

$(function(){
  var changed = function(e){
      console.log('e: ', e); 
      console.log('e.currentTarget: ', e.currentTarget); 
      console.log('$(e.currentTarget).val(): ', $(e.currentTarget).val());
      $('#test-display').text($(e.currentTarget).val());
  };

  $name = $('#test');
  $name.change(changed);
});

http://jsbin.com/emarat/11/edit

编写函数的不同方法会在JavaScript中产生不良影响？

3 个答案:

另见：