2

I have a function with lots of variables and very big arrays being defined; this makes the function very large and hard to work with. How can I define the variables/arrays in another file and use them in this function?

Example:

DoStuff.js:

function genList(){
    var listData = [

    //lots of inner arrays and data

    ]

    var dataItem = "value";//50 of these

    //do stuff with the data
}

What I'm trying to do:

ExternalData.js:

var listData = [

//lots of inner arrays and data

]

var dataItem = "value";//50 of these

DoStuff.js:

function genList(){

//call variables/arrays from ExternalData.js

//do stuff
}

Note: JQuery is applicable here, but I'd rather not call any other libraries for something so small.

Improve this question
14
  • 1
    Many options: browserify.org, requirejs.org, github.com/jrburke/almond and more Commented Dec 6, 2013 at 3:55
  • Is there anything that's a simple native javascript method of doing it? I'd hate to call on a library just to pass some data from page to page or from function to function. Commented Dec 6, 2013 at 3:56
  • 1
    you can directly access the Variable in ExternalData.js just by including the script and calling out them as objects so whats your exact problem. Commented Dec 6, 2013 at 4:05
  • 1
    Create a unique global object (namespace) window.MY = {} and shared code there, that's how you'd do it without libraries. Commented Dec 6, 2013 at 4:08
  • 1
    You can declare a "namespace" by creating window.jtodd = {} and then build your data onto that. Commented Dec 6, 2013 at 4:08

1 Answer 1

Reset to default
1

I would define all the variables in an object for example:

var obj = {
   array_one: ['x', 'y'],
   some_value: 'z'
}

This method has the advantage of make a kind of namespace for all the variables, saving you from overriding values.

And then use that object into my code using some kind of include method.

One simple method could be to add the script before the one you are writing like this:

<script type="text/javascript" scr="file_with_object.js"></script>

Other more sophisticated but only advisable if you are going to repeat this kind of behavior is to use a Library or a framework to make includes more concise, require.js is a good example

EDIT: In the previous example I used the object with var considering that the code was written on the global scope, I think it would be better to use window.obj = {} to ensure the variable is global. And, just for the record, any variable you define like this window.somevariable is going to be a global variable. Once you define a global variable you could use it anywhere in your code (after the definition takes place). The namespace is the right way to go though.

EDIT 2: I think this post is more about scope than includes. When you declare a variable this way: var some_variable; you are saying that you want to bind that variable to the current scope. So if you do that inside a function, that variable "lives" inside that function:

var some_var = 10;
function(){
   var some_var = 5;
   console.log(some_var) // 5
}

console.log(some_var) // 10

But if you declare the variable without the var on both cases you are making that varaible global the first time and overriding its value on the second:

    some_var = 10;
    function(){
       some_var = 5;
       console.log(some_var) // 5
    }
    console.log(some_var) // 5

And alway you declare a varaible without the var, that variable is accessible trough window.variablename, because you are not binding the variable to any particular scope, so the binding is made to the window objecy, which is the global scope "namespace".

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

6 Comments

This answers my question. I do have a question here: Can I do this in a way so that everywhere that my variables are used in my function I don't have to change the name that I call them through? Its not a very big problem; I'm just wondering if there's a way to skip that.
This is a great answer though.
Does the EDIT I made answer this other question?
Well, I haven't used global variables before, but I assume I'll need to access them via window.variableName rather than just variableName?
No, that is not the case. You could access those variables without the window. In fact if you don't use the var prefix the variable would be declare as global and would be accessible by both using window.varaiblename or just variablename. That's because window is the object that holds the global scope in the browser context. Using window.varaiblename is just for readability, is more concise. Because if you don't use var when declaring the variable it could be thougth that the variable was already defined.
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.