Javascript: Objects in Review

Objects give us a way to represent things--IRL or virtual. We're able to do this by storing information within the object's properties.

So far, we have learned two ways to make objects:
// literal notation, where we use var Name = { }; 
var cutedork = {
    age: 18,
    country: "United States"
};

// constructor notation, where we use the keyword new
var cutedork2 = new Object(); 
    cutedork2.age = 18;
    cutedork2.country = "United States";

Remember what properties are? They're similar to variables... except that they belong to an object and hold information. We can access properties in two ways:

// dot notation, with ObjectName.PropertyName
var age = jenny.ages

// bracket notation, with ObjectName["PropertyName"] (--don't forget the quotes!)
var country = jenny['country']

Methods act like functions associated with an object and they're especially useful when you ether want to:
1. Update the object properties
2. Calculate something based on an object's properties

// example of defining area and perimeter methods
function Circle (radius) {
    this.radius = radius;
    this.area = function () {
        return Math.PI * this.radius * this.radius;
    };

function Perimeter (radius) {
    this.radius = radius;
    this.area = function() {
        return 2 * Math.PI * this.radius;
    };
}}

Lastly--in addition to our basic object constructor, we can create our own custom constructors which are helpful for two reasons:
1. We can assign our object properties through parameters we pass in when the object is created.
2. We can give our object methods automatically.

// 3 lines are required to make mdfrmscrtch
var mdfrmscrtch = new Object(); 
mdfrmscrtch.blogURL = "http://mdrmscrtch.blogspot.com";
mdfrmscrtch.creator = "Jenny"

// A custom constructor for blog
function Blog (blogURL, creator) {
    this.blogURL = blogURL;
    this.creator = creator;
}

// Use this new creator to make hello_cutedork in one line!
var hello_cutedork = new Blog("http://hellocutedork.blogspot.com", "Jenny");

Song of the day // Lucky Ones (Lana Del Rey)

Javascript: Combining Objects with Arrays, Loops, and Functions

a slice of coconut cake @ souen

Objects are just another type--like a string or number, but a bit more complex. So just as we can make arrays of strings and numbers, we can also makes arrays of objects:

// here, we have a person constructor:
function Person (name, age) {
    this.name = name;
    this.age = age;
};

// now we can make an array of people:
var family = new Array();
family[0] = new Person("jenny", 18);
family[1] = new Person("alex", 13);
family[2] = new Person("mom", 51);
family[3] = new Person("dad", 49);

Arrays filled with objects will work just like arrays filled with numbers and strings. In the same we we can loop through an array of numbers to print them out or to calculate a sum, we can loop through an array of objects and access properties or methods:

// loop through our new array and print out the name of each family member:
for (i = 0; i < family.length; i++ )
{console.log(family[i].name)
};

We can also use objects as parameters for functions as well. That way, we can take advantage of the methods and properties that a certain object type provides. In addition to our Person constructor, we have also introduced a new function, ageDifference. This function takes two Person objects as parameters and returns the difference in age between the two people:

// create var ageDifference
var ageDifference = function(person1, person2) {
    return person1.age - person2.age;
};

// create multiple example people
var jenny = new Person("Jenny", 18);
var alex = new Person("Alex", 13);

// create new variable diff
var diff = ageDifference(jenny, alex);

Javascript: Intro to Objects

homemade meatballs using Chef John's recipe

We finally get to use 'nouns' and 'verbs' together!!! In Javascript, let's think of 'nouns' as data such as arrays, variables, strings, etc. and 'verbs' as functions... With objects, we can finally put the two--our information and the function that uses our information, together in the same place. REUNITED AT LAST!

// here is a short code:

var blogEntry = {};

blogEntry.name = 'Jenny';
blogEntry.URL = 'thecutedork.blogspot.com';
blogEntry.blog = function(){
  console.log('Check out ' + this.name + ' at ' + this.URL + '...');
};

blogEntry.blog();