|
1 | | - |
| 1 | + |
2 | 2 |
|
3 | | -# Introduction to JavaScript |
| 3 | +# Introduction to "This" |
| 4 | + |
| 5 | +We've seen how functions can be used to give a name to a set of statements so that you can call them independently and how they can be assigned to variables and protected from the global scope. There's another use of functions that I would like to talk to you about. That brings up the keyword `this`. |
| 6 | + |
| 7 | +# Functions to Construct Objects |
| 8 | + |
| 9 | +Functions can also be used to construct objects to take advantage of JavaScript's object oriented capabilities. You can use a function to define the template of an object and then instantiate instances of that object using the `new` keyword. |
| 10 | + |
| 11 | +```js |
| 12 | +var example = function(str) { |
| 13 | + this.name = str; |
| 14 | +}; |
| 15 | +var exampleJudy = new example("Judy"); |
| 16 | +var exampleFred = new example("Fred"); |
| 17 | + |
| 18 | +console.log(exampleJudy.name); |
| 19 | +// "Judy" |
| 20 | + |
| 21 | +console.log(exampleFred.name); |
| 22 | +// "Fred" |
| 23 | +``` |
| 24 | + |
| 25 | +Using this approach, you can create objects that you can instantiate by calling a function with the `new` keyword to generate objects constructed out of properties based on the parameters you pass to the function. |
| 26 | + |
| 27 | +# Adding Methods to Constructors |
| 28 | + |
| 29 | +Objects constructed this way are not limited to properties. You can also create methods that can be executed, since in JavaScript, a method or a function is just a value that can be assigned to a variable. So, you can assign it to a single property of your new object. |
| 30 | + |
| 31 | +```js |
| 32 | +var example = function(str) { |
| 33 | + this.name = str; |
| 34 | + this.greet = function() { |
| 35 | + return("Hello, " + this.name); |
| 36 | + }; |
| 37 | +}; |
| 38 | +var exampleJudy = new example("Judy"); |
| 39 | +var exampleFred = new example("Fred"); |
| 40 | + |
| 41 | +console.log(exampleJudy.greet()); |
| 42 | +// "Hello, Judy" |
| 43 | +console.log(exampleFred.greet()); |
| 44 | +// "Hello, Fred" |
| 45 | +``` |
| 46 | + |
| 47 | +In this way, we can create objects in JavaScript that can have their own properties and their own methods. You can instantiate multiple independent instances of each of these objects and use them independently of each other. |
| 48 | + |
| 49 | +# Private and Public Properties |
| 50 | + |
| 51 | +We've talked a little bit about scope before in the context of the global scope and functional scope. But in an object-oriented context, JavaScript also respects the scope of variables that are declared inside of constructor functions. The variables that are declared with `var` in a constructor are considered private to the child objects and their own functions. |
| 52 | + |
| 53 | +This mean that if you want to create a variable that's going to be unique to each child object and not accessible to anything outside of that child object, you can declare it was a `var` inside of the constructor function for that object. |
| 54 | + |
| 55 | +```js |
| 56 | +var example = function(str) { |
| 57 | + var special = "Judy"; |
| 58 | + this.name = str; |
| 59 | + this.greet = function() { |
| 60 | + if (this.name === special) { |
| 61 | + return("Well, isn't that special?"); |
| 62 | + } else { |
| 63 | + return("Hello, " + this.name); |
| 64 | + } |
| 65 | + }; |
| 66 | +}; |
| 67 | +var exampleJudy = new example("Judy"); |
| 68 | +var exampleFred = new example("Fred"); |
| 69 | + |
| 70 | +console.log(exampleJudy.greet()); |
| 71 | +// "Well, isn't that special?" |
| 72 | +console.log(exampleJudy.special); |
| 73 | +// undefined |
| 74 | +console.log(exampleFred.greet()); |
| 75 | +// "Hello, Fred" |
| 76 | +console.log(exampleFred.special); |
| 77 | +// undefined |
| 78 | +``` |
| 79 | + |
| 80 | +Using this approach, we can see how we can use JavaScript as an object -orientated language to create template constructor functions and instantiate instances of those objects, and each of those instances can have public properties, public methods, and also private variables that can't be accessed outside of the instance. |
0 commit comments