OBJECT-ORIENTED JAVASCRIPT REFERENCE

// strings 

var name = "Nicholas"; 
var selection = "a"; 

// numbers 

var count = 25; 
var cost = 1.51; 

// boolean 

var found = true; 

// null 

var object = null; 

// undefined 

var flag = undefined; 
var ref;     // assigned undefined automatically

Identifying Primitive Types

console.log( typeof "Nicholas");         // "string" 
console.log( typeof 10);             // "number" 
console.log( typeof 5.1);         // "number" 
console.log( typeof true);         // "boolean" 
console.log( typeof undefined);         // "undefined"
console.log( typeof null);         // "object"

Other Comparisons

console.log( value = = = null);         // true or false
console.log("5" = = 5);             // true 
console.log("5" = = = 5);             // false 
console.log( undefined = = null);        // true 
console.log( undefined = = = null);     // false

Primitive Methods

var name = "Nicholas"; 
var lowercaseName = name.toLowerCase();     // convert to lowercase 
var firstLetter = name.charAt( 0);         // get first character 
var middleOfName = name.substring( 2, 5);     // get characters 2-4 

var count = 10; 
var fixedCount = count.toFixed( 2);         // convert to "10.00" 
var hexCount = count.toString( 16);         // convert to "a" 

var flag = true;     
var stringFlag = flag.toString();             // convert to "true"

Reference Types

var object1 = new Object(); 
var object2 = object1;

var object1 = new Object(); 
// do something 
object1 = null;     // dereference

Properties

var object1 = new Object(); 
var object2 = object1; 
object1. myCustomProperty = "Awesome!"; 
console.log( object2. myCustomProperty);     // "Awesome!"

instantiate Built-In Reference Types

var items = new Array(); 
var now = new Date(); 
var error = new Error("Something bad happened."); 
var func = new Function("console.log('Hi');"); 
var object = new Object(); 
var re = new RegExp("\\d+");

Create Object Literals

var book = { 
name: "The Principles of Object-Oriented JavaScript", 
year: 2014
};

Equals

var book = new Object(); 
book.name = "The Principles of Object-Oriented JavaScript"; 
book.year = 2014;

Array Literals

var colors = [ "red", "blue", "green" ]; 
console.log( colors[ 0]);         // "red"
Equals

var colors = new Array("red", "blue", "green") ;
console.log( colors[ 0]);         // "red"

Function Literals

function reflect( value) { 
return value; 
} 

Equals

var reflect = new Function("value", "return value;");

Regular Expression Literals

var numbers = /\ d +/g; 

Equals

var numbers = new RegExp("\\d+", "g");

Identifying Reference Types

function reflect( value) { 
return value; 
} 

console.log( typeof reflect);     // "function"

-------------------------------------------------------------------

var name = new String("Nicholas"); 
var count = new Number( 10); 
var found = new Boolean( false); 

console.log( typeof name);     // "object" 
console.log( typeof count);     // "object" 
console.log( typeof found);     // "object"

-------------------------------------------------------------------

var items = []; 
var object = {}; 

function reflect( value) { 
return value; 
} 

console.log( items instanceof Array);         // true 
console.log( items instanceof Object);         // true 
console.log( object instanceof Object);         // true 
console.log( object instanceof Array);         // false 
console.log( reflect instanceof Function);     // true 
console.log( reflect instanceof Object);         // true

-------------------------------------------------------------------

var name = "Nicholas"; 
var count = 10; 
var found = false;

console.log( name instanceof String);         // false 
console.log( count instanceof Number);         // false 
console.log( found instanceof Boolean);         // false

isArray() Method

var items = []; 

console.log( Array.isArray( items));     // true

Primitive Wrappers

var name = "Nicholas"; 
var firstChar = name.charAt( 0); 

console.log( firstChar);     // "N"

Behind the Scenes

// what the JavaScript engine does 

var name = "Nicholas"; 
var temp = new String( name); 
var firstChar = temp.charAt( 0); 
temp = null; 
console.log( firstChar);     // "N"

Function Declaration

function add( num1, num2) { 
return num1 + num2; 
}

Function Expression

var add = function( num1, num2) { 
return num1 + num2; 
};

Function as Value

function sayHi() { 
console.log("Hi!"); 
} 

sayHi(); //     outputs "Hi!" 

var sayHi2 = sayHi; 

sayHi2();     // outputs "Hi!"

Passing Function to a Function

var numbers = [ 1, 5, 8, 4, 7, 10, 2, 6 ]; 

numbers.sort( function( first, second) { 
return first - second; 
}); 

console.log( numbers);         // "[ 1, 2, 4, 5, 6, 7, 8, 10]"

Using Arguments

function reflect( value) { 
return value; 
} 

console.log( reflect("Hi!"));     // "Hi!" 
console.log( reflect("Hi!", 25));     // "Hi!" 
console.log( reflect.length);     // 1 

-------------------------------------------------------------------

reflect = function() { 
return arguments[ 0]; 
};

console.log( reflect("Hi!"));     // "Hi!" 
console.log( reflect("Hi!", 25));     // "Hi!" 
console.log( reflect.length);     // 0

-------------------------------------------------------------------


function sum() { 
var result = 0, i = 0, len = arguments.length; 

while (i < len) { 
result + = arguments[ i]; 
i ++; 
} 

return result; 
} 

console.log( sum( 1, 2));     // 3 
console.log( sum( 3, 4, 5, 6));     // 18 
console.log( sum( 50));         // 50 
console.log( sum());         // 0

Object Methods

var person = { 
name: "Nicholas", 
sayName: function() { 
console.log( person.name); 
} 
}; 

person.sayName();     // outputs "Nicholas"

this Object

var person = { 
name: "Nicholas", 
sayName: function() { 
console.log( this.name); 
} 
};

person.sayName();     // outputs "Nicholas"

-------------------------------------------------------------------

function sayNameForAll() { 
console.log( this.name); 
} 

var person1 = { 
name: "Nicholas", 
sayName: sayNameForAll 
}; 

var person2 = { 
name: "Greg", 
sayName: sayNameForAll 
}; 

var name = "Michael"; 

person1. sayName();     // outputs "Nicholas" 
person2. sayName();     // outputs "Greg" 
sayNameForAll();     // outputs "Michael"

call() Method

function sayNameForAll( label) { 
console.log( label + ":" + this.name); 
} 

var person1 = { 
name: "Nicholas" 
}; 

var person2 = { 
name: "Greg" 
}; 

var name = "Michael"; 

sayNameForAll.call( this, "global");         // outputs "global:Michael" 
sayNameForAll.call( person1, "person1");     // outputs "person1: Nicholas" 
sayNameForAll.call( person2, "person2");     // outputs "person2: Greg"

apply() Method

function sayNameForAll( label) { 

console.log( label + ":" + this.name); 
} 

var person1 = { 
name: "Nicholas" 
}; 

var person2 = { 
name: "Greg" 
}; 

var name = "Michael"; 

sayNameForAll.apply( this, ["global"]);         // outputs "global:Michael" 
sayNameForAll.apply( person1, ["person1"]);     // outputs "person1: Nicholas" 
sayNameForAll.apply( person2, ["person2"]);     // outputs "person2: Greg"

bind() Method

function sayNameForAll( label) { 
console.log( label + ":" + this.name); 
} 

var person1 = { 
name: "Nicholas" 
}; 

var person2 = { 
name: "Greg" 
}; 

// create a function just for person1 

var sayNameForPerson1 = sayNameForAll.bind( person1); 
sayNameForPerson1("person1");     // outputs "person1: Nicholas"

// create a function just for person2 

var sayNameForPerson2 = sayNameForAll.bind( person2, "person2"); 
sayNameForPerson2();         // outputs "person2: Greg" 

// attaching a method to an object doesn't change 'this' 

person2. sayName = sayNameForPerson1; 
person2. sayName("person2");         // outputs "person2: Nicholas"

Using in

var person1 = { 
name: "Nicholas", 
sayName: function() { 
console.log( this.name); 
} 
}; 

console.log("name" in person1);             // true 
console.log( person1. hasOwnProperty("name"));     // true 
console.log("toString" in person1);             // true 
console.log( person1. hasOwnProperty("toString"));     // false

Removing Properties

var person1 = { 
name: "Nicholas" 
}; 

console.log("name" in person1);     // true 

delete person1. name;             // true - not output 

console.log("name" in person1);     // false 
console.log( person1. name);         // undefined

Enumeration

var property; 

for (property in object) { 
console.log("Name: " + property); 
console.log("Value: " + object[ property]); 
}

Using Object.keys()

var properties = Object.keys( object); 

// if you want to mimic for-in behavior 

var i, len; 

for (i = 0, len = properties.length; i < len; i ++){ 
console.log("Name: " + properties[ i]); 
console.log("Value: " + object[ properties[ i]]); 
}

Using propertyIsEnumerable()

var person1 = { 
name: "Nicholas" 
}; 

console.log("name" in person1);             // true 
console.log( person1. propertyIsEnumerable("name"));     // true 

var properties = Object.keys( person1); 

console.log("length" in properties);                 // true 
console.log( properties.propertyIsEnumerable("length"));     // false

Getter and Setter

var person1 = { 
_name: "Nicholas", 

get name() { 
console.log("Reading name"); 
return this. _name; 
}, 

set name( value) { 
console.log("Setting name to %s", value); 
this. _name = value; 
} 
}; 

console.log( person1. name);     // "Reading name" then "Nicholas" 

person1. name = "Greg"; 

console.log( person1. name);     // "Setting name to Greg" then "Greg"

Nonenumerable and Nonconfigurable

var person1 = { 
name: "Nicholas" 
}; 

Object.defineProperty( person1, "name", { 
enumerable: false 
}); 

console.log("name" in person1);             // true 
console.log( person1. propertyIsEnumerable("name"));     // false 

var properties = Object.keys( person1); 

console.log( properties.length);         // 0

Object.defineProperty(person1, "name", { 
configurable: false 
}); 

// try to delete the Property 

delete person1. name; 

console.log("name" in person1);     // true 
console.log( person1. name);         // "Nicholas" 

Object.defineProperty( person1, "name", {     // error!!! 
configurable: true 
});

Object.defineProperty() Method

var person1 = {}; 

Object.defineProperty( person1, "name", { 
value: "Nicholas", 
enumerable: true, 
configurable: true, 
writable: true 
});

-------------------------------------------------------------------

var person1 = {}; 

Object.defineProperty(person1, "name", { 
value: "Nicholas" 
}); 

console.log("name" in person1);             // true 
console.log( person1. propertyIsEnumerable("name"));     // false 

delete person1. name; 

console.log("name" in person1);             // true 

person1. name = "Greg"; 

console.log( person1. name);         // "Nicholas"

-------------------------------------------------------------------

var person1 = { 
_name: "Nicholas" 
}; 

Object.defineProperty( person1, "name", { 
get: function() {
 console.log("Reading name"); 
return this. _name; 
        }, 
set: function( value) { 
console.log("Setting name to %s", value); 
this. _name = value; 
}, 
enumerable: true, 
configurable: true 
});

-------------------------------------------------------------------

var person1 = { 
_name: "Nicholas" 
}; 

Object.defineProperty( person1, "name", { 
get: function() { 
console.log("Reading name"); 
return this. _name; 
} 
}); 

console.log("name" in person1);             // true 
console.log( person1. propertyIsEnumerable("name"));     // false 

delete person1. name; 

console.log("name" in person1);     // true 

person1. name = "Greg"; 

console.log( person1. name);         // "Nicholas"

Defining Multiple Properties

var person1 = {}; 

Object.defineProperties( person1, { 
// data property to store data 
_name: { 
value: "Nicholas", 
enumerable: true, 
configurable: true, 
writable: true }, 
// accessor property 
name: { 
get: function() { 
console.log("Reading name"); 
return this. _name; }, 
set: function( value) { 
console.log("Setting name to %s", value); 
this. _name = value;
}, 
enumerable: true,
 configurable: true 
} 
});

Retrieving Property Attributes

var person1 = { 
name: "Nicholas" 
}; 

var descriptor = Object.getOwnPropertyDescriptor( person1, "name"); 

console.log( descriptor.enumerable);     // true
console.log( descriptor.configurable);     // true 
console.log( descriptor.writable);     // true 
console.log( descriptor.value);         // "Nicholas"

Preventing Extensions

var person1 = { 
name: "Nicholas" 
};

console.log( Object.isExtensible( person1));     // true 

Object.preventExtensions( person1); 

console.log( Object.isExtensible( person1));     // false 

person1. sayName = function() { 
console.log( this.name); 
}; 

console.log("sayName" in person1);     // false

Object.isSealed() Method

var person1 = { 
name: "Nicholas" 
}; 

console.log( Object.isExtensible( person1));     // true 
console.log( Object.isSealed( person1));         // false 

Object.seal( person1); 

console.log( Object.isExtensible( person1));     // false 
console.log( Object.isSealed( person1));         // true 

person1. sayName = function() { 
console.log( this.name); 
}; 

console.log("sayName" in person1);     // false 

person1. name = "Greg"; 

console.log( person1. name);         // "Greg" 

delete person1. name; 

console.log("name" in person1);     // true 
console.log( person1. name);         // "Greg"

var descriptor = Object.getOwnPropertyDescriptor( person1, "name"); 

console.log( descriptor.configurable);     // false

Freezing Objects

var person1 = {
name: "Nicholas"
}; 

console.log( Object.isExtensible( person1));     // true 
console.log( Object.isSealed( person1));         // false 
console.log( Object.isFrozen( person1));         // false 

Object.freeze( person1); 

console.log( Object.isExtensible( person1));     // false 
console.log( Object.isSealed( person1));         // true 
console.log( Object.isFrozen( person1));         // true 

person1. sayName = function() { 
console.log( this.name); 
}; 

console.log("sayName" in person1);     // false 

person1. name = "Greg"; 

console.log( person1. name);         // "Nicholas" 

delete person1. name; 

console.log("name" in person1);     // true 
console.log( person1. name);         // "Nicholas" 

var descriptor = Object.getOwnPropertyDescriptor( person1, "name"); 
console.log( descriptor.configurable);     // false 
console.log( descriptor.writable);     // false

Constructors

function Person() { 
// intentionally empty 
}

var person1 = new Person(); 
var person2 = new Person();

console.log( person1 instanceof Person);     // true 
console.log( person2 instanceof Person);     // true

console.log( person1. constructor = = = Person);     // true 
console.log( person2. constructor = = = Person);     // true

-------------------------------------------------------------------

function Person( name) { 
this.name = name; 
this.sayName = function() { 
console.log( this.name); 
}; 
}

var person1 = new Person("Nicholas"); 
var person2 = new Person("Greg"); 

console.log( person1. name);     // "Nicholas" 
console.log( person2. name);     // "Greg" 

person1. sayName();         // outputs "Nicholas" 
person2. sayName();         // outputs "Greg"

-------------------------------------------------------------------

function Person( name) { 
Object.defineProperty( this, "name", { 
get: function() { return name; }, 
set: function( newName) {
name = newName; 
}, 
enumerable: true, 
configurable: true 
}); 
this.sayName = function() { 
console.log( this.name); 
}; 
}

Missing ‘new’

var person1 = Person("Nicholas");     // note: missing "new" 

console.log( person1 instanceof Person);     // false 
console.log( typeof person1);             // "undefined" 
console.log( name);                 // "Nicholas"

Prototypes

var book = { 
title: "The Principles of Object-Oriented JavaScript"
}; 

console.log("title" in book);                     // true 
console.log( book.hasOwnProperty("title"));             // true 
console.log("hasOwnProperty" in book);                 // true 
console.log( book.hasOwnProperty("hasOwnProperty"));     // false 
console.log( Object.prototype.hasOwnProperty("hasOwnProperty"));     // true

Identifying a Prototype Property

function hasPrototypeProperty( object, name) { 
return name in object && !object. hasOwnProperty( name); 
} 

console.log( hasPrototypeProperty( book, "title"));         // false 
console.log( hasPrototypeProperty( book, "hasOwnProperty"));     // true

-------------------------------------------------------------------

var object = {}; 

var prototype = Object.getPrototypeOf( object); 

console.log( prototype = = = Object.prototype);         // true

-------------------------------------------------------------------

var object = {}; 

console.log( Object.prototype.isPrototypeOf( object));     // true

-------------------------------------------------------------------

var object = {}; 

console.log( object.toString());     // "[ object Object]" 

object.toString = function() { 
return "[ object Custom]"; 
}; 

console.log( object.toString());     // "[ object Custom]" 

// delete own property 

delete object.toString; 

console.log( object.toString());     // "[ object Object]" 

// no effect - delete only works on own properties 

delete object.toString; 

console.log( object.toString());     // "[ object Object]"

Using Prototypes with Constructors

function Person( name) { 
this.name = name; 
} 

Person.prototype.sayName = function() { 
console.log( this.name); 
}; 

var person1 = new Person("Nicholas"); 
var person2 = new Person("Greg"); 

console.log( person1. name);     // "Nicholas" 
console.log( person2. name);     // "Greg" 

person1. sayName();     // outputs "Nicholas" 
person2. sayName();     // outputs "Greg"

-------------------------------------------------------------------

function Person( name) { 
this.name = name; 
} 

Person.prototype.sayName = function() { 
console.log( this.name); 
}; 

Person.prototype.favorites = []; 

var person1 = new Person("Nicholas"); 
var person2 = new Person("Greg"); 

person1. favorites.push("pizza"); 
person2. favorites.push("quinoa"); 

console.log( person1. favorites);     // "pizza, quinoa" 
console.log( person2. favorites);     // "pizza, quinoa"

Replacing the Prototype with an Object Literal

function Person( name) { 
this.name = name; 
} 

Person.prototype = { 
sayName: function() { 
console.log( this.name); 
}, 
toString: function() { 
return "[ Person " + this.name + "]"; 
} 
};

var person1 = new Person("Nicholas"); 

console.log( person1 instanceof Person);     // true 
console.log( person1. constructor = = = Person);     // false 
console.log( person1. constructor = = = Object);     // true

-------------------------------------------------------------------

function Person( name) { 
this.name = name; 
} 

Person.prototype = { 
constructor: Person, 
sayName: function() { 
console.log( this.name); 
}, 
toString: function() { 
return "[ Person " + this.name + "]"; 
} 
}; 

var person1 = new Person("Nicholas"); 
var person2 = new Person("Greg"); 

console.log( person1 instanceof Person);     // true
console.log( person1. constructor = = = Person);     // true 
console.log( person1. constructor = = = Object);     // false 
console.log( person2 instanceof Person);     // true 
console.log( person2. constructor = = = Person);     // true 
console.log( person2. constructor = = = Object);     // false

Changing Prototypes

function Person( name) { 
this.name = name; 
} 

Person.prototype = { 
constructor: Person, 
sayName: function() { 
console.log( this.name); 
}, 
toString: function() { 
return "[ Person " + this.name + "]"; 
} 
}; 

var person1 = new Person("Nicholas");
var person2 = new Person("Greg"); 

console.log("sayHi" in person1);         // false 
console.log("sayHi" in person2);         // false 

// add a new method 

Person.prototype.sayHi = function() { 
console.log(" Hi"); 
}; 

person1. sayHi();     // outputs "Hi" 
person2. sayHi();     // outputs "Hi"

Built-in Object Prototypes

Array.prototype.sum = function() { 
return this.reduce( function( previous, current) { 
return previous + current;
}); 
}; 

var numbers = [ 1, 2, 3, 4, 5, 6 ]; 
var result = numbers.sum(); 

console.log( result);     // 21

-------------------------------------------------------------------

String.prototype.capitalize = function() { 
return this.charAt( 0). toUpperCase() + this.substring( 1); 
}; 

var message = "hello world!"; 

console.log( message.capitalize());     // "Hello world!"

Object.prototype Method

var book = { 
title: "The Principles of Object-Oriented JavaScript"
}; 

var prototype = Object.getPrototypeOf( book); 

console.log( prototype = = = Object.prototype);     // true

Modifying Object.prototype

Object.prototype.add = function( value) { 
return this + value; 
}; 

var book = { 
title: "The Principles of Object-Oriented JavaScript" 
}; 

console.log( book.add( 5));     // "[ object Object] 5" 
console.log("title". add("end"));     // "titleend" 

// in a web browser 

console.log( document.add( true));     // "[ object HTMLDocument] true" 
console.log( window.add( 5));         // "[ object Window] true"

-------------------------------------------------------------------

var book = { 
title: "The Principles of Object-Oriented JavaScript" }; 

// is the same as 

var book = Object.create( Object.prototype, { title: { 
configurable: true, 
enumerable: true, 
value: "The Principles of Object-Oriented JavaScript", writable: true 
      } 
});

Object.create(). Method

var person1 = { 
name: "Nicholas", 
sayName: function() { 
console.log( this.name); 
} 
}; 

var person2 = Object.create( person1, { 
name: { 
configurable: true, 
enumerable: true, 
value: "Greg", writable: true 
} 
}); 

person1. sayName();     // outputs "Nicholas" 
person2. sayName();     // outputs "Greg" 

console.log( person1.hasOwnProperty("sayName"));     // true
console.log( person1. isPrototypeOf( person2));         // true 
console.log( person2.hasOwnProperty("sayName"));     // false