{"id":1930,"date":"2018-05-21T22:33:50","date_gmt":"2018-05-22T03:33:50","guid":{"rendered":"http:\/\/bluegalaxy.info\/codewalk\/?p=1930"},"modified":"2018-05-21T22:33:50","modified_gmt":"2018-05-22T03:33:50","slug":"javascript-get-n-largest-numbers-array-using-sort-slice","status":"publish","type":"post","link":"https:\/\/bluegalaxy.info\/codewalk\/2018\/05\/21\/javascript-get-n-largest-numbers-array-using-sort-slice\/","title":{"rendered":"JavaScript: How to get N largest numbers in an array using sort( ) and slice( )"},"content":{"rendered":"<p>Where this previous article explained how to get the max number in an numeric array:<\/p>\n<blockquote class=\"wp-embedded-content\" data-secret=\"FV4ejhTY7L\"><p><a href=\"http:\/\/bluegalaxy.info\/codewalk\/2018\/05\/21\/javascript-get-largest-number-array-using-math-max\/\">JavaScript: How to get the largest number in an array using Math.max( )<\/a><\/p><\/blockquote>\n<p><iframe loading=\"lazy\" class=\"wp-embedded-content\" sandbox=\"allow-scripts\" security=\"restricted\" style=\"position: absolute; clip: rect(1px, 1px, 1px, 1px);\" src=\"http:\/\/bluegalaxy.info\/codewalk\/2018\/05\/21\/javascript-get-largest-number-array-using-math-max\/embed\/#?secret=FV4ejhTY7L\" data-secret=\"FV4ejhTY7L\" width=\"600\" height=\"338\" title=\"&#8220;JavaScript: How to get the largest number in an array using Math.max( )&#8221; &#8212; Chris Nielsen Code Walk\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\"><\/iframe><\/p>\n<p>There are times where we want more than just the single highest value in an array. What if we want the top 2, 3 or 5 numbers in the array? This is a common scenario where there are multiple entrants in a contest and we want to find the top three scores to award first, second, and third places. This article will detail how to get more than one top value from a list, in an array, sorted in ascending order.<\/p>\n<p>Here is some code in one line that demonstrates how to get the top 3 scores in an array:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">console.log([1, -5, 22, 8, 17, 0, -2].sort(function(a, b){return b - a}).slice(0, 3));<\/pre>\n<p>Which yields:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"no-highlight\">[22, 17, 8]<\/pre>\n<p>Written another way, assigning the results to a new list:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">let scores = [1, -5, 22, 8, 17, 0, -2];\r\nlet winners = scores.sort( function(a, b){return b - a}).slice(0, 3));\r\nconsole.log(\"Winners:\", winners);<\/pre>\n<p>There are three parts to this:<\/p>\n<p>&nbsp;<\/p>\n<h4><strong>Part 1: array<\/strong><\/h4>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"no-highlight\">[1, -5, 2, 8, 17, 0, -2]<\/pre>\n<h4><strong>Part 2: .sort( )<br \/>\n<\/strong><\/h4>\n<p>sort() has one argument and it is a function with arguments a and b<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"no-highlight\">.sort(function(a, b){return b - a})<\/pre>\n<h4><strong>Part 3: .slice( )<br \/>\n<\/strong><\/h4>\n<p>slice() takes a portion of the list that has just been sorted in ascending order by the .sort function. The first argument for .slice is the starting index, and the second argument is the number of top values to return (in order, from largest to smallest).<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"no-highlight\">.slice(0, 3)<\/pre>\n<p>Now to get the N largest numbers in an array, all we have to do is replace the 3 in the slice argument with n. For example:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">let nums = [4, 3, 3, 3, 0, 4, 3, 0, 3, 34, 0, 11, 32, 0];\r\nlet n = 5;\r\nlet topFive = nums.sort(function(a, b){return b - a}).slice(0, n);\r\nconsole.log('topFive', topFive);<\/pre>\n<p>which yields:<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"no-highlight\">\"topFive\" [34, 32, 11, 4, 4]<\/pre>\n<p>For more information about the .sort() and .slice() methods, see:<br \/>\n<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Global_Objects\/Array\/slice\">https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Global_Objects\/Array\/slice<\/a><br \/>\n<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Global_Objects\/Array\/sort\">https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Global_Objects\/Array\/sort<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Where this previous article explained how to get the max number in an numeric array: JavaScript: How to get the largest number in an array using Math.max( ) There are times where we want more than just the single highest value in an array. What if we want the top 2, 3 or 5 numbers &hellip; <a href=\"https:\/\/bluegalaxy.info\/codewalk\/2018\/05\/21\/javascript-get-n-largest-numbers-array-using-sort-slice\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">JavaScript: How to get N largest numbers in an array using sort( ) and slice( )<\/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":[45,137,138],"class_list":["post-1930","post","type-post","status-publish","format-standard","hentry","category-javascript-language","tag-javascript","tag-slice","tag-sort"],"_links":{"self":[{"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts\/1930","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=1930"}],"version-history":[{"count":5,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts\/1930\/revisions"}],"predecessor-version":[{"id":1936,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/posts\/1930\/revisions\/1936"}],"wp:attachment":[{"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/media?parent=1930"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/categories?post=1930"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bluegalaxy.info\/codewalk\/wp-json\/wp\/v2\/tags?post=1930"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}