passing multiple callback in a function - javascript

funcOne(cb) {
//some async actions
cb(resp) //pass resp to callback function
}
fucntionTwo(resp) { console.log(resp) }
fucntionThree(resp) { console.log(resp) }
funcOne(funcTwo)
funcOne(funcThree)
function one will run twice with above case, how can I make funcOne run once but trigger funcTwo and funcThree? I need to pass the resp from funcOne and execute funcTwo and funcThree Means passing multiple callback in funcOne.
I know I can pass multiple args but is there any other way to do that?

You could use the rest parameter syntax and then use a forEach and apply the functions. Something like
function funcOne(...cb) {
console.log("one");
cb.forEach(s => s.apply());
}
function funcTwo() {
console.log("two");
}
function funcThree() {
console.log("three");
}
funcOne(funcTwo, funcThree);
and you can call funcOne with any number of function parameters.

Simply pass multiple arguments as callback functions
function funcOne(cb1, cb2) {
cb1();
cb2();
}
if number of callbacks are going to be dynamic then iterate arguments
function funcOne() {
Array.from( arguments ).forEach( s => typeof s == "function" && s() );
}
and invoke it as
funcOne( function(){ console.log(1) }, function(){ console.log(2) }, function(){ console.log(3) } )

You can pass the two callback into your functionOne:
funcOne(cb1, cb2) {
cb1();
cb2();
}
funcOne(funcTwo, funcThree);

It's so easy:
function One(arg) {
Two(arg);
Three(arg);
}

Pass two functions as arguments
funcOne(a, b) {
a(); b();
}
funcOne(funcTwo, funcThree)
If the scope of the functions is the way you have mentioned then you do not need to even pass them as arguments. Just directly call them.
function funcOne() {
//some async actions
var resp = "Some response";
fucntionTwo(resp);
fucntionTwo(resp);
}
funcOne();
function fucntionTwo(resp) { console.log(resp) }
function fucntionThree(resp) { console.log(resp) }

You can make use of arguments keyword.
Demo Example
function test()
{ for(var i=0; i< arguments.length; i++)
arguments[i]();
}
test(fun1 , fun2)

You can follow this code, I hope your problem will be solved
function funcOne(fucntionTwo, fucntionThree) {
fucntionTwo(resp)
fucntionThree(resp)
}
funcOne(function (resp) {
console.log(resp)
}, function (resp) {
console.log(resp)
})

Related

How to reuse conditional check for each function?

I have many functions example like this
function update() {
if (isAdminUser()) {
return false;
}
...
}
function get() {
if (isAdminUser()) {
return false;
}
...
}
...
is there any possible way to have the conditional statement
if (isAdminUser()) {
return false;
})
written once and run by itself at the beginning of each function. I'm using javascript
You could use a higher order function to encapsulate the logic needed to run before a specific function is run. Higher order functions take functions as parameters, therefore a possible solution to your problem could look like this:
function withIsAdminUser(callback) {
return function() {
if (isAdminUser()) {
return false;
}
return callback();
}
}
function getRaw() {
// Do something here, this whole function could also be inlined
}
const get = withIsAdminUser(getRaw);
If you use TypeScript try decorators.
Docs: https://www.typescriptlang.org/docs/handbook/decorators.html#decorators
maybe you can define a function that can accept another function as an argument and returns false if that function (i.e isAdminUser in your code snippet) returns true
const checkUser = func => func() && false
then the function can be used like:
function update() {
if (checkUser(isAdminUser)) {
// update() logic will only run if user is not admin
}
}
function get() {
if (checkUser(isAdminUser)) {
// get() logic will only run if user is not admin
}
}

execute all functions beginning or contain "xx" in function name

I have a js file with many functions
function one(){
//do stuff
}
function two(){
//do stuff
}
function execute_top_one(){
//do stuff
}
function execute_top_two(){
//do stuff
}
and I need to create a function that executes, for example, all functions that start with (or contain) "execute_top" in the function name, instead of having to call all the functions manually like this
execute_top_one();
execute_top_two();
Any suggestion?
I would suggest that you do it in a little other way:
const functionStore = {
one: function() {
console.log('one')
},
two: function() {
console.log('two')
},
execute_top_one: function() {
console.log('execute_top_one')
},
execute_top_two: function() {
console.log('execute_top_two')
},
}
const execute_these = "execute_top"
const executeFunctions = (functionStore, filterString) => {
Object.entries(functionStore).forEach(([fnName, fn]) => {
if (fnName.indexOf(filterString) !== -1) {
fn()
}
})
}
executeFunctions(functionStore, execute_these)
The difference is that you gather your functions into one object (I called it functionStore, and then create the filtering string & function. As you see from the snippet, filtering an object's keys and values (called fnName & fn in my snippet) is quite easy - and inside the filtering you can call the functions stored.

$.when().done() is not working

I am facing the some issue with $.when().done() functions with jQuery. Can anyone help please? When I have ajax calls and non-ajax call methods, non-ajax call is calling even I use $.when().done(). See below snippet. Method/function three is running before.
$(document).ready(function () {
Initial();
});
function Initial() {
debugger;
var emp = { Name: "Ram", Age: 10 };
Main(emp);
}
function Main(em) {
$.when(One(em)).done(Two(em)).done(Three(em.Name));
}
function One(et) {
//some ajax call
console.log("One");
}
function Two(et) {
//some ajax call
console.log("Two");
}
function Three(et) {
console.log(et);//not an ajax call
console.log("Three");
}
Edit:
Below is the code snippet after the modifications by Vohuman, which is working like a charm
$(document).ready(function () {
Initial();
});
function Initial() {
debugger;
var emp = { Name: "Ram", Age: 10 };
Main(emp);
}
function Main(em) {
var def1 = $.Deferred();
var def2 = $.Deferred();
One(em, def1);
Two(em, def2);
$.when(def1, def2).done(function () {
Three(em.Name)
});
}
function One(et, defObj) {
//some ajax call
if (defObj) {
defObj.resolve();
}
console.log("One");
}
function Two(et, defObj) {
//some ajax call
if (defObj) {
defObj.resolve();
}
console.log("Two");
}
function Three(et) {
console.log(et);//not an ajax call
console.log("Three");
}
The () is called Invocation Operator. It invokes a function. This means you are calling the function yourself and the returned value of the function is set as the callback and not the function itself.
$.when(One(em)).done(Two).done(Three);
And if you want to have the callback called with parameters you should use a middleware, i.e. another function.
function Main(em) {
$.when(One(em)).done(function() {
Two(em);
}).done(function() {
Three(em.Name);
});
}
Also note that if you want send several ajax requests and have a callback executed when all of them are complete, you can pass several deferred objects to $.when:
$.when(deferredOne, deferredTwo).then(function(resolvedValueOne, resolvedValueTwo) {
});
And as a suggestion, do not use PascalCase names for regular functions. By convention, in JavaScript PascalCase names are used for naming constructors and classes.
another way of doing same is
$.when(One(em), Two(em)).done(function( a1, a2 ) {
Three(em.Name)
});
but One and Two method must return promise object.

Make a function that can perform multiple callback with one parameter

I'm working on a big project and I simplified what it matters here. This is the code:
a = new Thing(/*sayHi + sayHey*/);
function sayHi() {
alert("hi");
}
function sayHey() {
alert("hey");
}
function Thing (callback) {
callback();
}
I'd like to, with just the callback parameter, call both the sayHi() and the sayHey() function, at the order I put them. Is it possible? How would I do it? Thank you.
Pass an anonymous function that calls both of them sequentially:
a = new Thing(function() {
sayHi();
sayHey();
});
function sayHi() {
alert("hi");
}
function sayHey() {
alert("hey");
}
function Thing (callback) {
callback();
}
Alternatively to #Barnar's answer, create and pass a regular named function. If the callback logic gets heavier, you might want that anyway.
function hiHeyCallback() {
sayHi();
sayHey();
}
a = new Thing(hiHeyCallback);

Javascript callback function and parameters [duplicate]

This question already has answers here:
Pass an extra argument to a callback function
(5 answers)
Closed 6 years ago.
I want to something similar to this:
function AjaxService()
{
this.Remove = function (id, call_back)
{
myWebService.Remove(id, CallBack)
}
function CallBack(res) {
call_back(res);
}
}
so my calling program will be like this:
var xx = new AjaxService();
xx.Remove(1,success);
function success(res)
{
}
Also if I want to add more parameters to success function how will I achieve it.
Say if I have success function like this:
var xx = new AjaxService();
//how to call back success function with these parameters
//xx.Remove(1,success(22,33));
function success(res,val1, val2)
{
}
Help will be appreciated.
Use a closure and a function factory:
function generateSuccess (var1,var2) {
return function (res) {
// use res, var1 and var2 in here
}
}
xx.Remove(1,generateSuccess(val1,val2));
What you're passing here is not the generateSuccess function but the anonymous function returned by generateSuccess that looks like the callback expected by Remove. val1 and val2 are passed into generateSuccess and captured by a closure in the returned anonymous function.
To be more clear, this is what's happening:
function generateSuccess (var1,var2) {
return function (res) {
// use res, var1 and var2 in here
}
}
var success = generateSuccess(val1,val2);
xx.Remove(1,success);
Or if you prefer to do it inline:
xx.Remove(1,(function(var1,var2) {
return function (res) {
// this is your success function
}
})(val1,val2));
not as readable but saves you from naming the factory function. If you're not doing this in a loop then Xinus's solution would also be fine and simpler than my inline version. But be aware that in a loop you need the double closure mechanism to disconnect the variable passed into the callback function from the variable in the current scope.
You can pass it as anonymous function pointer
xx.Remove(1,function(){
//function call will go here
success(res,val1, val2);
});
one way to do this:
function AjaxService {
var args_to_cb = [];
this.Remove = function (id, call_back, args_to_callback_as_array) {
if( args_to_callback_as_array!=undefined )
args_to_cb = args_to_callback_as_array;
else
args_to_cb = [];
myWebService.Remove(id, CallBack)
}
function CallBack(res) {
setTimeout( function(){ call_back(res, args_to_cb); }, 0 );
}
}
So you can use it like this:
var service = new AjaxService();
service.Remove(1,success, [22,33]);
function success(res,val1, val2)
{
alert("result = "+res);
alert("values are "+val1+" and "+val2);
}
I usually have the callback execute using a setTimeout. This way, your callback will execute when it gets the time to do so. Your code will continue to execute meanwhile, e.g:
var service = new AjaxService();
service.remove(1, function(){ alert('done'); }); // alert#1
alert('called service.remove'); // alert#2
Your callback will execute after alert#2.
Of course, in case of your application, it will happen so automatically since the ajax callback itself is asynchronous. So in your application, you had better not do this.
Cheers!
jrh

Categories