# freeCodeCamp Challenge Guide: Return Largest Numbers in Arrays

**URL:** <https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042>\
**Category:** freeCodeCamp Contributors\
**Tags:** guide\
**Created:** [June 30, 2016, 9:16pm UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042 "2016-06-30T21:16:23Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![camperbot](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/camperbot/32/18364_2.png) [@camperbot](https://forum.freecodecamp.org/u/camperbot)\
**Post date:** [June 30, 2016, 9:16pm UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/1 "2016-06-30T21:16:23Z")

</div>

# [Return Largest Numbers in Arrays](https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/basic-algorithm-scripting/return-largest-numbers-in-arrays)

* * *

## Problem Explanation

You will get an array that contains sub arrays of numbers and you need to return an array with the largest number from each of the sub arrays.

* * *

## Hints

### Hint 1

You will get an array that contains sub arrays of numbers and you need to return an array with the largest number from each of the sub arrays. You will need to keep track of the array with the answer and the largest number of each sub-array.

### Hint 2

You can work with multidimensional arrays by `Array[Index][SubIndex]`

### Hint 3

Pay close attention to the timing of the storing of variables when working with loops

* * *

## Solutions

> **Solution 1 (Click to Show/Hide)**
>
> **(Procedural approach)**
> 
> ```js
> function largestOfFour(arr) {
> const results = [];
> for (let i = 0; i < arr.length; i++) {
> let largestNumber = arr[i][0];
> for (let j = 1; j < arr[i].length; j++) {
> if (arr[i][j] > largestNumber) {
> largestNumber = arr[i][j];
> }
> }
> results[i] = largestNumber;
> }
> 
> return results;
> }
> 
> ```
> 
> #### Code Explanation
> 
> - Create a variable to store the _results_ as an array.
> - Create an outer loop to iterate through the outer array.
> - Create a second variable to hold the largest number and initialise it with the first number. This must be outside an inner loop so it won’t be reassigned until we find a larger number.
> - Create said inner loop to work with the sub-arrays.
> - Check if the element of the sub array is larger than the currently stored largest number. If so, then update the number in the variable.
> - After the inner loop, save the largest number in the corresponding position inside of the `results` array.
> - And finally return said array.
> 
> #### Relevant Links
> 
> - [For loops](http://forum.freecodecamp.com/t/javascript-for-loop/14666s-Explained)

> **Solution 2 (Click to Show/Hide)**
>
> **(Declarative approach)**
> 
> ```js
> function largestOfFour(arr) {
> return arr.map(function(group) {
> return group.reduce(function(prev, current) {
> return current > prev ? current : prev;
> });
> });
> }
> 
> ```
> 
> #### Code Explanation
> 
> - we map all items within the main array to a new array using `Array.prototype.map()` and return this array as the final result
> - within each inner array, we reduce its contents down to a single value using `Array.prototype.reduce()`
> - the callback function passed to the reduce method takes the previous value and the current value and compares the two values
> - if the current value is higher than the previous value we set it as the new previous value for comparison with the next item within the array or returns it to the map method callback if it’s the last item
> 
> #### Relevant Links
> 
> - [Array.prototype.map()](http://forum.freecodecamp.com/t/javascript-array-prototype-map/14294)
> - [Array.prototype.reduce()](http://forum.freecodecamp.com/t/javascript-array-prototype-reduce/14299)
> - [Ternary Operators](http://forum.freecodecamp.com/t/javascript-ternary-operator/15973)

> **Solution 3 (Click to Show/Hide)**
>
> **(Declarative approach)**
> 
> ```js
> function largestOfFour(arr) {
> return arr.map(Function.apply.bind(Math.max, null));
> }
> 
> ```
> 
> #### Code Explanation
> 
> TL;DR: We build a special callback function (using the `Function.bind` method), that works just like `Math.max` but also has `Function.prototype.apply`’s ability to take arrays as its arguments.
> 
> - We start by mapping through the elements inside the main array. Meaning each one of the inner arrays.
> - Now the need a callback function to find the max of each inner array provided by the map.
> 
> So we want to create a function that does the work of `Math.max` and accepts input as an array (which by it doesn’t by default).
> 
> In other words, it would be really nice and simple if this worked by itself:
> 
> `Math.max([9, 43, 20, 6]); // Resulting in 43`
> 
> Alas, it doesn’t.
> 
> - To do the work of accepting arguments in the shape of an array, there is this `Function.prototype.apply` method, but it complicates things a bit by _invoking_ the _context_ function.
> 
> i.e. `Math.max.apply(null, [9, 43, 20, 6]);` would invoke something like a `Max.max` method. What we’re looking for… almost.
> 
> Here we’re passing `null` as the _context_ of the `Function.prototype.apply` method as `Math.max` doesn’t need any context.
> 
> - Since `arr.map` expects a callback function, not just an expression, we create a function out of the previous expression by using the `Function.bind` method.
> - Since, `Function.prototype.apply` is a static _method_ of the same `Function` _object_, we can call `Function.prototype.bind` on `Function.prototype.apply` i.e. `Function.prototype.apply.bind`.
> - Now we pass the _context_ for the `Function.prototype.apply.bind` call (in this case we want `Math.max`so we can gain its functionality).
> - Since the embedded `Function.prototype.apply` method will also require a context as it’s 1st argument, we need to pass it a bogus _context_.
> - So, we pass `null` as the 2nd param to `Function.prototype.apply.bind` which gives a _context_ to the `Math.max` method.
> 
> - Since, `Math.max` is independent of any _context_, hence, it ignores the bogus _context_ given by `Function.prototype.apply` method call.
> 
> - Thus, our `Function.prototype.apply.bind(Math.max, null)` makes a new function accepting the `arr.map` values i.e. the inner arrays.
> 
> #### Relevant Links
> 
> - [Math.max](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/max)
> - [Function.prototype.apply on DevDocs](http://devdocs.io/#q=js+Function+apply)
> - [Function.bind on DevDocs](http://devdocs.io/#q=js+Function+bind)

> **Solution 4 (Click to Show/Hide)**
>
> **(Recursive approach)**
> 
> ```js
> function largestOfFour(arr, finalArr = []) {
> return !arr.length
> ? finalArr
> : largestOfFour(arr.slice(1), finalArr.concat(Math.max(...arr[0])))
> }
> 
> ```

---

<div class="post-metadata">

**Author:** ![clintonjohn](https://avatars.discourse-cdn.com/v4/letter/c/9dc877/32.png) [@clintonjohn](https://forum.freecodecamp.org/u/clintonjohn)\
**Post date:** [July 8, 2016, 2:29am UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/2 "2016-07-08T02:29:59Z")

</div>

Superb explanation. Thank you!

---

<div class="post-metadata">

**Author:** ![fleischut](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/fleischut/32/9535_2.png) [@fleischut](https://forum.freecodecamp.org/u/fleischut)\
**Post date:** [July 13, 2016, 9:42pm UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/3 "2016-07-13T21:42:07Z")

</div>

I just want to say: these algorithm help solutions are AMAZING. I am generally able to hack together something for a solution for each of the challenges but your intermediate/advanced solutions are blowing my mind. So much to learn! Thank you for doing these!

---

<div class="post-metadata">

**Author:** ![Rafase282](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/rafase282/32/161583_2.png) [@Rafase282](https://forum.freecodecamp.org/u/Rafase282)\
**Post date:** [July 13, 2016, 11:09pm UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/4 "2016-07-13T23:09:42Z")

</div>

Thanks, there have been on the wiki long before the forum came and the solutions are from different campers, I did provide at least one solution for most of them but feel free to contribute by creating or editing existing wiki articles.

---

<div class="post-metadata">

**Author:** ![Rafase282](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/rafase282/32/161583_2.png) [@Rafase282](https://forum.freecodecamp.org/u/Rafase282)\
**Post date:** [July 14, 2016, 12:50am UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/6 "2016-07-14T00:50:38Z")

</div>

Well I’m not that familiar but it seems that the bind was to apply the function instead of making your own. As to why would you want to use a built in function instead of making your own that uses it, I think is like avoiding the middleman.

---

<div class="post-metadata">

**Author:** ![camperbot](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/camperbot/32/18364_2.png) [@camperbot](https://forum.freecodecamp.org/u/camperbot)\
**Post date:** [July 14, 2016, 1:43am UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/7 "2016-07-14T01:43:34Z")

</div>

Benchmark by @P1xt  
Results … ES6 and “Function.apply.bind” may look all snazzy and smart but neither is the actual advanced solution. Because, an advanced solution takes efficiency into account and the “vanilla” solution is by far the fastest / most efficient of the three.

```javascript
  1 var Benchmark = require('benchmark');
  2 var suite = new Benchmark.Suite;
  3
  4 function largestOfFourBind(arr) {
  5 return arr.map(Function.apply.bind(Math.max, null));
  6 }
  7
  8 function largestOfFourES6(arr) {
  9 return arr.map((a) => Math.max(...a));
 10 }
 11
 12 function largestOfFourVanilla(arr) {
 13 return arr.map(function(a) {
 14 return Math.max.apply(null, a);
 15 });
 16 }
 17
 18 // add tests
 19 suite.add('bind', function() {
 20 largestOfFourBind([[4, 5, 1, 3], [13, 27, 18, 26], [32, 35, 37, 39], [10 00, 1001, 857, 1]]);
 21 })
 22 .add('es6', function() {
 23 largestOfFourES6([[4, 5, 1, 3], [13, 27, 18, 26], [32, 35, 37, 39], [100 0, 1001, 857, 1]]);
 24 })
 25 .add('vanilla', function() {
 26 largestOfFourVanilla([[4, 5, 1, 3], [13, 27, 18, 26], [32, 35, 37, 39], [1000, 1001, 857, 1]]);
 27 })
 28 // add listeners
 29 .on('cycle', function(event) {
 30 console.log(String(event.target));
 31 })
 32 .on('complete', function() {
 33 console.log('Fastest is ' + this.filter('fastest').map('name'));
 34 })
 35 // run async
 36 .run({ 'async': true });

```

output:

> bind x 355,997 ops/sec ±4.59% (71 runs sampled)  
> es6 x 91,822 ops/sec ±1.26% (75 runs sampled)  
> vanilla x 802,980 ops/sec ±1.60% (76 runs sampled)  
> Fastest is vanilla

**EDIT**

As a thought experiment I went back and tested the beginner and intermediate solutions against the other three.

**The beginner solution was actually the fastest far and away by a LARGE margin.**

> beginner x 3,482,777 ops/sec ±1.66% (69 runs sampled)  
> intermediate x 497,563 ops/sec ±1.83% (71 runs sampled)  
> bind x 378,711 ops/sec ±1.62% (74 runs sampled)  
> es6 x 95,515 ops/sec ±1.03% (84 runs sampled)  
> vanilla x 815,023 ops/sec ±0.97% (81 runs sampled)  
> Fastest is beginner

This was an important lesson, to me at least, that the solution that uses the least characters, or that uses the most advanced features of the language, isn’t necessarily the most advanced solution if the beginner solution is more efficient.

---

<div class="post-metadata">

**Author:** ![Nims](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/nims/32/160490_2.png) [@Nims](https://forum.freecodecamp.org/u/Nims)\
**Post date:** [August 2, 2016, 9:09am UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/8 "2016-08-02T09:09:29Z")

</div>

Here is a solution I came up with utilising the Math object.

```
function largestOfFour(arr) {  
  var maxNumbers = [];
  
  for (var i = 0; i < arr.length; i++) {
    maxNumbers.push(Math.max.apply(null, arr[i]));
  }
  
  return maxNumbers;
}
```

---

<div class="post-metadata">

**Author:** ![Rafase282](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/rafase282/32/161583_2.png) [@Rafase282](https://forum.freecodecamp.org/u/Rafase282)\
**Post date:** [August 10, 2016, 6:21pm UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/9 "2016-08-10T18:21:58Z")

</div>



---

<div class="post-metadata">

**Author:** ![Rafase282](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/rafase282/32/161583_2.png) [@Rafase282](https://forum.freecodecamp.org/u/Rafase282)\
**Post date:** [August 20, 2016, 3:42am UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/10 "2016-08-20T03:42:22Z")

</div>



---

<div class="post-metadata">

**Author:** ![Nerajno](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/nerajno/32/130334_2.png) [@Nerajno](https://forum.freecodecamp.org/u/Nerajno)\
**Post date:** [October 16, 2016, 5:52am UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/11 "2016-10-16T05:52:33Z")

</div>

Hey Rafase,  
love the solutions and they have been very helpful when I get stuck.

---

<div class="post-metadata">

**Author:** ![Nerajno](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/nerajno/32/130334_2.png) [@Nerajno](https://forum.freecodecamp.org/u/Nerajno)\
**Post date:** [October 16, 2016, 5:53am UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/12 "2016-10-16T05:53:34Z")

</div>

i was thinking this but i guess I never learnt it yet

---

<div class="post-metadata">

**Author:** ![dysonlu](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/dysonlu/32/158894_2.png) [@dysonlu](https://forum.freecodecamp.org/u/dysonlu)\
**Post date:** [December 21, 2016, 11:15pm UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/13 "2016-12-21T23:15:28Z")

</div>

In general, loops are always faster than function calls. Engines and compilers are highly optimized for loops. Function calls involve context switching which may bring measurable impact on performance.

---

<div class="post-metadata">

**Author:** ![JanEgbers](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/janegbers/32/93172_2.png) [@JanEgbers](https://forum.freecodecamp.org/u/JanEgbers)\
**Post date:** [January 6, 2017, 11:58am UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/14 "2017-01-06T11:58:36Z")

</div>

Hi everyone,

I came up with a the following solution:

```
function largestOfFour(arr) {

  var arrNew = [];

  for(var i = 0; i < arr.length; i++){
    arrNew.push(arr[i].sort(function(a, b){
      return b-a;
    })[0]);
  }

  return arrNew;

 } 

```

Code Explanation:

- Create an empty array as variable in which you store the results
- Create a _for_ loop to iterate through _arr_
- Use the _push()_ method to store the largest number as item in the array
- Inside the _push()_ method use _arr[i]_ as a parameter so that everytime the the loop iterates over an _outer array_ element it will include the _sort()_ method
- Use the _sort()_ method to the _sub array_ from largest to smallest (it is the same code as explained in the lesson _Sort Arrays with .sort_ from the course _Object oriented and functional programming_)
- After the you close _.sort()_ add _[0]_ so the _sub array_ is stored in your empty array when you use _.push()_ (as explained in hint #2)
- Close the _for_ loop
- Return the formerly empty array which now contains the largest numbers of _arr_

What do you guys think?  
English is not my native language so there might be some mistakes or the explanation is not quite satisfying.

Therefore I would be glad about any kind of feedback

---

<div class="post-metadata">

**Author:** ![guymelef](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/guymelef/32/29310_2.png) [@guymelef](https://forum.freecodecamp.org/u/guymelef)\
**Post date:** [January 19, 2017, 10:50am UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/15 "2017-01-19T10:50:48Z")

</div>

Here’s what I came up with:

```
function largestOfFour(arr) {
  var largeNum = [];
  for (var i = 0; i < arr.length; i++) {
    arr[i].sort(function(a,b) {return b - a});
    largeNum[i] = arr[i][0];
  }
  return largeNum;
}

largestOfFour([[4, 5, 1, 3], [13, 27, 18, 26], [32, 35, 37, 39], [1000, 1001, 857, 1]]);
```

---

<div class="post-metadata">

**Author:** ![sushanku](https://avatars.discourse-cdn.com/v4/letter/s/7feea3/32.png) [@sushanku](https://forum.freecodecamp.org/u/sushanku)\
**Post date:** [January 22, 2017, 5:12pm UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/16 "2017-01-22T17:12:36Z")

</div>

I have used two ways to solved this problem, 1) by map and other 2) by loop.  
I have gone through some of the answers, and I found most of them complicated. Not complicated but used so many things. So this is the neatness I come up with.

function largestOfFour(arr) {  
var array = arr.map(function(large){  
return Math.max.apply(null, large);  
});  
return array;  
}  
**OR**  
function largestOfFour(arr) {  
var arr1=[];  
for(i=0; i\<arr.length;i++){  
arr1.push(Math.max.apply(null, arr[i]));  
}  
return arr1;  
}

---

<div class="post-metadata">

**Author:** ![mabbasi09](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/mabbasi09/32/30990_2.png) [@mabbasi09](https://forum.freecodecamp.org/u/mabbasi09)\
**Post date:** [January 26, 2017, 6:55am UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/17 "2017-01-26T06:55:45Z")

</div>

Using a mix of the procedural and advanced methods  
function largestOfFour(arr) {  
var arrNew = arr.map(function(x){  
var max = 0;  
for (var i = 0; i \< x.length; i++){  
if (x[i] \> max){  
max = x[i];  
}  
}  
return max;  
});  
return arrNew;  
}

---

<div class="post-metadata">

**Author:** ![arssonist](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/arssonist/32/73145_2.png) [@arssonist](https://forum.freecodecamp.org/u/arssonist)\
**Post date:** [February 16, 2017, 11:47pm UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/18 "2017-02-16T23:47:28Z")

</div>

Working on the second declarative solution. If I copy and paste it I get  
`group.reduce is not a function`

I’ve tried in Node and in the browser. What am I doing wrong?

---

<div class="post-metadata">

**Author:** ![Raademar](https://avatars.discourse-cdn.com/v4/letter/r/e19b73/32.png) [@Raademar](https://forum.freecodecamp.org/u/Raademar)\
**Post date:** [February 17, 2017, 10:54pm UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/19 "2017-02-17T22:54:04Z")

</div>

My solution 🙂

```auto
function largestOfFour(arr) {
  var returned = [];
  var shift = [];
  

function lowHigh(a, b) {
	return a - b;
}

  for (var i = 0; i < arr.length; i++){
    for(var j = 0; j < arr[i].length; j++){
     
    arr[i].sort(lowHigh);
    arr[i].reverse();
    
    }
    returned.push(arr[i][0]);
    
  }
  return returned;
}

largestOfFour([[4, 5, 1, 3], [13, 27, 18, 26], [32, 35, 37, 39], [1000, 1001, 857, 1]]);

```

---

<div class="post-metadata">

**Author:** ![countercoded](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/countercoded/32/39308_2.png) [@countercoded](https://forum.freecodecamp.org/u/countercoded)\
**Post date:** [February 27, 2017, 6:35am UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/20 "2017-02-27T06:35:23Z")

</div>

Hi there,

I love the explanations of different solutions for these algorithm assignments but I had a quick question regarding the solution of the first one.

When iterating over the second for loop, why do we initialize sb = 1 instead of 0?

Thanks!

---

<div class="post-metadata">

**Author:** ![martinrebo](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/martinrebo/32/161025_2.png) [@martinrebo](https://forum.freecodecamp.org/u/martinrebo)\
**Post date:** [April 15, 2017, 6:26pm UTC](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042/21 "2017-04-15T18:26:11Z")

</div>

Hello countercoded

> [@countercoded](#):
>
> When iterating over the second for loop, why do we initialize sb = 1 instead of 0?

I’m having the same question: Short Anwser or How I understand it:

**it allows the " _for loop_ " to do the first iteration.**

The case arr[n][0] is already inside the first iteration of the loop by largestNumber. So, on the first loop iteration, you are comparing case 1 (arr00) against case 2 (arr01) , otherwise, the first iteration of the loop would be comparing case 1 against case 1.

As you can see largestNumber is outside the loop:

```auto
var largestNumber = arr[n][0];

```

Try to visualize what would happen is sb is set up to 0.

```auto
for (var sb = 1; sb < arr[n].length; sb++) {
      if (arr[n][sb] > largestNumber) {
        largestNumber = arr[n][sb];

```

Well, at least is how i see it.  
Regards,  
Martin

Note: I’m not an Expert, this is just an opinion.

[Next page](https://forum.freecodecamp.org/t/freecodecamp-challenge-guide-return-largest-numbers-in-arrays/16042.md?page=2)