PSA For Referencing Properties in Functions!

So I was going through freeCodeCamp's exercise "Profile Lookup" for the 3rd-ish time and there's always something about that exercise that puts me back in my place, when I'm feeling pretty good about myself, as far as my newfound coding skills are concerned. But it's a good thing I've gone through it that many times, as this concept needs to get cemented into my psyche, hence why I'm spewing this out into the world for all to see:

BE SURE TO USE BRACKET NOTATION WHEN REFERENCING OBJECT PROPERTY VARIABLES IN A LOOKUP FUNCTION

Man, that felt good.

If you're confused as to what exactly the heck I'm talking about, don't worry, I am too. Let me demonstrate exactly what I mean:

const contacts = [
 {
    firstName: "Akira",
    lastName: "Laine",
    number: "0543236543",
    likes: ["Pizza", "Coding", "Brownie Points"],
  }
]

function lookUpProfile(name, prop) {

}

//I've shortened the amount of objects from the original exercise for brevity, just FYI.

FCC has an exercise where you need to create a function to look up whether an object in the array contacts contains a specific name and/or a specific prop (property). The most basic way to solve this is to use a for loop and iterate through each of the objects to see if one of the object's properties contains that person's first name and then see if there exists that property. Here's how I first attempted to solve it:

function lookUpProfile(name, prop) {

for (let i = 0; i < contacts.length; i++) {
  if (name === contacts[i].firstName) {

    return contacts[i].prop || 'No such property'
  }

 } return 'No such contact'
}

lookUpProfile("Akira", "likes");

So I was using a for loop to sort through the array's objects and implementing an if statement to catch whether or not a given name was located in the object. By saying name === contacts[i].firstName, that should be able to catch what I was looking for. And it did. However, the next line is where I went wrong:

return contacts[i].prop || 'No such property'

Based off the previous line of code from this one, I thought "oh, so I can just type out something similar to that format and it should return the prop value if it's there, and if it's not, it'll return 'No such property'. Simple, right? WRONG.

I made a dreadful error in thinking I could use dot notation to catch whatever given property was passed into the prop parameter of the function. Take a look at how they're passing in the arguments:

lookUpProfile("Akira", "likes");

You see that? They're passing in strings.

When you pass in a string to a function's argument and expect dot notation to work within the function's statements, it's going to return this:

return contacts[0].'likes' || 'No such property'

There isn't any way an object's property can be in string format when using dot notation. You HAVE to use bracket notation in order for that to work. Here's what the correct code needs to look like:

function lookUpProfile(name, prop) {

for (let i = 0; i < contacts.length; i++) {
  if (name === contacts[i].firstName) {

    return contacts[i][prop] || 'No such property'
  }

 } return 'No such contact'
}

lookUpProfile("Akira", "likes");

Now everything is smooth sailing! Some of you may be thinking "duh, of course that didn't work, you heckin' n00b" and you're 100% correct, but I'm trYING MY BEST OKAY?? 😅

Anywho, I'll get off my soapbox now. I hope this helps out at least one person and if not, at least it helped to solidify this concept into my brain by typing it all out.

I wish thee well on your coding journey, wherever you may be. Never give up!

<3<3<3