{"id":1913,"date":"2018-05-01T08:00:42","date_gmt":"2018-05-01T13:00:42","guid":{"rendered":"http:\/\/bluegalaxy.info\/codewalk\/?p=1913"},"modified":"2018-05-21T21:03:42","modified_gmt":"2018-05-22T02:03:42","slug":"javascript-get-random-index-array","status":"publish","type":"post","link":"https:\/\/bluegalaxy.info\/codewalk\/2018\/05\/01\/javascript-get-random-index-array\/","title":{"rendered":"JavaScript: How to get a random index from an array"},"content":{"rendered":"<p>Let&#8217;s say I have an array of 100 integers that looks like this:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">let hundred = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57, 58, 59, 60, 61, 62, 63, 64, 65, 66, 67, 68, 69, 70, 71, 72, 73, 74, 75, 76, 77, 78, 79, 80, 81, 82, 83, 84, 85, 86, 87, 88, 89, 90, 91, 92, 93, 94, 95, 96, 97, 98, 99, 100]<\/pre>\n<p>By the way, here is the code that I used to generate this list of 100 integers in JavaScript (ES6):<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">let hundred = Array.from({length: 100}, (v, k) =&gt; k+1); \r\nconsole.log(hundred.toString());<\/pre>\n<p>This uses the JavaScript from() method. Here is what developer.mozilla.com says about the from() method:<\/p>\n<blockquote><p>The Array.from() method creates a new Array instance from an array-like or iterable object.<\/p><\/blockquote>\n<p>The from() method can also be used to create an array from a string. For example:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">var myArr = Array.from(\"ABCDEFG\");<\/pre>\n<p>yields<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"no-highlight\">[A,B,C,D,E,F,G]<\/pre>\n<p>Now if I want to return a random number from this array, I can do so like this:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">let rand = hundred[Math.floor(Math.random() * hundred.length)];\r\nconsole.log('rand', rand);\r\n\/\/ or\r\nconsole.log('rand', hundred[rand])<\/pre>\n<p>which yields a different number from 1 to 100 every time it is run.<\/p>\n<p>This code has three parts:<\/p>\n<p>1. the inside call to Math.random()<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">Math.random() * hundred.length\r\n\/\/ or\r\nconsole.log(Math.random() * 100);<\/pre>\n<p>this yields a floating point number between 0 and length (100) . For example:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"no-highlight\">28.176629963901156<\/pre>\n<p>2. the middle call to Math.floor()<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">Math.floor(28.176629963901156);<\/pre>\n<p>This takes the result of step 1 and rounds it to the nearest integer. In this case 28.<\/p>\n<p>3. the outer array index reference<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">hundred[28];<\/pre>\n<p>For more information about the\u00a0<code class=\"EnlighterJSRAW\" data-enlighter-language=\"no-highlight\">from()<\/code>method, see:<br \/>\n<a href=\"https:\/\/www.w3schools.com\/jsref\/jsref_from.asp\">https:\/\/www.w3schools.com\/jsref\/jsref_from.asp<\/a><br \/>\n<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Global_Objects\/Array\/from\">https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Global_Objects\/Array\/from<\/a><\/p>\n<p>For more information about Math.random(), see:<br \/>\n<a href=\"https:\/\/www.w3schools.com\/jsref\/jsref_random.asp\">https:\/\/www.w3schools.com\/jsref\/jsref_random.asp<\/a><br \/>\n<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Global_Objects\/Math\/random\">https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Global_Objects\/Math\/random<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Let&#8217;s say I have an array of 100 integers that looks like this: let hundred = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, &hellip; <a href=\"https:\/\/bluegalaxy.info\/codewalk\/2018\/05\/01\/javascript-get-random-index-array\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">JavaScript: How to get a random index from an array<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[44],"tags":[135,45,51,109],"class_list":["post-1913","post","type-post","status-publish","format-standard","hentry","category-javascript-language","tag-from","tag-javascript","tag-math-random","tag-math-round"],"_links":{"self":[{"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts\/1913","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/comments?post=1913"}],"version-history":[{"count":6,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts\/1913\/revisions"}],"predecessor-version":[{"id":1923,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts\/1913\/revisions\/1923"}],"wp:attachment":[{"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/media?parent=1913"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/categories?post=1913"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/tags?post=1913"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}