Basic displaying array values?

Question

Only just started learning JavaScript.

Why won't my button display the values in my "authors" array?

/* JavaScript file */
var authors = ['Ernest Hemingway', 'Charlotte Bronte',
  'Dante Alighieri', 'Emily Dickinson'
];

function ShowAuthors(authors) {
  for (i = 0; i <= authors.length; i++) {
    document.write(authors[i]);
  }
}

<!DOCTYPE html>
<html>

<head>
  <title></title>
  <script src="./js/script.js"></script>
  <link rel="stylesheet" href="./css/style.css" />
</head>

<body>
  <div class="container">
    <input type="button" class="author" value="Show Authors" onClick="ShowAuthors()" />
  </div><br>
</body>

</html>

Sorry for the terrible formatting, I'm new here. I'm probably missing something super basic..

Prerak Sola above is right. One way of solving this would be to NOT have a parameter in your function and just use the global variable. The other way is to leave the function as is but then you will need to pass some value to your function when calling it. — Benjamin Racette
– Benjamin Racette, Commented Jan 11, 2018 at 17:34

user3483203 · Accepted Answer · 2018-01-11 17:35:32Z

1

As someone else already said, you weren't passing in authors, and since you had a parameter named authors it wouldn't use authors defined in your js file.

Also, when you iterate through your loop, you should not do <= to length, as arrays are zero index.

Finally, your code would be formatted more cleanly if you use authors.join(', ') to write instead of looping through the values without adding any additional formatting.

/* JavaScript file */
var authors = ['Ernest Hemingway', 'Charlotte Bronte',
  'Dante Alighieri', 'Emily Dickinson'
];

function ShowAuthors() {
  document.write(authors.join(', '))
}

<!DOCTYPE html>
<html>

<head>
  <title></title>
  <script src="./js/script.js"></script>
  <link rel="stylesheet" href="./css/style.css" />
</head>

<body>
  <div class="container">
    <input type="button" class="author" value="Show Authors" onClick="ShowAuthors()" />
  </div><br>
</body>

</html>

answered Jan 11, 2018 at 17:35

user3483203

51.3k10 gold badges72 silver badges104 bronze badges

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

5 Comments

lvboogart Over a year ago

I didn't feel right about the parameter of authors but wasn't sure if the var was global. I guess I need to do more research on variables. Thank you for the suggestions. I will look into all of the suggestions.

user3483203 Over a year ago

I would recommend looking into scope of variables. It can be unintuitive in some cases. If this answer answered your question then please accept as an accepted answer.

lvboogart Over a year ago

The root of the problem was not only the parameter I had listed, but also the ".length()" should have been ".length". Now working properly, albeit possibly not optimally. Learning has occurred.

user3483203 Over a year ago

Also with length, remember that arrays are 0 indexed, so <= array.length will run one too many times in most cases.

lvboogart Over a year ago

Yes! That was my first edit. I learned that, it just isn't habit yet. Thank you much.

Collectives™ on Stack Overflow

Basic displaying array values?

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related