Random sort array

Question

I am trying to shuffle the original deck of cards, then subtract 2 cards from the shuffled deck, being player one's cards. Then before I move to player 2, I would like to shuffle the cards again, whose length should be at 50(52-2). The second player I will repeat the process(50-2).

Notice the order of the third console log array before uncommenting the fourth console log and freshDeck__01 in the JavaScript. The order is good before uncommenting. I want that order, and then to shuffle.

	let playerone = document.querySelector(".dealItP1");
	let playertwo = document.querySelector(".dealItP2");
	let playerthree = document.querySelector(".dealItP3");
	let playerfour = document.querySelector(".dealItP4");

	let deck = ["2 Club","2 Spade","2 Diamond","2 Heart","3 Club","3 Spade","3 Diamond","3 Heart","4 Club","4 Spade","4 Diamond","4 Heart","5 Club","5 Spade","5 Diamond","5 Heart","6 Club","6 Spade","6 Diamond","6 Heart","7 Club","7 Spade","7 Diamond","7 Heart","8 Club","8 Spade","8 Diamond","8 Heart","9 Club","9 Spade","9 Diamond","9 Heart","10 Club","10 Spade","10 Diamond","10 Heart","Jack Club","Jack Spade","Jack Diamond","Jack Heart","Queen Club","Queen Spade","Queen Diamond","Queen Heart","King Club","King Spade","King Diamond","King Heart","Ace Club","Ace Spade","Ace Diamond","Ace Heart"];

let originaldeck = [...deck];
 
	
	function dealIt(){
		
		
	

		
	function shuffle(deck) {
  var currentIndex = deck.length, temporaryValue, randomIndex;

  
  while (0 !== currentIndex) {

    
    randomIndex = Math.floor(Math.random() * currentIndex);
    currentIndex -= 1;

    
    temporaryValue = deck[currentIndex];
    deck[currentIndex] = deck[randomIndex];
    deck[randomIndex] = temporaryValue;
  }

  return deck;
}
		
		
		
		
		
		


var arr = deck;					

let freshDeck_00 = shuffle(arr); //length = 52 *Working* shuffled//
		
		
		
let p1Deal = freshDeck_00.filter(function(value, index, arr){return index < 2;});	//length=2 *Working* PlayerOne delt cards//
		
	
	
		let loadedDeck_00 = freshDeck_00.filter(x => !p1Deal.includes(x)).concat(p1Deal.filter(x => !freshDeck_00.includes(x)));			
		//length = 50 *Working* Symmetrical Difference between p1Deal and freshdeck_00 set to loadedDeck_00 ready to be shuffled again//
		
		
		playerone.innerHTML= p1Deal;
		
	//	let freshDeck_01 = shuffle(loadedDeck_00);// 
		
	//*IMPORTANT* WORKING UP TO THIS POINT WITH THE THRE CONSOLE LOGS, BUT WHEN UNCOMMENTING FRESHDECK_01 AND FORTH CONSOLE LOG, NOTICE THE DIFFERENCE IN ORDER OF LOADEDDECK__00(THIRD CONSOLE LOG)//
		
		
		console.log(freshDeck_00);
		console.log(p1Deal);
		console.log(loadedDeck_00);
		//console.log(freshDeck_01);//
		
	
		
	}

.main{
	box-sizing: border-box;
	border: 3px solid green;
	height: 1000px;
	width: 1000px;
	position: absolute;
	background-color: black;
	
	
}
.title{
	box-sizing: border-box;
	border: 3px green solid;
	height: 100px;
	width: 200px;
	position: absolute;
	top: 10%;
	left: 50%;
	background-color: green;
	opacity: .2;
	font-family: coniferous, sans-serif;
	font-style: normal;
	font-weight: 300;
}
.P1{
	box-sizing: border-box;
	border: 3px green solid;
	height: 100px;
	width: 100px;
	position: absolute;
	top: 30%;
	left: 45%;
	background-color: green;
	opacity: .5;
	font-family: coniferous, sans-serif;
	font-style: normal;
	font-weight: 300;
	color: red;
}
.P2{
	box-sizing: border-box;
	border: 3px green solid;
	height: 100px;
	width: 100px;
	position: absolute;
	top: 45%;
	left: 10%;
	background-color: green;
	opacity: .5;
	font-family: coniferous, sans-serif;
	font-style: normal;
	font-weight: 300;
	color: red;
}
.P3{
	box-sizing: border-box;
	border: 3px green solid;
	height: 100px;
	width: 100px;
	position: absolute;
	top: 60%;
	left: 45%;
	background-color: green;
	opacity: .5;
	font-family: coniferous, sans-serif;
	font-style: normal;
	font-weight: 300;
	color: red;
}
.P4{
	box-sizing: border-box;
	border: 3px green solid;
	height: 100px;
	width: 100px;
	position: absolute;
	top: 45%;
	left: 80%;
	background-color: green;
	opacity: .5;
	font-family: coniferous, sans-serif;
	font-style: normal;
	font-weight: 300;
	color: red;
}

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
<link href="pokerTryOne.css" rel="stylesheet" type="text/css">
</head>

<body>
	
	<div class="main">
	
	<header><h1 class="title"><button onClick="dealIt()">Click Button to Deal</button></h1></header>
			<div class="P1"><p>Pot:</p><div class="dealItP1"></div></div>
			<div class="P2"><p>Pot:</p><div class="dealItP2"></div></div>
			<div class="P3"><p>Pot:</p><div class="dealItP3"></div></div>
			<div class="P4"><p>Pot:</p><div class="dealItP4"></div></div>
		<div class="dealBet"></div>
		<div class="flopIt"></div>
		<div class="flopBet"></div>
		<div class="turnIt"></div>
		<div class="turnBet"></div>
		<div class="riverIt"></div>
		<div class="riverBet"></div>	
	</div>
<script type="text/javascript" src="pokerTryOne.js"></script>
</body>
</html>

I would like to randomize freshdeck_01 into a new array and set that value equal to freshdeck_01_fresh — user11783593
– user11783593, Commented Jul 14, 2019 at 20:53
Rather than uploading .zips, consider just putting the code into your question - see meta.stackoverflow.com/questions/358992/… — CertainPerformance
– CertainPerformance, Commented Jul 14, 2019 at 23:46
@MathewStratton : check out my solution for array shuffling. It implements Fisher-Yates algorithm which is the fastest eligible method of array shuffling. — Yevhen Horbunkov
– Yevhen Horbunkov, Commented Jul 17, 2019 at 14:44

Petr Srníček · Accepted Answer · 2019-07-14 21:41:46Z

1

when I wanted to reassign freshdeck_01 by randomizing it again I receive the same array as before.

No you do not receive an array that is ordered the same way as before.

The issue here is that Array.prototype.sort() sorts the array in-place. This means that you are shuffling your original array freshdeck_01 and then assigning a reference to that very same (now shuffled) array to another variable freshdeck_01_fresh. If you actually inspect your array before running your shuffling function, you will see that the order gets changed:

let deck = [1,2,3,4,5,6,7,8]
console.log(deck);
deck.sort(function(a, b){return 0.5 - Math.random()});
console.log(deck);

If you need to keep a copy of your unshuffled array, you can use a decomposing assignment [...x] to do that. Simple assignment would not work, as it would only create a reference to the same array.

let deck = [1,2,3,4,5,6,7,8]
let copyOfOrigDeck = [...deck];
let notASeparateCopy = deck;

console.log(deck);
deck.sort(function(a, b){return 0.5 - Math.random()});
console.log('unshuffled: ' + copyOfOrigDeck);
console.log('shuffled: ' + deck);
console.log('notASeparateCopy: ' + notASeparateCopy);

All that being said, there are probably better ways to shuffle array elements than your approach. I am no expert in that field, so I will leave that research up to you.

answered Jul 14, 2019 at 21:41

Petr Srníček

2,39612 silver badges23 bronze badges

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

2 Comments

Yevhen Horbunkov Over a year ago

Array shuffling by sort() method does not produce really random output. Fisher-Yates algorithm is the fastest eligible method. You may check out my solution in that regard which is nearly as compact as yours, while producing valid random shuffle.

Petr Srníček Over a year ago

Well, my intention was to answer the original question and point the OP at his misunderstanding of sort rather than to provide a viable shuffling algorithm. The OP has edited the question since and now asks something completely different. BTW, I just stumbled at this nice visualisation tool which also provides a very simple implementation of Fisher-Yates: bost.ocks.org/mike/shuffle/compare.html

Jorge Valverde · Accepted Answer · 2019-07-18 15:27:42Z

0

const numbers = [1,2,3,4,5,6,7,8,9,10]
// Returns a random value from a list.
const sampleFromList = list => list[Math.floor(Math.random() * list.length)]

const shuffle = (
  list,
  // Creates an array with every index of the original list.
  availableIndexes = [...list].map((n, i) => i),
  shuffledList = [],
) => {
  // Asks for a random index from the whitelist of available indexes.
  const availableIndex = sampleFromList(availableIndexes)

  // Adds the value of what's in the original list in the random whitelisted index.
  shuffledList = [...shuffledList, list[availableIndex]]
  // Filters out the used index, so is not used again.
  availableIndexes = availableIndexes.filter(n => n !== availableIndex)

  return (
    // If there are available indexes, use a recursive function to continue shuffling. Otherwise return the shuffled list.
    availableIndexes.length
        ? shuffle(list, availableIndexes, shuffledList)
        : shuffledList
  )
}

console.log(shuffle(numbers))

edited Jul 18, 2019 at 15:27

answered Jul 18, 2019 at 14:59

Jorge Valverde

11 bronze badge

1 Comment

Jorge Valverde Over a year ago

Sorry friend! I did it in a hurry, I added comments I hope you find helpful. Let me know if you need clarification somewhere in the code.

Collectives™ on Stack Overflow

Random sort array

2 Answers 2

2 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related