JSFiddle - React, Tailwind, and code Playground

by mcsf

CSS

body { font-family: monospace }

Babel + JSX

let randomize1, insertAt, randomUntil
let randomize2, maybeFlip, flatten, partition, pivot, randomBit

randomize1 = xs =>
	xs.reduceRight( ( acc, x ) =>
		insertAt( x, randomUntil( acc.length ), acc ),
		[] )

insertAt = ( x, i, xs ) =>
	[ ...xs.slice( 0, i ), x, ...xs.slice( i ) ]

randomUntil = n =>
	Math.floor( Math.random() * ( n + 1 ) )

//

randomize2 = xs => xs.length <= 1
	? xs
	: flatten( maybeFlip( partition( xs )
				.map( randomize2 ) ) )

maybeFlip = ( [ xs, ys ] ) => randomBit()
	? [ xs, ys ]
	: [ ys, xs ]

flatten = ( [ xs, ys ] ) =>
	[ ...xs, ...ys ]

partition = xs =>
	[ xs.slice( 0, pivot( xs ) ), xs.slice( pivot( xs ) ) ]

pivot = xs =>
	Math.floor( xs.length / 2 )

randomBit = () =>
	Math.random() > 0.5

//


//

print = s =>
	document.body.innerText += s + '\n'

print( '### randomize1( [ 1, 2, 3, 4, 5, 6 ] ) ->' )
print( randomize1( [ 1, 2, 3, 4, 5, 6 ] ) )
print( randomize1( [ 1, 2, 3, 4, 5, 6 ] ) )
print( randomize1( [ 1, 2, 3, 4, 5, 6 ] ) )
print( randomize1( [ 1, 2, 3, 4, 5, 6 ] ) )
print( randomize1( [ 1, 2, 3, 4, 5, 6 ] ) )

print( '### randomize2( [ 1, 2, 3, 4, 5, 6 ] ) ->' )
print( randomize2( [ 1, 2, 3, 4, 5, 6 ] ) )
print( randomize2( [ 1, 2, 3, 4, 5, 6 ] ) )
print( randomize2( [ 1, 2, 3, 4, 5, 6 ] ) )
print( randomize2( [ 1, 2, 3, 4, 5, 6 ] ) )
print( randomize2( [ 1, 2, 3, 4, 5, 6 ] ) )