Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Understanding "this" in JavaScript

Hazim Bora Alap
Hazim Bora Alap
15,001 Points

Not a Question, but I wanted to point out something.

Using Portland as a default fall back city name, and using it as a new element in the example was really confusing. I totally understood I believe but I had to watch twice to catch that.

If I'm wrong please let me know because that means I missed something then.

2 Answers

John Kumar
John Kumar
13,937 Points

I believe that you were talking about the constructor.js file that the instructor was working on during the video. I understand that it can be quite confusing and when he uses the term portland several times this makes things worse. Let's take a look at the code:

var City = function(name, state) { this.name = name || 'Portland'; this.state = state || 'Oregon'; this.printMyCityAndState = function() { console.log("My city is " + this.name + ", and my state is " + this.state); }; };

portland = new City(); seattle = new City('Seattle', 'Washington'); salem = new City('Salem'); vancouver = new City('Vancouver', 'Washington');

portland.printMyCityAndState(); seattle.printMyCityAndState(); salem.printMyCityAndState(); vancouver.printMyCityAndState();

As you can see above, the instructor creates a constructor function with this.name and this.state. The constructor function also has a (name, state) parameter that can be filled in by the user or code writer. If the user or code writer does not invoke a parameter listed then the default parameters are 'Portland' and 'Oregon' are used.

The instructor used the portland city name as an object that is equal to the City() function as such:

portland = new City();

When called in the command portland.printMyCityAndState(); the portland object triggers off the City() function and prints the results so that it can be seen in the console. As you will see in the video, the results are Portland, Oregon.

The instructor used a fanciful way to illustrate the use of the word "this". When I first watched the video I felt the same way as everything that was being explained went too fast for me. But after reviewing the video two times I gained a greater understanding and appreciation for "this."

Hope this helps.

JK

ywang04
ywang04
6,762 Points
var City = function(name, state) {
    this.name = name || 'Portland';
    this.state = state || 'Oregon';
    this.printMyCityAndState = function() {
      console.log("My city is " + this.name + ", and my state is " + this.state);
    };
};

portland = new City();

The "portland" in lower case is just the instance(object) of City constructor while "Portland" with p in capital is the argument value passed to City constructor. They are totally different things. :)