循环遍历对象并获取javascript中的随机项

假设您有一个Javascript对象，该对象具有一些属性，可以随机显示带有背景、文本和标题的页面，您如何在其中循环，使其每次仅显示对象上的一项

const list = {
            b1:{
                author: 'Mozart',
                title: 'lacrimosa',
                text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',
                imageURL: 'url(./assets/img/image.jpg)'
            },
            b2:{
                author: 'Choppin',
                title: 'Waltz in A minor',
                text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',
                imageURL: 'url(./assets/img/image.jpg)'
            },
            b3:{
                author: 'Bach',
                title: 'Ave Maria',
                text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',
                imageURL: 'url(./assets/img/image.jpg)'
            },
        }





return(
            <div className="background" style={{background: 'url(./assets/img/image.jpg)'}}>
                <div className="caption">
                    <blockquote>
                        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
                        <p> artist - <cite>Song</cite></p>
                    </blockquote>
                </div>
            </div>
        )

const list={
b1：{
作者：《莫扎特》，
标题：“流泪”，
文字：“Lorem ipsum dolor sit amet，奉献精英。”，
imageURL:'url（./assets/img/image.jpg）'
},
b2:{
作者：《斩波》，
标题：“A小调华尔兹”，
文字：“Lorem ipsum dolor sit amet，奉献精英。”，
imageURL:'url（./assets/img/image.jpg）'
},
b3：{
作者：《巴赫》，
标题：“圣母玛利亚”，
文字：“Lorem ipsum dolor sit amet，奉献精英。”，
imageURL:'url（./assets/img/image.jpg）'
},
}
返回(
Lorem ipsum dolor sit amet，是一位杰出的献身者

艺术家-宋

)

---

我尝试了Math.random（）方法，但没有成功

您可以像这样从对象中获取随机项

const randomItem = list['b' + Math.floor(Math.random() * 2)]

---

您可以像这样从对象中获取随机项

const randomItem = list['b' + Math.floor(Math.random() * 2)]

---

将对象转换为

数组

，以便可以使用

Math.random（）

或创建键列表，选择一个键并使用它访问对象

转换为

数组

使用密钥列表

---

将对象转换为

数组

，以便可以使用

Math.random（）

或创建键列表，选择一个键并使用它访问对象

转换为

数组

使用密钥列表

我最好建议（为了防止对象命名的可能变化而不是b1、b2等）使用object.keys（）方法：

我最好建议（为了防止对象命名的可能变化而不是b1、b2等）使用object.keys（）方法：

const randomItem=函数（obj）{
变量键=对象键（obj）
返回obj[keys[keys.length*Math.random（）
const randomItem=函数（obj）{
变量键=对象键（obj）
return obj[keys[keys.length*Math.random（）在David的答案中使用Math.random（）是错误的：您可能会得到键[-1]！正确的方法是使用Math.floor（Math.random（）*length）。此外，我会使用Object.keys（）方法，使其尽可能通用，请参见。下面是一个有效的解决方案：


const list={
b1：{
作者：《莫扎特》，
标题：“流泪”，
文字：“Lorem ipsum dolor sit amet，奉献精英。”，
imageURL:'url（./assets/img/image.jpg）'
},
b2:{
作者：《肖邦》，
标题：“A小调华尔兹”，
文字：“Lorem ipsum dolor sit amet，奉献精英。”，
imageURL:'url（./assets/img/image.jpg）'
},
b3：{
作者：《巴赫》，
标题：“圣母玛利亚”，
文字：“Lorem ipsum dolor sit amet，奉献精英。”，
imageURL:'url（./assets/img/image.jpg）'
},
};
常量键=对象键（列表）；
const randomIndex=keys[Math.floor（Math.random（）*keys.length）]；
常量项=列表[随机索引]；
console.log（item.author）；
在David的答案中使用Math.random（）是错误的：您可能会得到键[-1]！正确的方法是使用Math.floor（Math.random（）*length）。此外，我会使用Object.keys（）方法，使其尽可能通用，请参见。下面是一个有效的解决方案：


const list={
b1：{
作者：《莫扎特》，
标题：“流泪”，
文字：“Lorem ipsum dolor sit amet，奉献精英。”，
imageURL:'url（./assets/img/image.jpg）'
},
b2:{
作者：《肖邦》，
标题：“A小调华尔兹”，
文字：“Lorem ipsum dolor sit amet，奉献精英。”，
imageURL:'url（./assets/img/image.jpg）'
},
b3：{
作者：《巴赫》，
标题：“圣母玛利亚”，
文字：“Lorem ipsum dolor sit amet，奉献精英。”，
imageURL:'url（./assets/img/image.jpg）'
},
};
常量键=对象键（列表）；
const randomIndex=keys[Math.floor（Math.random（）*keys.length）]；
常量项=列表[随机索引]；
console.log（item.author）；
您可以用3行简单的代码来完成这项工作

//find the length of your object
const length = Object.keys(list).length

//generate a random number that's between 0 and the length of your object
const random_number = Math.floor((Math.random() * length) + 0);

//get your random item from the object
const random_item = list[Object.keys(list)[random_number]]


console.log(random_item)

键可以是完全动态的（b1、b2、b3可以被命名为任何东西-例如：b1、g4、aaa）
您可以使用3行简单的代码来实现这一点

//find the length of your object
const length = Object.keys(list).length

//generate a random number that's between 0 and the length of your object
const random_number = Math.floor((Math.random() * length) + 0);

//get your random item from the object
const random_item = list[Object.keys(list)[random_number]]


console.log(random_item)

键可以是完全动态的（b1、b2、b3可以用任何名称命名-例如：b1、g4、aaa）
你想从
列表
对象中渲染随机元素吗？看一看，这说明了如何从对象中获取随机值。除了对象之外，你还有其他代码吗，比如使用
数学的函数。随机
？你想从
列表
对象中渲染随机元素吗？看一看，这说明了如何获取r对象的andom值。除了对象之外，你还有其他代码吗，比如使用数学的函数。随机的？你能解释一下这里发生了什么吗？你能解释一下这里发生了什么吗？工作得很好！谢谢你工作得很好！谢谢你
const randomItem = function (obj) {
  var keys = Object.keys(obj)
  return obj[keys[ keys.length * Math.random() << 0]];
};

//find the length of your object
const length = Object.keys(list).length

//generate a random number that's between 0 and the length of your object
const random_number = Math.floor((Math.random() * length) + 0);

//get your random item from the object
const random_item = list[Object.keys(list)[random_number]]


console.log(random_item)