17. this & methods // function parameter basics


#1


https://www.codecademy.com/en/courses/spencer-sandbox/2/5?curriculum_id=506324b3a7dffd00020bf661


Hello all, I am not really certain why I must add a statement of

bob.setAge = setAge;

before using bob.setAge(30); I believed the whole point of using the this.setAge was to prevent having to create dialogue specifying the setAge to the object of interest. Why I cannot just call bob.setAge(30) to begin with?

I tried to understand this as the bob object having no awareness of the setAge existing until you choose to allow it to borrow the setAge function by using the bob.setAge= setAge line. Is this an accurate way of understanding this?


Another question: when dealing with the Contact List assignment (follow that link to my help thread for that assignment), I was advised to think of the function parameters (newAge in this example) as a placeholder. It made sense to me in that contact list example because the words put in that () are never really referenced directly. However, in this example, the (newAge) is apparently important since it is later used inside the function.

Any way to clarify why it isn't just a placeholder in this case? Is it really just dependent on whether or not you use it later? If not used in the function later, could one choose to just leave nothing in that set of parentheses?

Thanks again friends ( and @nedwards ) for reading and replying to help my understanding! :slight_smile:


EDIT: In the next exercise (code to follow after this text), the "rectangle.setHeight = setHeight;" statement isn't necessary. Is it correct to believe this is because it is inherited from the fact that it limits the setHeight method to rectangle to begin with via the "rectangle.setHeight = function (newHeight) [...]" creation of the method in the first place? I think that is it and it makes sense to me if so.

var rectangle = new Object();
rectangle.height = 3;
rectangle.width = 4;
// here is our method to set the height
rectangle.setHeight = function (newHeight) {
this.height = newHeight;
};
// help by finishing this method
rectangle.setWidth = function (newWidth) {
this.width = newWidth;
};
rectangle.setHeight(6);
rectangle.setWidth(8);
// here change the width to 8 and height to 6 using our new methods


// here we define our method using "this", before we even introduce bob
var setAge = function (newAge) {
  this.age = newAge;
};
// now we make bob
var bob = new Object();
bob.age = 30;
bob.setAge = setAge;
  
// make susan here, and first give her an age of 25
var susan = {
    age: 25,
}
// here, update Susan's age to 35 using the method

susan.setAge = setAge;
susan.setAge(35);


#2

I am not really certain why I must add a statement of bob.setAge = setAge; before using bob.setAge(30);

Well if bob has no property of setAge that contains a function you'll just get the error that "undefined is not a function". Because a non-existing property is undefined by default and appending () to a variable or property means calling it as if it was a function, which is in this case impossible because it is not a function.

I believed the whole point of using the this.setAge was to prevent having to create dialogue specifying the setAge to the object of interest.

Not really, I guess the idea was to assign a function to an object property and see that it works and that a this. used inside of the function would now refer to that object instead of what it referred to before. For the start think of this. as a reference to the object containing the statement with the this.. So at first the:

    var setAge = function (newAge) {
      this.age = newAge;
    };

this. here probably refers to the window object or another toplevel object (that is not relevant here) but it does not refer to bob or susan or any other object created in the text field. Likewise bob is only an object with an age property that has no connection to the setAge function, all it really knows for sure is what is encapsulated in it. Now the interesting part comes when you assign the function to a property of bob. Because as said now the this would point to bob. Basically a function is just a value (in js almost everything is an object) and therefore assigning the function to setAge would be the same as writing:

bob.setAge = function(newAge){
    this.age = newAge;
}

or once bob has it's property you could make susan's by using susan.setAge = bob.setAge. I guess you mean the right thing when speaking of awareness and borrowing but in the end you just assign a value.

excourse

How is this setAge function of any use when you could just achieve the same much shorter by using:

bob.age = newAge;

Well in the process you'll learn how to build constructors, which are kind of blueprints for objects, which have the ability of private properties. This means that bob encapsulates an information of age but that information is not directly visible to the outside of the bob object therefore you need simple functions called getter and setter that just do this:

bob.getAge = function(){
    return bob.age
}

bob.setAge = function(newAge){
    bob.age=newAge
}

As said they are really simple but they let you restrict the possibility to corrupt the data of an object. It's just that this is not a good way to introduce this idea, because you could not add these methods to the object later (it would destroy the whole idea of private properties). So I guess in the end it is really just about adding functions as property values and getting to know this. a little better.

About function:
Well a function is a program inside a program and therefore has some specialties. For example it is not executed directly but needs a start command, then jumps to the code executes it and then returns to where it was started. Another specialty is that a function has it's own scope and it's own set of variable, sure you could do this with global variables but it might soon become messy. And one way to deal with this scope is by using parameters. When you use a variable name in the () after the function keyword it basically creates a local variable inside your function e.g.

var test = function(para){...

behaves almost the same as:

`var test = function(){{
var para;
...`

So your first question if you don't need further information you could keep it empty. Now the neat thing about having parameters is that you can pass information to the function meaning when you call the function by e.g. test(1) the 1 would be assigned to the para variable. This is nice because you can thereby call the same function multiple times but each time with another value of your parameter.

On your Edit: Yes that is correct, you already have the function implemented in your object and there is no global function setHeight anyway.

I hope this makes sense and is helpful
Good Luck


#3

@haxor789, Thanks a lot for taking the time out to write this for me. I think I am understanding it a lot better than before. Some parts are a bit confusing still, but I think it's partly because I am learning to much that the nuances haven't been entirely nailed down yet! ^^;

I've definitely bookmarked this for later reading. Thanks again!

-- @silasmao


#4

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.