使用 jQuery 和 Math.random() 选择嵌套对象属性

Posted

技术标签:

【中文标题】使用 jQuery 和 Math.random() 选择嵌套对象属性【英文标题】:Using jQuery and Math.random() to select nested objects properties 【发布时间】:2018-01-16 18:25:41 【问题描述】:

我正在创建一个随机引用机器,它将显示来自不同哲学家的随机引用。

我有一个带有嵌套对象的对象文字,其中包含哲学家及其引用。使用 jQuery 函数和 Math.random(),如何从我的对象文字结构中选择随机引用?有没有更好的方法来组织数据?

我从一个 jQuery 闭包开始,它将显示一个我想使用 Math.random() 修改的指定引号。

我是初学者,正在寻找解决方案的解释。提前致谢。

示例对象字面量:

var quotes = 

  awatts: 
    name: "Alan Watts",
    quote: "The only way to make          sense out of change is to            plunge into it, move with it,        and join the dance."
  ,
  etolle: 
    name: "Eckhart Tolle",
    quote: "Realize deeply that the       present moment is all you ever       have."
  ,
  tmckenna: 
    name: "Terrence Mckenna",
    quote: "“The cost of sanity in        this society, is a certain          level of alienation” "
  
;

选择单引号的 jQuery 函数示例:

    $(document).ready(function() 
        $('.mybutton').click(function() 
            $('#quote').html(quotes.awatts.quote);
        );
    );

【问题讨论】:

【参考方案1】:

数据的结构看起来不错。你可以使用数组,但对象不是问题。

您将从对象中获取密钥,然后选择一个随机密钥

var quotes = 
  awatts: 
    name: "Alan Watts",
    quote: "The only way to make          sense out of change is to            plunge into it, move with it,        and join the dance."
  ,
  etolle: 
    name: "Eckhart Tolle",
    quote: "Realize deeply that the       present moment is all you ever       have."
  ,
  tmckenna: 
    name: "Terrence Mckenna",
    quote: "“The cost of sanity in        this society, is a certain          level of alienation” "
  
;

$('.mybutton').click(function() 
  var keys = Object.keys(quotes);
  var rand = keys[Math.floor(Math.random() * keys.length)];
  $('#quote').html(quotes[rand].quote);
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="mybutton">Quote</button>
<br><br>
<div id="quote"></div>

【讨论】:

感谢 adeneo。这个解决方案对我很有用!非常感谢您的及时回复。【参考方案2】:

如果您可以将您的 quotes 对象设为数组,则以下方法可以解决问题。改变你的数组

var quotes = [
  
    name: "Alan Watts",
    quote: "The only way to make          sense out of change is to            plunge into it, move with it,        and join the dance."
  ,
  
    name: "Eckhart Tolle",
    quote: "Realize deeply that the       present moment is all you ever       have."
  ,
  
    name: "Terrence Mckenna",
    quote: "“The cost of sanity in        this society, is a certain          level of alienation” "
  
];

设置最大值和最小值(设置随机数的上下限)

var max = quotes.length, min = 0;

生成一个随机数

var rand = Math.random() * (max - min) + min;

在点击事件中使用随机数来选择你的随机报价

$('#quote').html(quotes[rand]quote);

我没有测试过代码。希望这会让你继续前进:-)

【讨论】:

以上是关于使用 jQuery 和 Math.random() 选择嵌套对象属性的主要内容,如果未能解决你的问题,请参考以下文章

有人可以向我解释一起使用的 Math.random() 和宽度/高度吗?

Math.random()和UUID.randomUUID().toString()性能对比纯原

Math.random() 帮助获取 '+N' 和 '-N' 随机数(不包括特定范围)

Math.random()问题

JS:数组的 Math.random

Math.random()问题