Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/413.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/sockets/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript函数数组或函数包装/嵌套是否更适合手动/直接;事件“;订阅费?_Javascript_Performance_Events_Memory_Dom Events - Fatal编程技术网

Javascript函数数组或函数包装/嵌套是否更适合手动/直接;事件“;订阅费?

Javascript函数数组或函数包装/嵌套是否更适合手动/直接;事件“;订阅费?,javascript,performance,events,memory,dom-events,Javascript,Performance,Events,Memory,Dom Events,我经常需要让自己的库通过回调订阅发出事件,在某些情况下,我更喜欢直接使用Javascript函数变量,而不是使用第三方库或DOM来管理事件。我发现了两种策略,我不确定哪一种更合适 这些策略通过这个JSFIDLE演示: 第一种策略是将每个订阅添加到一个函数数组中,这样当我准备调用一个事件时,我就可以遍历该事件中的所有回调 var fnactionidx = 0; var fnarr = []; function add2fnArray() { fnarr.push(fnaction);

我经常需要让自己的库通过回调订阅发出事件,在某些情况下,我更喜欢直接使用Javascript函数变量,而不是使用第三方库或DOM来管理事件。我发现了两种策略,我不确定哪一种更合适

这些策略通过这个JSFIDLE演示:

第一种策略是将每个订阅添加到一个函数数组中,这样当我准备调用一个事件时,我就可以遍历该事件中的所有回调

var fnactionidx = 0;
var fnarr = [];
function add2fnArray() {
    fnarr.push(fnaction);
    console.log("added to array", fnarr.length);
}
function fnaction() {
    console.log("Hi.", ++fnactionidx);
}
function arraygo() {

    // do internal stuff here first

    fnactionidx = 0;
    for (var i=0; i<fnarr.length; i++) {
        fnarr[i]();
    }
    console.log("array complete!")

    // do internal stuff here last
}
本例中的订阅是使用nestfn完成的。注意,我并不真正关心执行的顺序,因为它是显式的;在第一个示例中,我可以使用Array.unshift

我看过第二个推荐的更多。我的怀疑是,虽然第二个更像Javascript,因为它利用了Javascript作为函数语言灵活处理函数的优势,但它可能会引入更多的内存开销,因为在包装函数中有包装函数,等等,取决于有多少订户

你认为哪种方法更可取

请注意,我不想使用基于字符串的事件子系统,我只想区分这两种策略,或者如果有另一种回调策略执行与这两种策略非常类似的操作,而不需要使用字符串键通过某个“全局”事件系统。

根据(第35行)判断在相当流行的先例中,似乎使用数组进行事件订阅

还有一个重要的论据是,基于阵列支持取消订阅此类活动。使用阵列可以做到这一点;使用函数包装实际上是不可能的

另外,函数包装,当你把你的头绕在它周围时,是很奇怪的,它可能更容易编写,但它不容易支持。另一方面,有时您别无选择,例如,另一个模块已经实现了一个事件,您的目标是在应用程序代码中的其他回调对其执行之前执行一些预处理

function fnactionnested() {
   console.log("nested complete!");

    // do internal stuff here last
}

function nestfn(fn) {
    var na = fnactionnested;
    fnactionnested = function() {
        fn();
        na();        
    }
    console.log("nested " + fn.toString());
}
function nestgo() {
    // do internal stuff here first
    fnactionidx = 0;
    fnactionnested();
}