0

这是来自 js fiddle 的链接

那里有一些像这样的js代码：

function makeSizer(size) {
  return function() {
    document.body.style.fontSize = size + 'px';
  };
}

var size12 = makeSizer(12);
var size14 = makeSizer(14);
var size16 = makeSizer(16);

document.getElementById('size-12').onclick = size12;
document.getElementById('size-14').onclick = size14;
document.getElementById('size-16').onclick = size16;  document.getElementById('size-16').onclick = size16;

我有两个问题第一个：使用这个额外的变量有什么好处

var size12 = makeSizer(12);
var size14 = makeSizer(14);
var size16 = makeSizer(16);

当你可以写

document.getElementById('size-12').onclick = makeSizer(12)

第二个是：为什么当我们这样编写函数时：

function makeSizer(size) {  document.body.style.fontSize = size + 'px';  }

一切都停止工作。我知道这是重复的，并且有一些关于关闭的帖子，但它们没有帮助

4

2 回答 2

3

第一个问题：

在此示例中它不会给您带来任何好处，但是如果您想将这些函数用作其他 onclick 处理程序，这样可以节省一些资源，并且代码更易于维护。

第二个问题：

这是因为首先 makeSize 函数返回函数，然后绑定到单击处理程序 - 每次单击时都会调用此返回的函数。您更改的函数不会返回任何内容（未定义更具体），因此 nothink 绑定到 onclick 事件。

于 2013-10-11T11:30:08.997 回答
0

该onclick属性需要一个在事件发生时执行的函数。

该函数将接收鼠标事件作为参数。但是，在您的情况下，该函数需要知道字体应设置的大小。

这是通过动态创建函数并使用闭包来捕获大小来解决的。

于 2013-10-11T11:33:01.417 回答