Looping over Array of objects and returning random object value - JavaScript

Question

I am trying to loop over an array of objects and display a random quote from the data, so far my code returns undefined. Any idea's why?

Code so far..

const quotesToUse = [{
    quote: "This was the biggest quote ever - Array Object",
    author: "Derek Bullshido",
  },
  {
    quote: "Hey hows it going - Array Object",
    author: "Paul Frank",
  },
  {
    quote: "Why can I say that - Array Object",
    author: "Derek Paul",
  },
]

function randomQuotes() {
    for (var i = 0; i < 1; i += 1 )  {
    const randomQuote = quotesToUse[i][Math.floor(Math.random() * quotesToUse[i].quote.length)];
    document.getElementById("container").appendChild(text).append(randomQuote);
}

I am trying to display the quote (String) randomly.

quotesToUse[i].quote.length <-- makes no sense, why are you referencing the length of the string. — epascarello
– epascarello, Commented Jun 2, 2020 at 0:12
for (var i = 0; i < 1; i += 1 ) ? That's the same as var i = 0; — see sharper
– see sharper, Commented Jun 2, 2020 at 0:14
you want to display you mean console.log? not very clear what you are trying to do — Shivaraj
– Shivaraj, Commented Jun 2, 2020 at 0:15

see sharper · Accepted Answer · 2020-06-02 00:17:38Z

6

You probably want this to get the quote:

const randomQuote = quotesToUse[Math.floor(Math.random() * quotesToUse.length)].quote;

I don't know what you're trying to do with the loop.

answered Jun 2, 2020 at 0:17

see sharper

12.2k8 gold badges53 silver badges68 bronze badges

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

2 Comments

Sole Over a year ago

Thats it, I am just experimenting as I am learning, so no loop needed. Thanks that worked.

see sharper Over a year ago

Mark as answer appreciated :)

Doruk Eren Aktaş · Accepted Answer · 2020-06-02 00:19:13Z

You can return random quotes with this function:

const quotesToUse = [{
    quote: "This was the biggest quote ever - Array Object",
    author: "Derek Bullshido",
  },
  {
    quote: "Hey hows it going - Array Object",
    author: "Paul Frank",
  },
  {
    quote: "Why can I say that - Array Object",
    author: "Derek Paul",
  },
]

function randomQuotes() {
    const randomQuote = quotesToUse[Math.floor(Math.random() * quotesToUse.length)];
    const quote = document.createElement("DIV");
    quote.textContent=randomQuote.quote;
    const author = document.createElement("DIV");
    author.textContent=randomQuote.author;  document.getElementById("container").appendChild(quote).appendChild(author);
}

randomQuotes();

<div id="container"></div>

Aaron Plocharczyk · Accepted Answer · 2020-06-02 03:21:58Z

1

You can do this more readably with rando.js. Just don't forget to add the script tag to the head of your HTML document if you want to use this code.

const quotesToUse = [
  {quote: "This was the biggest quote ever - Array Object", author: "Derek Bullshido"},
  {quote: "Hey hows it going - Array Object", author: "Paul Frank"},
  {quote: "Why can I say that - Array Object", author: "Derek Paul"},
];

var randomValueFromArray = rando(quotesToUse).value;
console.log(randomValueFromArray.quote);

<script src="https://randojs.com/1.0.0.js"></script>

answered Jun 2, 2020 at 3:21

Aaron Plocharczyk

2,8602 gold badges11 silver badges17 bronze badges

Collectives™ on Stack Overflow

Looping over Array of objects and returning random object value - JavaScript

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related