其他函数内的函数声明 [英] Function declaration inside other function

问题描述

我的问题的最佳解释将是一个例子，看下面这个

简单的函数：


函数SetEventHandler（元素）

{

//元素上的一些操作

element.onclick =

函数（事件）

{

//制作东西

}


}


一切正常，但我不确定一件事 - 每次调用函数时，是否会在内存中创建

onclick事件处理程序

SetEventHandler或浏览器将只创建一个实例并使用它每个元素
？我当然可以将该事件处理程序作为全局

函数并仅指定对onclick事件的引用，但我只是想知道这两者之间是否有任何差异方法。


感谢您的帮助

解决方案

Larax写道：
< blockquote class =post_quotes>
我的问题的最佳解释将是一个例子，看看下面

这个简单的函数：


函数SetEventHandler （元素）

{

//元素上的一些操作


功能（活动）

{

//制作东西

}


}


一切正常，但我不确定一件事 - 每次调用函数时，是否会在内存中创建

onclick事件处理程序

SetEventHandler，

很有可能。 Javascript被允许加入函数对象

如果它可以知道这样做会没有区别（因为内部函数没有使用任何一个函数，这将是

） />
正式参数或包含它的函数的局部变量。）

在实践中，网页浏览器javascript引擎似乎永远不会这样做

而是始终使用函数表达式的每个

评估创建一个新的唯一函数对象。

确定加入的开销可能是多少？连续的函数对象将是

安全太棒了。

或浏览器只创建一个实例并使用它
$每个元素b $ b？

这将允许在这里，但没有证据表明任何浏览器

这样做。

我当然可以将该事件处理程序作为全局

函数并仅指定对onclick事件的引用，但我只是

想知道如果这两种方法之间存在任何差异。

内部函数的赋值形成一个闭包。如果没有

形成闭包的原因，可能会出现的问题（IE的内存

泄漏问题）和多个函数对象的创建使

使用内部函数不合需要。请参阅： -


< URL： http://jibbering.com/faq/faq_notes/closures.html >


Richard。

Larax写道：

函数SetEventHandler（element）{

element.onclick = function（event）{

//制作东西

}

}

一切正常，但我不确定一件事 - 每次调用函数时都会在内存中创建

onclick事件处理程序

SetEventHandler

是。


但之前的功能将被垃圾收集，因为它还没有参考

。


小心 - 上面的例子在IE中创建了一个内存泄漏。


为什么？因为元素具有对函数的引用，并且函数

（通过其作用域链）具有对元素的引用。 IE无法检测到此循环

引用，它会导致内存泄漏。阅读

它并使用Drip工具检测这样的内存泄漏。


如果创建一个全局函数并仅将其分配给onclick，

内存泄漏不会发生。


-

Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com

感谢您的解释，我本来可以遇到严重的问题
带有IE内存泄漏的
因为我分配了很多事件处理程序

那样。


Larax

Best explanation of my question will be an example, look below at this
simple function:

function SetEventHandler(element)
{
// some operations on element

element.onclick =
function(event)
{
// make something
}

}

Everything works fine, but I''m not sure about one thing - will the
onclick event handler be created in memory every time I call function
SetEventHandler, or browser will create only one instance and use it
for every element ? I can of course make that event handler as global
function and assign only reference to onclick event, but I''m just
wondering if there is any diffrence between these two methods.

Thanks for help

解决方案

Larax wrote:

Best explanation of my question will be an example, look below
at this simple function:

function SetEventHandler(element)
{
// some operations on element

element.onclick =
function(event)
{
// make something
}

}

Everything works fine, but I''m not sure about one thing - will the
onclick event handler be created in memory every time I call function
SetEventHandler,

That is very likely. Javascript is allowed to "join" function objects
if it can know that doing so will make no difference (which would be
the case here as the inner function does not make use of any of the
formal parameters or local variables of the function that contains it).
In practice web browser javascript engines don''t seem to ever do this
and instead always create a new and unique function object with each
evaluation of a function expression. Probably the overheads in
determining that "joining" the successive function objects would be
safe too great).

or browser will create only one instance and use it
for every element ?

That would be allowed to here, but there is no evidence of any browsers
doing so.

I can of course make that event handler as global
function and assign only reference to onclick event, but I''m just
wondering if there is any diffrence between these two methods.

The assigning of the inner function forms a closure. If there is no
reason for forming a closure, the issues that may follow (IE''s memory
leak issue) and the creation of the multiple function objects make
using the inner function undesirable. See:-

<URL: http://jibbering.com/faq/faq_notes/closures.html >

Richard.

Larax wrote:

function SetEventHandler(element) {
element.onclick = function(event) {
// make something
}
}
Everything works fine, but I''m not sure about one thing - will the
onclick event handler be created in memory every time I call function
SetEventHandler

Yes.

But the previous function will be garbage collected since no reference still
exists to it.

Be careful - the example above creates a memory leak in IE.

Why? Because the element has a reference to the function, and the function
(through its scope chain) has a reference to the element. This circular
reference cannot be detected by IE and it causes a memory leak. Read up on
it and use the Drip tool to detect memory leaks like this.

If you create a global function and merely assign it to the onclick, the
memory leak will not occur.

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com

Thanks for your explanations, I could have ran into serious problems
with the IE memory leak as I''m assigning quite a lot of event handlers
that way.

Larax

这篇关于其他函数内的函数声明的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！