Передать функцию JavaScript в качестве параметра
как передать функцию в качестве параметра без выполнения функции в" родительской " функции или с помощью eval()
? (Поскольку я читал, что это небезопасно.)
у меня есть это:
addContact(entityId, refreshContactList());
это работает, но проблема в том, что refreshContactList
срабатывает при вызове функции, а не при ее использовании в функции.
Я мог бы обойти его, используя eval()
, но это не лучшая практика, по тому, что я читал. Как я могу передать функцию в качестве параметра в JavaScript?
13 ответов
вам просто нужно удалить скобки:
addContact(entityId, refreshContactList);
Это затем передает функцию, не выполняя ее сначала.
вот пример:
function addContact(id, refreshCallback) {
refreshCallback();
// You can also pass arguments if you need to
// refreshCallback(id);
}
function refreshContactList() {
alert('Hello World');
}
addContact(1, refreshContactList);
Если вы хотите передать функцию, просто ссылаться на него по имени без скобок:
function foo(x) {
alert(x);
}
function bar(func) {
func("Hello World!");
}
//alerts "Hello World!"
bar(foo);
но иногда вы можете захотеть передать функцию с аргументами входит, но не вызывайте его, пока не будет вызван обратный вызов. Для этого при вызове просто оберните его в анонимную функцию, например:
function foo(x) {
alert(x);
}
function bar(func) {
func();
}
//alerts "Hello World!" (from within bar AFTER being passed)
bar(function(){ foo("Hello World!") });
Если вы предпочитаете, вы также можете использовать применить function и имеют третий параметр, который является массивом аргументы, вроде таких:
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:
funct("z", function (x) { return x; });
function funct(a, foo){
foo(a) // this will return a
}
Пример 2:
function foodemo(value){
return 'hello '+value;
}
function funct(a, foo){
alert(foo(a));
}
//call funct
funct('world!',foodemo); //=> 'hello world!'
передать функцию в качестве параметра, просто уберите скобки!
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);
идея заключается в том, что функция очень похожа на переменную. Вместо того чтобы писать!--5-->
function ToBeCalled() { /* something */ }
вы могли бы также написать
var ToBeCalledVariable = function () { /* something */ }
есть незначительные различия между ними, но в любом случае - оба они являются допустимыми способами определения функции. Теперь, если вы определяете функцию и явно назначаете ее переменной, кажется вполне логичным, что вы можете передать ее как параметр для другой функции, и вам не нужны скобки:
anotherFunction(ToBeCalledVariable);
среди программистов JavaScript есть фраза: "Eval-это зло", поэтому постарайтесь избежать этого любой ценой!
в дополнение к ответу Стива Фентона вы также можете передавать функции напрямую.
function addContact(entity, refreshFn) {
refreshFn();
}
function callAddContact() {
addContact("entity", function() { DoThis(); });
}
вы также можете использовать eval()
сделать то же самое.
//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");
вот именно. Я также искал это решение и пробовал решения, представленные в других ответах, но, наконец, получил его работу из приведенного выше примера.
Я отрезал все мои волосы с этим вопросом. Я не мог заставить примеры выше работать, поэтому я закончил так:
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("alert('test')");
и это работает как шарм ... по крайней мере, для того, что мне было нужно. Надеюсь, это поможет.
вот еще один подход:
function a(first,second)
{
return (second)(first);
}
a('Hello',function(e){alert(e+ ' world!');}); //=> Hello world
на самом деле, кажется, немного сложно, нет.
метод GET в качестве параметра:
function JS_method(_callBack) {
_callBack("called");
}
Вы можете дать в качестве метода параметр:
JS_method(function (d) {
//Finally this will work.
alert(d)
});
другие ответы отлично описывают то, что происходит, но один важный "gotcha" - убедиться, что все, что вы проходите, действительно является ссылкой на функцию.
например, если вы проходите через строку вместо функции, вы получите ошибку:
function function1(my_function_parameter){
my_function_parameter();
}
function function2(){
alert('Hello world');
}
function1(function2); //This will work
function1("function2"); //This breaks!
посмотреть JsFiddle
некоторое время , когда вам нужно иметь дело с обработчиком событий, поэтому нужно передать событие тоже в качестве аргумента, большая часть современной библиотеки, такой как react, angular, может понадобиться.
мне нужно переопределить функцию OnSubmit (функция из сторонней библиотеки) с некоторой пользовательской проверкой на reactjs, и я передал функцию и событие, как показано ниже
изначально
<button className="img-submit" type="button" onClick=
{onSubmit}>Upload Image</button>
СДЕЛАЛ НОВУЮ ФУНКЦИЮ upload
и назвал передают onSubmit
и событие доводы
<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.
проверьте следующее:
var myJSON =
{
"myFunc1" : function (){
alert("a");
},
"myFunc2" : function (functionParameter){
functionParameter();
}
}
function main(){
myJSON.myFunc2(myJSON.myFunc1);
}
это будет печатать 'a'.
следующее имеет такой же эффект с вышеуказанным:
var myFunc1 = function (){
alert('a');
}
var myFunc2 = function (functionParameter){
functionParameter();
}
function main(){
myFunc2(myFunc1);
}
который также имеет такой же эффект со следующим:
function myFunc1(){
alert('a');
}
function myFunc2 (functionParameter){
functionParameter();
}
function main(){
myFunc2(myFunc1);
}
и объектная парадигма, использующая класс в качестве прототипа объекта:
function Class(){
this.myFunc1 = function(msg){
alert(msg);
}
this.myFunc2 = function(callBackParameter){
callBackParameter('message');
}
}
function main(){
var myClass = new Class();
myClass.myFunc2(myClass.myFunc1);
}