Cannot call one javascript file in other

Hi,

I wrote a javascript file for Queue and then one for CircularQueue , when i was trying to use the functions already declared in Queue by using new , i could not get to call the Queue file, how can i use it in my new file …[I am currently using “this” and “new” but will soon quit using them if i can]… Thanks

My File Queue.js

function Queue() {
    "use strict";

    var items = [];

    this.enqueue = function (elements) {
        items.push(elements);
    };

    this.dequeue = function () {
        return items.shift();
    };

    this.isEmpty = function () {
        return items.length === 0;
    };

    this.size = function () {
        return items.length;
    };

    this.clear = function () {
        items = [];
    };

    this.print = function () {
        console.log(items.toString());
    };
}

My Other file where i want to use Queue.js , its called Circular.js


function hotPotato(nameList, num) {
    "use strict";
    var queue = new Queue();
    for(var i = 0; i < nameList.length; i++) {
        queue.enqueue(nameList[i]);
    }
    
    var eliminated = "";
    while (queue.size() > 1) {
        for(var j = 0; j < num; i += 1) {
            queue.enqueue(queue.dequeue());
        }
        eliminated = queue.dequeue();
        console.log(eliminated + ": has been removed");
    }
    
    return queue.dequeue();
    
}

Are you running your code on a browser? Because if that’s the case you can put two <script> elements on an HTML page (the <script> for Queue.js should go before that for Circular.js).

@kevcomedia - Thanks, i tried adding like this

   <script src="QueueTest.js">
<script src="Circular.js">

but its not working …kindly guide

You seem to have forgotten to call the hotPotato function in the second file.

Hi,
I do call but its saying cannot find Queue

var names = ['John','Jack','Camila','Ingrid','Carl'];
var winner = hotPotato(names, 7);
console.log('The winner is: ' + winner);

Can I see all your files?

Yes here is all i have in my html file from where i call circular -

I mean can we not call 2 files or import them in JS


<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
   
<script src="Circular.js">
</script>
</body>
</html>

And the Queue.js and Circular.js are same as above with circular containing the call in the end like here .


function hotPotato(nameList, num) {
    "use strict";
    var queue = new Queue();
    for(var i = 0; i < nameList.length; i++) {
        queue.enqueue(nameList[i]);
    }
    
    var eliminated = "";
    while (queue.size() > 1) {
        for(var j = 0; j < num; j += 1) {
            queue.enqueue(queue.dequeue());
        }
        eliminated = queue.dequeue();
        console.log(eliminated + ": has been removed");
    }
    
    return queue.dequeue();
    
}

var names = ['John','Jack','Camila','Ingrid','Carl'];
var winner = hotPotato(names, 7);
console.log('The winner is: ' + winner);

You don’t seem to have included the Queue.js file in the HTML, so there should be an error message in the console saying that Queue is undefined.

On top of each of your JS files, try adding a console.log line that prints the file name, so you can see in the console if the file is indeed loaded.

1 Like

I think your problem is this:

var eliminated = "";
while (queue.size() > 1) {
    for(var j = 0; j < num; i += 1) {
        queue.enqueue(queue.dequeue());
    }
    eliminated = queue.dequeue();
    console.log(eliminated + ": has been removed");
}

Somewhere in there is an infinite loop.

Okay, I see it.

for(var j = 0; j < num; i += 1) {
    queue.enqueue(queue.dequeue());
}

You’re using i instead of j to end that for loop

Yes, thats true. Also he either forget to close the script tag or just include one of the wanted files in his code.

@jx2bandito - Thanks but when i am trying to run the circular file the error is not being able to find Queue, have you been able to access Queue.js from Circular.js ? If so kindly let me know how

@jx2bandito - Thanks for pointing that out but even when i correct it i get this error -

Circular.js:3 Uncaught ReferenceError: Queue is not defined
    at hotPotato (Circular.js:3)
    at Circular.js:22

Can you please tell me how can i over come this by importing Queue.js in Circular.js, i cannot seem to do this

Your includes should be like this in the BODY

<script src="Circular.js"></script>
<script src="Queue.js"></script>
<script>
var names = ['John','Jack','Camila','Ingrid','Carl'];
var winner = hotPotato(names, 7);
console.log('The winner is: ' + winner);
</script>
1 Like

@ID3301 - Thanks, but my JS files are separate here … can i call


var names = ['John','Jack','Camila','Ingrid','Carl'];
var winner = hotPotato(names, 7);
console.log('The winner is: ' + winner);

Inside the html

Yes, I was able to without any problem. Whenever you use script src="" you’re basically just pasting the entire file into your HTML.


<script src="Circular.js"></script>
<script src="QueueTest.js"></script>

If that still doesn’t work try


<script src="Circular.js"></script>
<script defer src="QueueTest.js"></script>

Also maybe check your file names. You’re src’ing to QueueTest.js but you’re also mentioning a Queue.js

1 Like

@jx2bandito - Thanks it worked …

@amitshrivastavafcc of course you can, the interpreter will parse your entire code from all files. You just have to watch out that you don’t include them in the wrong order. This can cause ‘hoisting’.

Also use your developer tools to check if all your files are found.

1 Like