Animations

API

Arrays

Async

Basics

Challenges

Classes

Console

Dates

Debugging

DOM Elements

DOM Methods

DOM Navigation

DOM Properties

Event Listeners

Flow Control

Forms

Functions

Global Functions

JSON

Keywords

Libraries (3rd party)

Math

Modules

Objects

Snippets

String

Types

Widgets

Window Object

JavaScript - Shuffle by underscore.js

 

The library underscore.js (https://underscorejs.org/) has over 100 useful functions. One of them is shuffle().

Tip: to install, use this npm command: npm install underscore.

We have an array of authors like below. Let's use shuffle to put them in random order.


$(function()
{
    $("#ShuffleButton").click(function ()
    {
        const authors =
        [
            {
                name: 'Mark Twain',
                imageUrl: 'Images/Authors/mark-twain.jpg',
                books: ['The Adventures of Huckleberry Finn', 'Life on the Mississippi']
            },
            {
                name: 'Joseph Conrad',
                imageUrl: 'Images/Authors/joseph-conrad.jpg',
                books: ['Heart of Darkness']
            },
            {
                name: 'J.K Rowling',
                imageUrl: 'Images/Authors/jk-rowling.jpg',
                books: ['Harry Potter and the Sorcerers Stone']
            },
            {
                name: 'Stephen King',
                imageUrl: 'Images/Authors/stephen-king.jpg',
                books: ['The Shining', 'It']
            },
            {
                name: 'William Shakespeare',
                imageUrl: 'Images/Authors/william-shakespeare.jpg',
                books: ['Hamlet', 'Macbeth']
            },
            {
                name: 'Arthur C Clarke',
                imageUrl: 'Images/Authors/arthur-c-clarke.jpg',
                books: ['2001', 'Rendevous with Rama']
            },
            {
                name: 'Isaas Asimov',
                imageUrl: 'Images/Authors/isaac-asimov.jpg',
                books: ['The Gods Themselves', 'Robot Dreams', 'The Naked Sun']
            }
        ];

let shuffledAuthors = _.shuffle(authors);
        let output = "";

        shuffledAuthors.forEach((author) => { output += author.name + "<br />"; });
        $("#DemoContainer").html(output);
    });
});