0
const firstNonConsecutive = arr => arr.find((number, index) => index > 1 && number !== arr[index -1] + 1)

Is there anyone who could help me break the above function down for me ? I wrote a very long code to solve the task and someone sent me a correction and said my code could be simplified.

blex
  • 24,941
  • 5
  • 39
  • 72
Krystian Małysek
  • 11
  • 1

1 Answers1

1

The first thing I would do to decompose this would be to add curly braces and break it down in multiple lines:

// This function takes an Array
const firstNonConsecutive = arr => {
  // And tries to find an item
  return arr.find((number, index) => {
    return index > 1 && // Starting from index 2 (the first 2 are ignored)
      number !== arr[index - 1] + 1; // Where the value is not (previous value + 1)
  });
}

console.log(firstNonConsecutive([128, 6, 2, 8])); // 2         -> ??
console.log(firstNonConsecutive([5, 6, 2, 8]));   // 2         -> correct
console.log(firstNonConsecutive([5, 6, 7, 8]));   // undefined -> correct

Then, if you don't know that method, you could look up some documentation on Array.prototype.find(). It takes a callback function which it will execute on every item until that callback returns true (or any truthy value) at some point. If it does, it will return that value. Otherwise, if no item matches the condition, it will return undefined.

This should be enough to understand what it does?

The weird thing is that is starts from index 2 (index > 1). Using this logic, this means the very first item is never checked. Maybe that condition should be index > 0:

// This function takes an Array
const firstNonConsecutive = arr => {
  // And tries to find an item
  return arr.find((number, index) => {
    return index > 0 && // Starting from index 1 (the first is ignored)
      number !== arr[index - 1] + 1; // Where the value is not (previous value + 1)
  });
}

console.log(firstNonConsecutive([128, 6, 2, 8])); // 6         -> correct
console.log(firstNonConsecutive([5, 6, 2, 8]));   // 2         -> correct
console.log(firstNonConsecutive([5, 6, 7, 8]));   // undefined -> correct

Here is a more deconstructed way to write this:

function firstNonConsecutive(arr) {
  // Find an item that passes the condition
  return arr.find(passesCondition);
  
  function passesCondition(number, index) {
    return index > 0 && number !== arr[index - 1] + 1;
  }
}

console.log(firstNonConsecutive([128, 6, 2, 8])); // 6         -> correct
console.log(firstNonConsecutive([5, 6, 2, 8]));   // 2         -> correct
console.log(firstNonConsecutive([5, 6, 7, 8]));   // undefined -> correct
blex
  • 24,941
  • 5
  • 39
  • 72
  • I think I understand that but I have a few questions 1. We are creating a function called "firstNonConsecutive" and the parameter is any array 2. the function uses the find.array function and … what does that "(number, index)" do ? Does it loop through an array ? Are these properties inside the curly brackets parameters ? – Krystian Małysek Feb 29 '20 at 15:00
  • 1. Correct. 2. The only parameter we pass to `.find()` is a function (commonly called _callback_). That function will be executed for every item in the Array (until it finds something). And every time, this callback will be called with 2 parameters: `number`, which is the value of the current item, and `index`, which is the position of the current item in the Array. – blex Feb 29 '20 at 18:13
  • Inside the curly brackets is the _body_ of the function, which will be executed every time, for every item. Note: this syntax `(x) => {...}` is _([almost](https://stackoverflow.com/questions/34361379/are-arrow-functions-and-functions-equivalent-exchangeable))_ equivalent to `function(x) { ... }` – blex Feb 29 '20 at 18:13
  • I added a third example in my answer above – blex Feb 29 '20 at 18:17