JavaScript: Creating methods

Wait… What’s a method?

Methods are functions that are used in specifically as part of an Object and is created in basically the exact same way. They allow you to:

  • Change Object property values
  • Make calculations based on object properties. Functions can only use parameters as input, but methods can make calculations with object properties.

In order to create a function you would do something like…

//A function is declared by creating a variable and then setting it equal to function(aVariable);
var timesTwo = function(number)
{
     return number*2;
}
//This is how the function is called and a value gets passed into it
timesTwo(2);

The code is saying you want to create a variable called timesTwo which is a function and it takes input called number. The function will take whatever ‘number’ is return it’s value after being multiplied times two.

In order to create a method, you define what Object you want the method to branch from and then define the name of the method itself by using objectsName.methodName. 

//This is the object being declared and it has a property called occupation
var Grim = new Object();
Grim.Occupation = Reaper;

//This is how the method is created - Just like a function.
//Grim's occupation is pretty... grim, so this will let us change it.
Grim.setOccupation = function(newOccupation) {
     Grim.Occupation = newOccupation;
}
//here we call the method and change Grim's job to Flower Delivery!
Grim.setOcccupation("Flower Delivery");

Methods have the ability to be used for multiple Objects, not just one. This means that if I wanted give Hades a new occupation instead of being the lord of the underworld, I could! The trick to get a method to be used for more than one type of object is to use the keyword “this”

//Here is Grim again
var Grim = new Object();
Grim.Occupation = Reaper;
//Here is Hades, written slightly different but with the same effect.
var Hades = {
     Occupation: "Ruler of the UnderWorld, dun dun dunnnn"
};

//This is the method that will let us change their occupations
//Instead of saying Grim.setOccupation, we name ONLY the method and then use the "this" keyword inside it. 
//This lets us use it for more than one type of Object.
var setOccupation = function (newOccupation){
     this.Occupation = newOccupation;
};

Grim.setOccupation("Flower Delivery");
Hades.setOccupation("Professional balloon crafter");

The keyword “this”, if used inside of a method that has the Object declared alongside it, can be used as a placeholder solely within the method. “What’s the use of that?” you say, well, if you have a complicated name for your function or if you just want to cut time off typing – it can help a lot!

var thirdRectangle = new Object();
thirdRectangle.height = 1;
thirdRectangle.width = 2;

thirdRectangle.setWidth = function (newWidth) {
     this.setWidth = newWidth;
}

Methods, like functions, allow you to return values from them

square.sideLength = function() {
     return this.sideLength * this.sideLength;
}
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s