Pass a JavaScript function as parameter
如果函数没有在"parent"函数中执行或使用
我有这个:
1 | addContact(entityId, refreshContactList()); |
它可以工作,但问题是当调用函数时,而不是在函数中使用它时,
我可以使用
型
你只需要去掉括号:
1 | addContact(entityId, refreshContactList); |
然后在不首先执行函数的情况下传递函数。
下面是一个例子:
1 2 3 4 5 6 7 8 9 10 11 | function addContact(id, refreshCallback) { refreshCallback(); // You can also pass arguments if you need to // refreshCallback(id); } function refreshContactList() { alert('Hello World'); } addContact(1, refreshContactList); |
号
型
如果要传递函数,只需按名称引用它而不带括号:
1 2 3 4 5 6 7 8 9 | function foo(x) { alert(x); } function bar(func) { func("Hello World!"); } //alerts"Hello World!" bar(foo); |
号
但有时您可能希望传递包含参数的函数,但在调用回调之前不要调用它。为此,在调用它时,只需将它包装在一个匿名函数中,如下所示:
1 2 3 4 5 6 7 8 9 | function foo(x) { alert(x); } function bar(func) { func(); } //alerts"Hello World!" (from within bar AFTER being passed) bar(function(){ foo("Hello World!") }); |
号
如果愿意,还可以使用apply函数,并使用第三个参数作为参数数组,如:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | function eat(food1, food2) { alert("I like to eat" + food1 +" and" + food2 ); } function myFunc(callback, args) { //do stuff //... //execute callback when finished callback.apply(this, args); } //alerts"I like to eat pickles and peanut butter" myFunc(eat, ["pickles","peanut butter"]); |
号
型
例1:
1 2 3 4 5 | funct("z", function (x) { return x; }); function funct(a, foo){ foo(a) // this will return a } |
。
例2:
1 2 3 4 5 6 7 8 9 10 | function foodemo(value){ return 'hello '+value; } function funct(a, foo){ alert(foo(a)); } //call funct funct('world!',foodemo); //=> 'hello world!' |
看看这个
型
要传递函数作为参数,只需移除括号!
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | function ToBeCalled(){ alert("I was called"); } function iNeedParameter( paramFunc) { //it is a good idea to check if the parameter is actually not null //and that it is a function if (paramFunc && (typeof paramFunc =="function")) { paramFunc(); } } //this calls iNeedParameter and sends the other function to it iNeedParameter(ToBeCalled); |
其背后的思想是函数与变量非常相似。而不是写作
1 | function ToBeCalled() { /* something */ } |
。
你还是写吧
1 | var ToBeCalledVariable = function () { /* something */ } |
两者之间有一些细微的差别,但无论如何,它们都是定义函数的有效方法。现在,如果您定义了一个函数并显式地将它赋给一个变量,那么您可以将它作为参数传递给另一个函数,而不需要括号:
1 | anotherFunction(ToBeCalledVariable); |
。
型
在javascript程序员中有一句话:"eval是邪恶的",所以要不惜一切代价避免它!
除了Steve Fenton的答案,您还可以直接传递函数。
1 2 3 4 5 6 7 | function addContact(entity, refreshFn) { refreshFn(); } function callAddContact() { addContact("entity", function() { DoThis(); }); } |
。
型
我建议将参数放在一个数组中,然后使用
1 2 3 4 5 6 7 8 9 10 | function addContact(parameters, refreshCallback) { refreshCallback.apply(this, parameters); } function refreshContactList(int, int, string) { alert(int + int); console.log(string); } addContact([1,2,"str"], refreshContactList); //parameters should be putted in an array |
。
型
你也可以用
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | //A function to call function needToBeCalled(p1, p2) { alert(p1+"="+p2); } //A function where needToBeCalled passed as an argument with necessary params //Here params is comma separated string function callAnotherFunction(aFunction, params) { eval(aFunction +"("+params+")"); } //A function Call callAnotherFunction("needToBeCalled","10,20"); |
号
就这样。我也在寻找这个解决方案,并尝试了其他答案中提供的解决方案,但最终从上面的例子中得到了它的工作。
型
我为那个问题把头发都剪掉了。我不能让上面的例子起作用,所以我的结尾是:
1 2 3 4 5 6 | function foo(blabla){ var func = new Function(blabla); func(); } // to call it, I just pass the js function I wanted as a string in the new one... foo(""); |
号
这就像一个魅力…至少是为了我需要的。希望能有帮助。
型
其他的答案很好地描述了正在发生的事情,但是一个重要的"明白"是要确保你传递的内容确实是一个函数的引用。
例如,如果传递字符串而不是函数,则会得到一个错误:
1 2 3 4 5 6 7 8 9 10 11 | function function1(my_function_parameter){ my_function_parameter(); } function function2(){ alert('Hello world'); } function1(function2); //This will work function1("function2"); //This breaks! |
参见J小提琴
型
其实,好像有点复杂,不是。
获取方法作为参数:
1 2 3 4 5 | function JS_method(_callBack) { _callBack("called"); } |
号
您可以给出一个参数方法:
1 2 3 4 | JS_method(function (d) { //Finally this will work. alert(d) }); |
号
型
这是另一种方法:
1 2 3 4 5 6 | function a(first,second) { return (second)(first); } a('Hello',function(e){alert(e+ ' world!');}); //=> Hello world |
号
型
有时,当您需要处理事件处理程序时,也需要将事件作为参数传递,大多数现代库(如react、angular)可能需要这样做。
我需要用一些对reactjs的自定义验证来覆盖onsubmit函数(来自第三方库的函数),我传递了函数和事件,如下所示
原来
1 2 | <button className="img-submit" type="button" onClick= {onSubmit}>Upload Image</button> |
号
生成了一个新的函数
1 2 3 4 5 6 | <button className="img-submit" type="button" onClick={this.upload.bind(this,event,onSubmit)}>Upload Image</button> upload(event,fn){ //custom codes are done here fn(event); } |
型
您还可以使用JSON来存储和发送JS函数。
检查以下内容:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | var myJSON = { "myFunc1" : function (){ alert("a"); }, "myFunc2" : function (functionParameter){ functionParameter(); } } function main(){ myJSON.myFunc2(myJSON.myFunc1); } |
这将打印"A"。
以下内容与上述内容具有同等效力:
1 2 3 4 5 6 7 8 9 10 11 | var myFunc1 = function (){ alert('a'); } var myFunc2 = function (functionParameter){ functionParameter(); } function main(){ myFunc2(myFunc1); } |
。
其效果与以下相同:
1 2 3 4 5 6 7 8 9 10 11 12 | function myFunc1(){ alert('a'); } function myFunc2 (functionParameter){ functionParameter(); } function main(){ myFunc2(myFunc1); } |
号
以及使用类作为对象原型的对象范式:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | function Class(){ this.myFunc1 = function(msg){ alert(msg); } this.myFunc2 = function(callBackParameter){ callBackParameter('message'); } } function main(){ var myClass = new Class(); myClass.myFunc2(myClass.myFunc1); } |
号