object
constructors
Class overview
-
Homework Questions
- Scope
- Object Constructors
- Constructor arguments
- This
- Explicit return statements
SCOPE
- Scope in JavaScript is a hugely important concept.
- Understanding how scope works will help you make design decisions when writing your code.
- JavaScript has two scopes. Global and Local.
GLOBAL SCOPE
- Global scoped variables are available everywhere.
- Can get confusing having lots of global variables.
- Might be easier for small projects but will give you headaches for bigger projects.
- Can be overridden when a local variable has the same name.
- This is a bad practice. Keep your global & local variables named differently.
- Normally only objects & functions will be global, not primitives like numbers and booleans.
- There is ONE global scope that everything shares.
- In the browser, this is the Window object. In node, or other platforms, it's something else.
LOCAL SCOPE
- Local scopes designated by curly braces.
- However, curly braces alone do not create a local scope.
- Objects & Functions create a local scope.
- Variables in different local scopes can have the same name.
- This is useful for common variables like counters, parameters, etc.
- Global scoped variables are available in local scopes.
- A variable declared in one local scope is not accessible in another local scope.
- This is not a best practice. You want to use parameters to access variables from outside of a local scope.
OBJECT CONSTRUCTORS
- Allow you to create reproducible Objects
- Can use instanceof to check Object type
- Perfect for Objects that hold state
- Enables use of the 'this' keyword inside a function
- Used when you are creating a multiple objects that will have the same structure but different contents.
//constructor declaration
function CustomObject() {};
//using constructor to create an object
var myObj = new CustomObject();
myObj instanceof CustomObject;
// > true
OBJECT CONSTRUCTORS
- OOP Concept shoe-horned into JavaScript
- New objects initiated with the 'new' keyword & constructor function call.
//declare constructor function
function MyObject() { }
//create object with constructor
var myObj = new MyObject();
- Inside the constructor function, attach properties to the returning object by using the 'this' keyword.
OBJECT CONSTRUCTOR ARGUMENTS
- In OOP languages, constructor arguments are used to establish initial state for an object.
- In JavaScript, concept is the same, but implementation is weirder.
- Useful when using remote data to build custom objects.
//constructor declaration with constructor arguments
function MyObject(dataObj) {
this.data = dataObj;
}
//use the arguments like this:
var myObj = new MyObject({items : 4});
console.log(myObj.data.items);
// > 4
THIS
- Reserved keyword
- The 'this' variable always refers to the current object.
- Works in functions that are constructors, but not normal functions.
EXPLICIT OBJECT RETURN
- By default, constructors return the built object.
- By adding an explicit return statement, you can control what is returned when a constructor is called.
function MyObject() {
return {
items : 3,
count : function(num) {
console.log(num);
}
}
}
cool js thing for the day
Browser based IDE for JavaScript, Node, PHP, Java, Ruby, and more.
AJS Lecture 7: Object Constructors
By Ryan Lewis
AJS Lecture 7: Object Constructors
- 719