RE: Removing a Note: Day Seven of "The Complete Node.js Developer Course"

Hi Matthew! It's really inspiring to see how you're going about this. Initiative and passion are the key.

I'd like to give my take on explaining this line:

var rmDuplicate = notes.filter((note) => note.title !== title)

First of all, lets call the variable uniqueNotes to better describe what it is, as we're removing the duplicate notes so we can save only the unique ones:

const uniqueNotes = notes.filter((note) => note.title !== title)

To better understand what it does, let's forget about arrow functions for a moment, so we can write it as an ordinary function and work our way to the arrow function notation.

const uniqueNotes = notes.filter(function (note) {
    return note.title !== title
})

So far so good. As a note, the filter function can be called on any array in JavaScript. You pass it a function as an argument , which is invoked for every element. This predicate function returns true if the element should stay or false if we want to remove it. Then, the filter function returns a new array comprised of all the elements that we decided should stay.

Ok, now we can refactor our predicate function to be an arrow function:

const uniqueNotes = notes.filter((note) => {
    return note.title !== title
})

Pretty similar, right? But we can go further, and remove the parenthesis around the note argument (because there is only one argument, if there were multiple, we'd have to keep the parenthesis)

const uniqueNotes = notes.filter(note => {
    return note.title !== title
})

Okay! But we can make it even more compact by removing the curly braces that denote the function block (we can do this only if our arrow function has one line, and this one does)

const uniqueNotes = notes.filter(note => note.title !== title)

By removing the curly braces, we also need to remove the return keyword, as it is implied when using this shorthand arrow function notation.

So what's the difference between using an arrow function and a regular function?

Well, obviously it's more expressive, meaning that it tells you what it's doing using less characters like curly brackets and the return statement.

But there's another thing that makes the arrow functions different - their scope. Arrow functions don't have their own scope, but are bound to the scope of the function that they are defined in.

In practice, this means that this inside of the arrow function will be that of the function they are called inside of. You'll find this quite useful if you've ever had to use the old var that = this trick to access the context of the parent function. Now you can simply use arrow functions!