Objects



Course Link

1. Build JavaScript Objects

Objects are similar to arrays, except that instead of using indexes to access and modify their data, you access the data in objects through what are called properties.

var myDog = {

  "name": "Snoopy",
  "legs": 4,
  "tails": 1,
  "friends": ["Woodstock","Charlie"]
};

2. Accessing Object Properties

  • Use dot notation

When you know the name of the property you’re trying to access ahead of time

var myObj = {
  prop1: "val1",
  prop2: "val2"
};
var prop1val = myObj.prop1; // val1
var prop2val = myObj.prop2; // val2
  • Use Bracket Notation

E.g. when the property of the object you are trying to access has a space in its name)

// Setup
var testObj = {
  "an entree": "hamburger",
  "my side": "veggies",
  "the drink": "water"
};
// Access
var entreeValue = testObj["an entree"];   
var drinkValue = testObj["the drink"];  
  • Accessing Object Properties with Variables

For iterating through an object’s properties or when accessing a lookup table.

var testObj = {
  12: "Namath",
  16: "Montana",
  19: "Unitas"
};

var playerNumber=16;       
var player = testObj[playerNumber];   
  • Updating Object Properties
  • Add New Properties to a JavaScript Object
var myDog = {
  "name": "Coder",
  "legs": 4,
  "tails": 1,
  "friends": ["freeCodeCamp Campers"]
};

myDog.name = "Hppy Coder" 
myDog.bark = ["woof"];
  • Delete Properties from a JavaScript Object
 delete myDog.bark;
  • Using Objects for Lookups

When you know that your input data is limited to a certain range.

function phoneticLookup(val) {
  var result = "";

  var result_table ={
    "alpha": "Adams",
    "bravo": "Boston",
    "charlie": "Chicago",
    "delta": "Denver",
    "echo": "Easy",
    "foxtrot": "Frank"
  }
  result = result_table[val];

  return result;
}

phoneticLookup("charlie");
  • Testing Objects for Properties
function checkObj(obj, checkProp) {

  if obj.hasOwnProperty(checkProp) {
    return obj[checkProp];
  } else {
    return "Not Found",
  }

}
  • Manipulating Complex Objects
 var myMusic = [
  {
    "artist": "Billy Joel",
    "title": "Piano Man",
    "release_year": 1973,
    "formats": [
      "CD",
      "8T",
      "LP"
    ],
    "gold": true
  }, //comma
  // Add a record here
    {
    "artist": "Billy Joel",
    "title": "Piano Man 2",
    "release_year": 1974,
    "formats": [
      "CD",
      "8T",
      "LP"
    ],
    "gold": true
  }
];
  • Accessing Nested Objects
// Setup
var myStorage = {
  "car": {
    "inside": {
      "glove box": "maps",
      "passenger seat": "crumbs"
     },
    "outside": {
      "trunk": "jack"
    }
  }
};

var gloveBoxContents = myStorage.car.inside["glove box"]; 
  • Accessing Nested Arrays
// Setup
var myPlants = [
  {
    type: "flowers",
    list: [
      "rose",
      "tulip",
      "dandelion"
    ]
  },
  {
    type: "trees",
    list: [
      "fir",
      "pine",
      "birch"
    ]
  }
];

var secondTree = myPlants[1].list[1]; // pine

3. Record Collection Exercise

Basic JavaScript: Record CollectionPassed

You are given a JSON object representing a part of your musical album collection. Each album has several properties and a unique id number as its key. Not all albums have complete information.

Write a function which takes an album's id (like 2548), a property prop (like "artist" or "tracks"), and a value (like "Addicted to Love") to modify the data in this collection.

If prop isn't "tracks" and value isn't empty (""), update or set the value for that record album's property.

Your function must always return the entire collection object.

There are several rules for handling incomplete data:

If prop is "tracks" but the album doesn't have a "tracks" property, create an empty array before adding the new value to the album's corresponding property.

If prop is "tracks" and value isn't empty (""), push the value onto the end of the album's existing tracks array.

If value is empty (""), delete the given prop property from the album.
function lookUpProfile(name, prop){
  for (var i =0; i <contacts.length; i++){
      if (contacts[i].firstName === name){
          if (contacts[i].hasOwnProperty(prop)){
              return contacts[i][prop]
          }
          return "No such property"
          }
      }
      return "No such contact"      
}