Parsing multiple objects in a Javascript function

Question

I have a function below to loadScript, aka loading css and js files into html document header and body while detecting and avoiding duplicates. Initially, I use _.type as a switch condition but for that I have to define type: "js", when calling:

loadScript({
        type: "js",
        path: KERNEL +"/client/js/",
        ref: ["script1.js"]
    });

var loadScript = function(_){
    console.log(_.ref);
    var type = _.ref[0].slice(_.ref[0].lastIndexOf('.')+1);
    console.log(type);
    switch (type) {
        case 'js':
            _.ref.forEach(function(file){
                var scripts = document.getElementsByTagName("script");
                for(var i = 0; i < scripts.length; i++){
                    var src = scripts[i].getAttribute('src');
                    if(src)
                    if(src.indexOf(file) > -1){
                        return;
                    }
                }
                var link = document.createElement('script');
                link.src = _.path + file;
                link.type = 'text/javascript'; link.async = true; // async = false if you need scripts loaded in sequence!
                document.getElementsByTagName('body')[0].appendChild(link);
            });
            break;
        case 'css':
            _.ref.forEach(function(file){
                for(var i = 0; i < document.styleSheets.length; i++){
                    if(document.styleSheets[i].href.indexOf(file) > -1){
                        return;
                    }
                }
                var head  = document.getElementsByTagName('head')[0];
                var link  = document.createElement('link');
                link.rel  = 'stylesheet';
                link.type = 'text/css';
                link.href = _.path + file;
                head.appendChild(link);
            });
            break;

        default:
            // code
    }
};

So I set it to type instead of _.type in the switch to get rid of having to parse an additional parameter, BUT I can't do the following call:

loadScript({
            path: KERNEL+"/client/js/",
            ref: ["script1.js"]
        }, {
            path: PLUGIN_URL +"/js/",
            ref: ["process1.js", "process2.js", "ui.js"]
        },{
            path: UTILS_BOWER_URL+"/client/css/",
            ref: ["front2.css", "default.css"]
});

I don't want to have to do each (3x times):

loadScript({
            path: KERNEL+"/client/js/",
            ref: ["script1.js"]
        }); 

loadScript({
            path: PLUGIN_URL +"/js/",
            ref: ["process1.js", "process2.js", "ui.js"]
        });

References:

Sarantis Tofas · Accepted Answer · 2016-05-16 22:46:55Z

1

You can make use of arguments for example:

function loadScript() {
  var length = arguments.length;
  for (i = 0; i < length; i++) {
    //do something
    console.log(arguments[i])}
}

You can read more here

answered May 16, 2016 at 22:46

Sarantis Tofas

5,1871 gold badge26 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

10 Comments

Pristine Kallio Over a year ago

OK, thanks. I backed down to my initial method of using loadScript() with slight chance below and it works: code var _ = arguments[i]; console.log(); var type = _.ref[0].slice(.ref[0].lastIndexOf('.')+1); console.log(type); code

Pristine Kallio Over a year ago

Also within the scope of my question, how to get case 'js' to work with either string or array of strings, so we can get rid of [] in defining, like: ref: "script1.js" but when passing ref: ["process1.js", "process2.js", "ui.js"], everything still works fine. ???

Sarantis Tofas Over a year ago

hmm you can use the typeof method and convert the string into an array

Sarantis Tofas Over a year ago

if (typeof ref === 'string') { ref = [ref]; }

Pristine Kallio Over a year ago

Actually, I tried without converting anything. The .forEach seems enough to interpret whether I'm passing a string or an array. So, it always works correctly regardless of what I'm passing there. Tested on Chrome, haven't tried with other browsers. What's your opinion?

|

Pristine Kallio · Accepted Answer · 2016-05-16 22:47:49Z

I resolved by writing an extra method to do an upfront check to see whether the passing parameter is Array or Object.

var multipleScript = function(_){
    if (_ instanceof Array) {
        _.map(function(o){
            console.log(o);
            loadScript(o);
        })
    } else if ( _ instanceof Object)
        loadScript(_);
};

Now I can call, works fine, tested! But the downside of my solution is that, it has to be An Array [] inside! to apply same method to a set of objects.

multipleScript([{
            path: KERNEL+"/client/js/",
            ref: ["script1.js"]
        }, {
            path: PLUGIN_URL +"/js/",
            ref: ["process1.js", "process2.js", "ui.js"]
        },{
            path: UTILS_BOWER_URL+"/client/css/",
            ref: ["front2.css", "default.css"]
}]);

Collectives™ on Stack Overflow

Parsing multiple objects in a Javascript function

2 Answers 2

10 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

10 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related