How to access an array stored in a different js file

Question

I'm trying to create my own lorem ipsum app and I want to keep my code clean by storing my word bank in other files. How can I access an array stored in a different JS file? For example, instead of hardcoding harry = ["", "", ""], I want to store that data in a different file and just call that file into the array.

// generator.js
function GenerateNewText(){
this.sentences = [
    harry = [
        "I am the chosen one!",
        "Boy wizard",
        "Quidditch seeker"
    ron = [
       "I am a Weasley",
       "Gryffindor",
       "Quidditch keeper"
    ]
  ]
}

GenerateNewText.prototype.getRandomSentence = function() {
   let randomSentence = this.sentences[0][Math.floor(Math.random() * this.sentences.length)]
   return randomSentence;
}

Currently, I have a harryText.js which contains

// harryText.js
harryText = [
  "I am the chosen one",
  "I am a Gryffindor",
  "I am a boy"
]

module.exports = harryText;

but doing this in my generator.js shows harryText is not defined

function GenerateNewText(){
this.sentences = [
    harryText,  <---- error here
    ron = [
       "I am a Weasley",
       "Gryffindor",
       "Quidditch keeper"
    ]
  ]
}

I tried requiring it like so const harryText = require("./harryText.js") and the problem persists. I'm guessing a scope issue?

I tried installing ejs and changing harryText.ejs and including it like <%= include harryText %> in the generator array and that's invalid code.

Is calling an array from another file and storing it within another array even possible? Does anyone know a solution to this?

And yes, I know a Harry Potter Ipsum already exists. This is just dummy text.

It looks like you never declared the harryText variable in harryText.js. You just started using it without saying const or let first. — Justin Reusnow
– Justin Reusnow, Commented Feb 20, 2019 at 22:23
Even after including either const or let in the harryText.js it still says ReferenceError: harryText is not defined — TJS13
– TJS13, Commented Feb 20, 2019 at 22:49

powerc9000 · Accepted Answer · 2019-02-20 22:29:09Z

1

Javascript files are isolated from each other. To share common code you always need require and module.exports

So you are doing the right thing with module.exports = harryText

You then need to require that file in generator.js

const harryText = require("./harryText");
function GenerateNewText(){
this.sentences = [
    harryText,
    ron = [
       "I am a Weasley",
       "Gryffindor",
       "Quidditch keeper"
    ]
  ]
}

answered Feb 20, 2019 at 22:29

powerc9000

2,11220 silver badges32 bronze badges

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

2 Comments

TJS13 Over a year ago

Hi there, I did require it in the generator.js but it still shows that harryText is not defined.

TJS13 Over a year ago

Nevermind, I get what you mean now. I had a const loremIpsum = new GenerateNewText() that I didn't include in my OP and so when I saw your answer I mistakenly included const harryText = require("./harryText") as so like your example but under my const loremIpsum, instead of above it. So unwittingly I created a scoping issue. Anyway, your answer helps. Thanks for that.

kanhai shah · Accepted Answer · 2019-02-20 22:35:27Z

1

If you are using ES6 you can do following.

//file1.js
  export const harryText = [
     "I am the chosen one",
     "I am a Gryffindor",
     "I am a boy"
  ]

//file2.js
  import {harryText} from './file1.js';
  // use variable here

answered Feb 20, 2019 at 22:35

kanhai shah

1,34312 silver badges14 bronze badges

1 Comment

kanhai shah Over a year ago

If you run this code directly in browser it won't work. You need babel to transpile it. If you environment set up doesn't support es6, this won't work.

TJS13 · Accepted Answer · 2019-02-21 00:45:24Z

0

UPDATE 2/20/19 16:15 I was getting the harryText is not defined error because I kept foolishly defining the variable in the wrong place! First I defined it outside of the function GenerateNewText, then I tried defining it inside the this.sentence. Instead, I should have been defining it inside the function GenerateNewText and outside this.sentence, like so

function GenerateNewText(){
  const harryText = require("./harryText");
  const ronText = require("./ronText");
  this.sentences = [
    harryText,
    ronText
  ]
}

answered Feb 21, 2019 at 0:45

TJS13

561 silver badge10 bronze badges

Collectives™ on Stack Overflow

How to access an array stored in a different js file

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related