Was ist der Unterschied zwischen der direkten Zuweisung einer Funktion zu einer Variablen und der Referenzierung einer Funktion?

Question

Was ist der Unterschied zwischen der direkten Zuweisung einer Funktion zu einer Variablen und der Referenzierung einer Funktion?

Zum Beispiel: Fragment 1 und Fragment 2

Clip 1

function fn(){
  var box = document.getElementById("box");
  box.onclick = function(){
      console.log(111);
  };
  box = null;
}

Clip 2

function fn(){
  var box = document.getElementById("box");
  box.onclick = click;
}

function click(){
  console.log(111);
}

Die Funktion in onclick in Fragment 1 ermöglicht den Zugriff auf Variablen in fn, aber die onclick-Funktion in Fragment 2 erlaubt keinen Zugriff auf Variablen in fn. Das ist meine Meinung, da click in Fragment 2 außerhalb von fn definiert ist Auf fn kann nicht zugegriffen werden, was bedeutet, dass die Zuweisung zu onclick in Fragment 2 tatsächlich eine Referenz und keine Kopie ist?

Answer 1

不不不, 你又不是调用方法, 传递参数, 所以这两个例子的核心不是什么引用/拷贝的问题

这是作用域(原型链)的问题

变量在不同的作用域有不同的访问权限:
子作用域能访问父作用域
父作用域不能访问子作用域
同级作用域无法互相访问

Answer 2

猜测你可能需要深入学习下变量作用域的相关知识，js的作用域是在定义的时候就已经确定了。

片段1中

function fn(){
  var box = document.getElementById("box");
  box.onclick = function(){
      console.log(111);
  };
  box = null;
}

box绑定的onclick回调，是在fn的函数内部，因此其内部所有局部变量都能被该回调访问到。

片段2中

function fn(){
  var box = document.getElementById("box");
  box.onclick = click;
}

function click(){
  console.log(111);
}

click方法在fn函数外部，与之同级，由于定义时，click尚不在fn内部，因此无法访问其内部作用域。