Modifying number of arguments for callback functions - javascript -


i know many of used javascript ui widget plugins, etc... offers callback functions. instance have object x , has function, let .dothisafteranevent(). , according official documentation of object x, function accepts single parameter of type function() 1 argument, let _args.

to visualize, here example:

var handler = function(_args) {     // something. }  var x = $("#element-to-widget-ify").transform() x.dothisafteranevent(handler) 

my question is, how can modify method .dothisafteranevent() accept function with 2 or more parameters instead of one? in case, need pass second value handler function.


edit:

var widgets = {     "widget-at-the-nav": $("#nav-widget").transform(),     "widget-at-the-footer": $("#nav-footer").transform(),     "widget-at-the-search": $("#nav-search").transform(),     length: 3 }  var handler = function(_args, _option) {     console.log("key in: " + _option     // other processes... }  for(key in widgets) {     console.log("key outer: " + key)     widget[key].dothisafteranevent(function(json) {         console.log("key out: " + key)         handler(json, key)     }) } 

this attempt. prints this:

key outer: widget-at-the-nav key outer: widget-at-the-footer key outer: widget-at-the-search key out: widget-at-the-nav key in: widget-at-the-nav key out: widget-at-the-nav key in: widget-at-the-nav key out: widget-at-the-nav key in: widget-at-the-nav 

and forgot tell guys function .dothisafteranevent() (not handler() function) has ajax call inside.

this question mess, i'm going touch on recent edit, , code contains.

your approach masking handler anonymous function pretty correct, it's loop messing lexical scope. ajax bit important detail, because ajax calls going operate long after you've looped, means callback functions reference same final value of key.

you need create new scope key 'locked in', references correct.

function con () {}    con.prototype.dothisafteranevent = function (fn) {    // fake ajax programming    window.settimeout(function () {      fn.call(this);    }, 1500);      };    $.fn.transform = function () {    return new con();  };    var widgets = {    "widget-at-the-nav": $("#nav-widget").transform(),    "widget-at-the-footer": $("#nav-footer").transform(),    "widget-at-the-search": $("#nav-search").transform()  };    var handler = function(_args, _option) {    console.log("key in: " + _option);    // other processes...  };    (var key in widgets) {    console.log("key outer: " + key);    (function (key) {      // use iife establish new lexical scope      widgets[key].dothisafteranevent(function(json) {        console.log("key out: " + key);        handler(json, key);      });    }(key));  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

in es6, we'd use let.


Comments

Popular posts from this blog

Android : Making Listview full screen -

javascript - Parse JSON from the body of the POST -

javascript - How to Hide Date Menu from Datepicker in yii2 -