dd3141592 · January 7, 2016 21:18
diff --git a/CH3.html b/CH3.html
 <!DOCTYPE html>
 <html>
 <head>
 <meta name="CH 3 Literals and Constructors" content="Javascript Patterns">
  <meta charset="utf-8">
  <title>JS Bin</title>
 </headJavascript patterns 
 <body>
 Javascript Patterns, by Stoyan Stefanov (O'Reilly). Copyright 2010 Yahoo!, Inc., 9780596806750.
 <script id="jsbin-javascript">
 //My crib notes from "JavaScript Patterns" by Stoyan Stefanov 
 //Chapter 3 Literals and Constructors
 //includes some examples too
 //you will need to buy the book - these notes are sketchy and for review & reference only


 "use strict";
 //object literals

 //can add, change and delete methods and properties 
 var dog = {
  name: 'toto',
  say: function(){
    return 'woof!';
  }
 };
 dog.fleas = true;
 console.log(dog);

 delete dog.name;


 console.log(dog);

 dog.say = function(){
  return 'aarf aarf';
 };

 console.log(dog.say());

 //Objects from a constructor
 // no classes in javascript!!  yay!
 // but there are constructors - to create objects with
 // Object(), Date(), String()

 //anti-pattern
 // blurs distinction that objects are mutable hashes vs a baked item from //a recipe
 //also interpreter needs to go up the scope chain to find the global Object constructor
 var car = new Object();
 car.goes = true;

 //do this instead
 //use object literal
 var car2 = {
  goes: true
 };


 //Customer constructors 
 // are functions
 // when called empty object created referenced by 'this' variable
 //props and methods added to 'this' variable
 //new object referenced by 'this' returned implicitly
 //if no other object returned explicitly

 //can add functions to the prototype of the constructor - saves not having multiple copies of functions for each object created

 //  Person.prototype.say = function(){
 // return "I, " + this.name + "am an awesome human being!"
 //};
 // so any object created is actually not empty but it inherits from Person.prototype

 //can return any object explicitly from custom constructor if desired


 //example
 var Maker = function(){
  this.name = "Dorothy";
  var that = {};
  that.name = "I am the great and powerful OZ!!";
  //that must be an object not a string or boolean for example - otherwise this returned anyway
  return that; 
 };
 var o = new Maker();
 console.log(o.name);

 //if you forget new when calling the constructor (that returns implicit this) - this will refer to the global object
 //anti - pattern example
 var Maker2 = function(){
  this.name = "Dorothy";
 };
 var p = Maker2();
 console.log(typeof p);
 //p is the global object and you have polluted global namespace!!  BAAAAD
 console.log(window.name);

 //ECMAScript 5 fixes this problem above

 //best ways to handle possible missing 'new' is to return a 'that' variable or an object literal.
 //however returning 'that'  - won't have prototype chain of 'this'

 //Self - invoking constructor
 // question - so how can you get around the problem of omitting new by accident and still inherit the prototype chain?

 var Maker3 = function(){
  if(!(this instanceof Maker3)){
    return new Maker3();
  }
    this.says = "There's no place like home!";
    this.song = "We're off to see the wizard";
 };
 Maker3.prototype.walk = function(){
    return this.song;
 };
 var p1 = Maker3(),
    p2 = new Maker3();

 console.log(p1.says);            
 console.log(p2.says);            


 console.log(p1.walk());            
 console.log(p2.walk());

 //Array literals
 // anti-pattern - using the Array constructor
 var a = new Array("good witch","wicked witch");
 //instead:
 var a = ["good witch","wicked witch"];

 //what's another of the Array() oddities?
 var b = new Array(3);
 console.log(b.join(" ") + "this is the end my friend");

 //make a shim for Array.isArray() if not defined
 if(typeof Array.isArray === "undefined"){
  Array.isArray = function(arg){
    return Object.prototype.toString.call(arg) === "[object Array]";
  };
 }

 console.log(Object.prototype.toString.call(a));
 console.log(Array.isArray(a));

 //JSON
 //JSON strings cannot use functions or regular expression literals
 var jsonString = '{"key":"DDvalue"}';

 //to return an object
 //anti-pattern ;
 var data = eval( '(' + jsonString + ')');
 console.log(data.key);

 //if ES5 use;
 var data = JSON.parse(jsonString);
 console.log(data.key);
 //otherwise use jQuery.parseJSON

 //there's also JSON.stringify - which serializes to JSON

 //regular expressions
 //anti-pattern:   new RegExp()  //unless creating a string at runtime

 //use instead:  literal regular expression
 // example:  var re = /\\/gm;
 </script>



 <script id="jsbin-source-javascript" type="text/javascript">//My crib notes from "JavaScript Patterns" by Stoyan Stefanov 
 //Chapter 3 Literals and Constructors
 //includes some examples too
 //you will need to buy the book - these notes are sketchy and for review & reference only


 "use strict";
 //object literals

 //can add, change and delete methods and properties 
 var dog = {
  name: 'toto',
  say: function(){
    return 'woof!';
  }
 };
 dog.fleas = true;
 console.log(dog);

 delete dog.name;


 console.log(dog);

 dog.say = function(){
  return 'aarf aarf';
 };

 console.log(dog.say());

 //Objects from a constructor
 // no classes in javascript!!  yay!
 // but there are constructors - to create objects with
 // Object(), Date(), String()

 //anti-pattern
 // blurs distinction that objects are mutable hashes vs a baked item from //a recipe
 //also interpreter needs to go up the scope chain to find the global Object constructor
 var car = new Object();
 car.goes = true;

 //do this instead
 //use object literal
 var car2 = {
  goes: true
 };


 //Customer constructors 
 // are functions
 // when called empty object created referenced by 'this' variable
 //props and methods added to 'this' variable
 //new object referenced by 'this' returned implicitly
 //if no other object returned explicitly

 //can add functions to the prototype of the constructor - saves not having multiple copies of functions for each object created

 //  Person.prototype.say = function(){
 // return "I, " + this.name + "am an awesome human being!"
 //};
 // so any object created is actually not empty but it inherits from Person.prototype

 //can return any object explicitly from custom constructor if desired


 //example
 var Maker = function(){
  this.name = "Dorothy";
  var that = {};
  that.name = "I am the great and powerful OZ!!";
  //that must be an object not a string or boolean for example - otherwise this returned anyway
  return that; 
 };
 var o = new Maker();
 console.log(o.name);

 //if you forget new when calling the constructor (that returns implicit this) - this will refer to the global object
 //anti - pattern example
 var Maker2 = function(){
  this.name = "Dorothy";
 };
 var p = Maker2();
 console.log(typeof p);
 //p is the global object and you have polluted global namespace!!  BAAAAD
 console.log(window.name);

 //ECMAScript 5 fixes this problem above

 //best ways to handle possible missing 'new' is to return a 'that' variable or an object literal.
 //however returning 'that'  - won't have prototype chain of 'this'

 //Self - invoking constructor
 // question - so how can you get around the problem of omitting new by accident and still inherit the prototype chain?

 var Maker3 = function(){
  if(!(this instanceof Maker3)){
    return new Maker3();
  }
    this.says = "There's no place like home!";
    this.song = "We're off to see the wizard";
 };
 Maker3.prototype.walk = function(){
    return this.song;
 };
 var p1 = Maker3(),
    p2 = new Maker3();

 console.log(p1.says);            
 console.log(p2.says);            


 console.log(p1.walk());            
 console.log(p2.walk());

 //Array literals
 // anti-pattern - using the Array constructor
 var a = new Array("good witch","wicked witch");
 //instead:
 var a = ["good witch","wicked witch"];

 //what's another of the Array() oddities?
 var b = new Array(3);
 console.log(b.join(" ") + "this is the end my friend");

 //make a shim for Array.isArray() if not defined
 if(typeof Array.isArray === "undefined"){
  Array.isArray = function(arg){
    return Object.prototype.toString.call(arg) === "[object Array]";
  };
 }

 console.log(Object.prototype.toString.call(a));
 console.log(Array.isArray(a));

 //JSON
 //JSON strings cannot use functions or regular expression literals
 var jsonString = '{"key":"DDvalue"}';

 //to return an object
 //anti-pattern ;
 var data = eval( '(' + jsonString + ')');
 console.log(data.key);

 //if ES5 use;
 var data = JSON.parse(jsonString);
 console.log(data.key);
 //otherwise use jQuery.parseJSON

 //there's also JSON.stringify - which serializes to JSON

 //regular expressions
 //anti-pattern:   new RegExp()  //unless creating a string at runtime

 //use instead:  literal regular expression
 // example:  var re = /\\/gm;













 </script></body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta name="CH 3 Literals and Constructors" content="Javascript Patterns">
	<meta charset="utf-8">
	<title>JS Bin</title>
	</headJavascript patterns
	<body>
	Javascript Patterns, by Stoyan Stefanov (O'Reilly). Copyright 2010 Yahoo!, Inc., 9780596806750.
	<script id="jsbin-javascript">
	//My crib notes from "JavaScript Patterns" by Stoyan Stefanov
	//Chapter 3 Literals and Constructors
	//includes some examples too
	//you will need to buy the book - these notes are sketchy and for review & reference only


	"use strict";
	//object literals

	//can add, change and delete methods and properties
	var dog = {
	name: 'toto',
	say: function(){
	return 'woof!';
	}
	};
	dog.fleas = true;
	console.log(dog);

	delete dog.name;


	console.log(dog);

	dog.say = function(){
	return 'aarf aarf';
	};

	console.log(dog.say());

	//Objects from a constructor
	// no classes in javascript!! yay!
	// but there are constructors - to create objects with
	// Object(), Date(), String()

	//anti-pattern
	// blurs distinction that objects are mutable hashes vs a baked item from //a recipe
	//also interpreter needs to go up the scope chain to find the global Object constructor
	var car = new Object();
	car.goes = true;

	//do this instead
	//use object literal
	var car2 = {
	goes: true
	};


	//Customer constructors
	// are functions
	// when called empty object created referenced by 'this' variable
	//props and methods added to 'this' variable
	//new object referenced by 'this' returned implicitly
	//if no other object returned explicitly

	//can add functions to the prototype of the constructor - saves not having multiple copies of functions for each object created

	// Person.prototype.say = function(){
	// return "I, " + this.name + "am an awesome human being!"
	//};
	// so any object created is actually not empty but it inherits from Person.prototype

	//can return any object explicitly from custom constructor if desired


	//example
	var Maker = function(){
	this.name = "Dorothy";
	var that = {};
	that.name = "I am the great and powerful OZ!!";
	//that must be an object not a string or boolean for example - otherwise this returned anyway
	return that;
	};
	var o = new Maker();
	console.log(o.name);

	//if you forget new when calling the constructor (that returns implicit this) - this will refer to the global object
	//anti - pattern example
	var Maker2 = function(){
	this.name = "Dorothy";
	};
	var p = Maker2();
	console.log(typeof p);
	//p is the global object and you have polluted global namespace!! BAAAAD
	console.log(window.name);

	//ECMAScript 5 fixes this problem above

	//best ways to handle possible missing 'new' is to return a 'that' variable or an object literal.
	//however returning 'that' - won't have prototype chain of 'this'

	//Self - invoking constructor
	// question - so how can you get around the problem of omitting new by accident and still inherit the prototype chain?

	var Maker3 = function(){
	if(!(this instanceof Maker3)){
	return new Maker3();
	}
	this.says = "There's no place like home!";
	this.song = "We're off to see the wizard";
	};
	Maker3.prototype.walk = function(){
	return this.song;
	};
	var p1 = Maker3(),
	p2 = new Maker3();

	console.log(p1.says);
	console.log(p2.says);


	console.log(p1.walk());
	console.log(p2.walk());

	//Array literals
	// anti-pattern - using the Array constructor
	var a = new Array("good witch","wicked witch");
	//instead:
	var a = ["good witch","wicked witch"];

	//what's another of the Array() oddities?
	var b = new Array(3);
	console.log(b.join(" ") + "this is the end my friend");

	//make a shim for Array.isArray() if not defined
	if(typeof Array.isArray === "undefined"){
	Array.isArray = function(arg){
	return Object.prototype.toString.call(arg) === "[object Array]";
	};
	}

	console.log(Object.prototype.toString.call(a));
	console.log(Array.isArray(a));

	//JSON
	//JSON strings cannot use functions or regular expression literals
	var jsonString = '{"key":"DDvalue"}';

	//to return an object
	//anti-pattern ;
	var data = eval( '(' + jsonString + ')');
	console.log(data.key);

	//if ES5 use;
	var data = JSON.parse(jsonString);
	console.log(data.key);
	//otherwise use jQuery.parseJSON

	//there's also JSON.stringify - which serializes to JSON

	//regular expressions
	//anti-pattern: new RegExp() //unless creating a string at runtime

	//use instead: literal regular expression
	// example: var re = /\\/gm;
	</script>



	<script id="jsbin-source-javascript" type="text/javascript">//My crib notes from "JavaScript Patterns" by Stoyan Stefanov
	//Chapter 3 Literals and Constructors
	//includes some examples too
	//you will need to buy the book - these notes are sketchy and for review & reference only


	"use strict";
	//object literals

	//can add, change and delete methods and properties
	var dog = {
	name: 'toto',
	say: function(){
	return 'woof!';
	}
	};
	dog.fleas = true;
	console.log(dog);

	delete dog.name;


	console.log(dog);

	dog.say = function(){
	return 'aarf aarf';
	};

	console.log(dog.say());

	//Objects from a constructor
	// no classes in javascript!! yay!
	// but there are constructors - to create objects with
	// Object(), Date(), String()

	//anti-pattern
	// blurs distinction that objects are mutable hashes vs a baked item from //a recipe
	//also interpreter needs to go up the scope chain to find the global Object constructor
	var car = new Object();
	car.goes = true;

	//do this instead
	//use object literal
	var car2 = {
	goes: true
	};


	//Customer constructors
	// are functions
	// when called empty object created referenced by 'this' variable
	//props and methods added to 'this' variable
	//new object referenced by 'this' returned implicitly
	//if no other object returned explicitly

	//can add functions to the prototype of the constructor - saves not having multiple copies of functions for each object created

	// Person.prototype.say = function(){
	// return "I, " + this.name + "am an awesome human being!"
	//};
	// so any object created is actually not empty but it inherits from Person.prototype

	//can return any object explicitly from custom constructor if desired


	//example
	var Maker = function(){
	this.name = "Dorothy";
	var that = {};
	that.name = "I am the great and powerful OZ!!";
	//that must be an object not a string or boolean for example - otherwise this returned anyway
	return that;
	};
	var o = new Maker();
	console.log(o.name);

	//if you forget new when calling the constructor (that returns implicit this) - this will refer to the global object
	//anti - pattern example
	var Maker2 = function(){
	this.name = "Dorothy";
	};
	var p = Maker2();
	console.log(typeof p);
	//p is the global object and you have polluted global namespace!! BAAAAD
	console.log(window.name);

	//ECMAScript 5 fixes this problem above

	//best ways to handle possible missing 'new' is to return a 'that' variable or an object literal.
	//however returning 'that' - won't have prototype chain of 'this'

	//Self - invoking constructor
	// question - so how can you get around the problem of omitting new by accident and still inherit the prototype chain?

	var Maker3 = function(){
	if(!(this instanceof Maker3)){
	return new Maker3();
	}
	this.says = "There's no place like home!";
	this.song = "We're off to see the wizard";
	};
	Maker3.prototype.walk = function(){
	return this.song;
	};
	var p1 = Maker3(),
	p2 = new Maker3();

	console.log(p1.says);
	console.log(p2.says);


	console.log(p1.walk());
	console.log(p2.walk());

	//Array literals
	// anti-pattern - using the Array constructor
	var a = new Array("good witch","wicked witch");
	//instead:
	var a = ["good witch","wicked witch"];

	//what's another of the Array() oddities?
	var b = new Array(3);
	console.log(b.join(" ") + "this is the end my friend");

	//make a shim for Array.isArray() if not defined
	if(typeof Array.isArray === "undefined"){
	Array.isArray = function(arg){
	return Object.prototype.toString.call(arg) === "[object Array]";
	};
	}

	console.log(Object.prototype.toString.call(a));
	console.log(Array.isArray(a));

	//JSON
	//JSON strings cannot use functions or regular expression literals
	var jsonString = '{"key":"DDvalue"}';

	//to return an object
	//anti-pattern ;
	var data = eval( '(' + jsonString + ')');
	console.log(data.key);

	//if ES5 use;
	var data = JSON.parse(jsonString);
	console.log(data.key);
	//otherwise use jQuery.parseJSON

	//there's also JSON.stringify - which serializes to JSON

	//regular expressions
	//anti-pattern: new RegExp() //unless creating a string at runtime

	//use instead: literal regular expression
	// example: var re = /\\/gm;













	</script></body>
	</html>