Each loop to check if function exists

Question

I am developing a site using a third-party CMS and I have to include functions across various parts of the content depending on which page is being displayed. To reduce the amount of functions being called on each page load, I would like to loop through an array of functions to check if they exist before firing them.

This single function would then be called at body onload.

I have adapted code from Javascript Array of Functions and How to implement an array of functions in Javascript? as well as isFunction.

My understanding was that I could put the functions in an array without () and they would not be called but in my console in Chrome an Uncaught Reference error is generated on the line in the array where a function name is mentioned.

e.g. the jb_underimage_height function is not in the code on all pages, so this generates the error when it does not exist.

Here is the code so far:

function jb_onloads() {

var functionArray = [
jb_category_price_POA, 
jb_highlight_tech_columns,
jb_underimage_height,
jb_moveGuestButton,
jb_loginCheck,
jb_moveRefineSpan, 
jb_style_from_url, 
materials_dropdown,
jb_remove_search_spaces, 
jb_init_social,
checkCookies,
jb_category_change_class, 
jb_move_basket_text,
jb_style_form,
jb_checkNotifyEnvelope
]; // end of functionArray

$.each(functionArray, function(key, value) {

    if(typeof functionArray[key] !== 'undefined' && typeof functionArray[key] === "function") { functionArray[key](); } 
}); 

} // end of jb_onloads

@ArunPJohny That works because all the functions are defined. Did you read the whole question? — JLRishe, Mar 18 '15 at 11:57
You can't put undefined vars in an array: http://jsfiddle.net/c4k5nk6o/ — Will Jenkins, Mar 18 '15 at 12:02

score 1 · Answer 1 · answered Mar 18 '15 at 12:01

And this was my workaround when I had to this.

function a() { alert ("I am a") };
function b() { alert ("I am b") };

var arr = [
    typeof a === "function" && a || 0,
    typeof b === "function" && b || 0,
    typeof c === "function" && c || 0
];

arr.forEach(function(func) {
    if(typeof func === "function") {
         func();
    }
});

danzeer · Answer 2 · 2015-03-18T12:44:53.583

maybe we can do it as:

1 function defining:

if (typeof myFuncCollections == "undefined") // window.myFuncCollections
    myFuncCollections = {};
myFuncCollections.func1 = function func1() {
    console.log("func1");
};
//or
myFuncCollections['funcname'] = function funcname() { 
    console.log("funcname");
}
....

2 jb_onloads()

function jb_onloads() {
    if (typeof myFuncCollections == "undefined") 
        myFuncCollections = {};
    $.each(myFuncCollections, function(i) {     
        myFuncCollections[i]();           
    });
}

3 call jb_onloads() after including 1 and 2. And That do not require inlcuding 1-script before 2-script. Also, your can use any function in 1-script outside jb_onloads after including 1-script.

Since using Global value, please use special prefix for naming your "myFuncCollections"

Gabriele Petrioli · Answer 3 · 2015-03-18T12:05:34.257

You are trying to insert function references to the array. But if the function is not defined then that name does not exists and thus the error.

Add them as strings

function jb_onloads() {

    var functionArray = [
      'jb_category_price_POA',
      'jb_highlight_tech_columns',
      'jb_underimage_height',
      'jb_moveGuestButton',
      'jb_loginCheck',
      'jb_moveRefineSpan',
      'jb_style_from_url',
      'materials_dropdown',
      'jb_remove_search_spaces',
      'jb_init_social',
      'checkCookies',
      'jb_category_change_class',
      'jb_move_basket_text',
      'jb_style_form',
      'jb_checkNotifyEnvelope'
    ]; // end of functionArray

    $.each(functionArray, function(index, functionName) {
      // assuming functions are in the global scope
      var func = window[ functionName ],
          funcType = typeof func;
      if (funcType === "function") {
        func();
      }
    });

  } // end of jb_onloads

Each loop to check if function exists

3 Answers3