Home >Web Front-end >JS Tutorial >JavaScript generates non-repeating random numbers_javascript skills

JavaScript generates non-repeating random numbers_javascript skills

WBOYOriginal: 2016-05-16 15:50:011652browse

Question source: a test question in the process of learning jQuery in MOOC.

初始时:<ul>元素中仅显示5个<li>元素,其中包含还包括最后一个<li>元素,<a>元素中的显示"更多"字符.

当点击"更多"链接时,自身内容变为"简化",同时,<ul>元素中显示全部的<li>元素.

当点击"简化"链接时,自身内容变为"更多",同时,<ul>元素中仅显示包含最后一个<li>元素在内的5个元素.

Core point: He didn’t say which 25edfb22a4f469ecb59f1190150159c6 elements need to be hidden, so I hope to list 8 25edfb22a4f469ecb59f1190150159c6 elements, and click Simplify to randomly hide 3 of the first 7 25edfb22a4f469ecb59f1190150159c6 elements. .

Things:

① Generate 3 random numbers from 0~6.

② Determine whether the three random numbers are equal. If they are not equal, perform the hiding operation.

③3 If the random number is repeated, the function will be re-executed.

Implementation: Generate a random number from 0 to 6

Copy code The code is as follows:

var ran1=parseInt(Math.random()*7); / /Math.random() generates a random number in [0,1)

Complete code:

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script language="javascript" type="text/javascript" src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
    <title>挑战题</title>
  </head>
  
  <body>
    <ul>
      <li>0</li>
      <li>1</li>
      <li>2</li>
      <li>3</li>
      <li>4</li>
      <li>5</li>
      <li>6</li>
      <li>7</li>
    </ul>
    <a id="btn" onclick="cli()">简化</a>
  </body>
  <script>
    $(function cli(){
      $("#btn").css("cursor","pointer");
      if($("#btn").html()=="简化"){
      var ran1=parseInt(Math.random()*7);
      var ran2=parseInt(Math.random()*7);
      var ran3=parseInt(Math.random()*7); //①从0~6中生成3个随机数完成
      if(ran1!=ran2&&ran1!=ran2&&ran2!=ran3){ //②判断3个随机数是否相等，不相等则执行操作。
      $('li:eq('+ran1+')').css('display','none');  
      $('li:eq('+ran2+')').css('display','none');    
      $('li:eq('+ran3+')').css('display','none'); 
      $("#btn").html("更多");
      }else{　　//③3随机数有重复，则重新执行函数。
        cli();
      }
      }
      
      else{
        $("li:hidden").css('display','list-item');
        $("a:contains('更多')").html("简化");
      }
      
      });

  </script>
</html>

Harvest 1:

Copy code The code is as follows:

var ran=parseInt(Math.random()*(max-min 1) min); //Generate a random number in the [min,max] interval

Harvest 2:

After some reflection, I decided to write a package function that generates n non-repeating random numbers within a certain [min, max] interval.

Idea 1: First generate n random numbers in the interval [min, max], compare whether they are repeated, and return if they are repeated, and execute again.

Demonstration address: http://jsbin.com/yupuyehuqa/edit?html,js,output

Wrapped function:

function my_ran(n,min,max){
 var arr=[];
 for(i=0;i<n;i++){
  arr[i]=parseInt(Math.random()*(max-min+1)+min);
 }
 for(i=0;i<n;i++){
  for(j=i+1;j<n;j++){
   if(arr[i]==arr[j]){
    my_ran(n,min,max);
    return fault;
   }
  }
 }
 return arr;
}

Idea 2: Generate the i-th random number in the [min, max] interval, and compare it with the previous i-1 number. If there is repetition, set i=i-1; repeatedly generate the i-th random number.

Demonstration address: http://jsbin.com/zorunotosi/edit?html,js,output

Wrapped function:

function my_ran2(n,min,max){
 var arr=[];
 for(i=0;i<n;i++){
  arr[i]=parseInt(Math.random()*(max-min+1)+min);
  for(j=0;j<i;j++){
   if(arr[i]==arr[j]){
    i=i-1;
    break;
   }
  }
 }
 return arr;
}

Idea 3: Generate a sequential array in the [min, max] interval, scramble the array, and output the first n values.

Demonstration address: http://jsbin.com/zorunotosi/edit?html,js,output

Wrapped function:

function my_ran3(n,min,max){
 var arr=[];
 var arr2=[];
 for(i=0;i<max-min+1;i++){
  arr[i]=i+min;
 }
 for(var j,x,i=arr.length;i;j=parseInt(Math.random()*i),x=arr[--i],arr[i]=arr[j],arr[j]=x);
 for(i=0;i<n;i++){
  arr2[i]=arr[i];
 }
 return arr2;
}

Idea 4: Generate a sequential array in the [min, max] interval, randomly select a value from it, then delete this value in the array, and then select a second random value.

Demonstration address: http://jsbin.com/zorunotosi/edit?html,js,output

Wrapped function:

function my_ran4(n,min,max){
 var arr=[];
 var arr2=[];
 for(i=0;i<max-min+1;i++){
  arr[i]=i+min;
 }
 for(i=0;i<n;i++){
  var x=parseInt(Math.random()*arr.length);
  arr2[i]=arr[x];
  for(j=x;j<arr.length;j++){
   arr[j]=arr[j+1];
  }
  arr.length=arr.length-1;
 }
 return arr2;
}

It’s too late, I’ll adjust the format tomorrow when I have time.

The above is the entire content of this article, I hope you all like it.

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：Summary of first introduction to Javascript_javascript skillsNext article：Summary of first introduction to Javascript_javascript skills

See more

JavaScript generates non-repeating random numbers_javascript skills

Related articles