Skip to content

Commit

Permalink
Proper indentation using tabs (both HTML and JS)
Browse files Browse the repository at this point in the history
  • Loading branch information
Lars Kappert authored and Lars Kappert committed Feb 1, 2012
1 parent 8de6643 commit f1b4f9a
Show file tree
Hide file tree
Showing 77 changed files with 3,875 additions and 3,800 deletions.
158 changes: 79 additions & 79 deletions code-reuse-patterns/borrowing-methods.html
View file
Original file line number Diff line number Diff line change
@@ -1,82 +1,82 @@
<!doctype html>
<html lang="en">
<head>
<title>JavaScript Patterns</title>
<meta charset="utf-8">
</head>
<body>
<script>
/* Title: Borrowing Methods
Description: reuse one or two methods of an existing object without forming a parent-child relationship with that object
*/

function f() {
var args = [].slice.call(arguments, 1, 3);
return args;
}

var one = {
name: 'object',
say: function (greet) {
return greet + ', ' + this.name;
}
};

// test
console.log(one.say('hi')); // "hi, object"

var two = {
name: 'another object'
};

console.log(one.say.apply(two, ['hello'])); // "hello, another object"

// assigning to a variable
// `this` will point to the global object
var say = one.say;
console.log(say('hoho')); // "hoho, undefined"

// passing as a callback
var yetanother = {
name: 'Yet another object',
method: function (callback) {
return callback('Hola');
}
};
console.log(yetanother.method(one.say)); // "Holla, undefined"

function bind(o, m) {
return function () {
return m.apply(o, [].slice.call(arguments));
};
}

var twosay = bind(two, one.say);
console.log(twosay('yo')); // "yo, another object"


// ECMAScript 5 adds a method bind() to Function.prototype, making it just as easy to use as apply() and call().

if (typeof Function.prototype.bind === 'undefined') {
Function.prototype.bind = function (thisArg) {
var fn = this,
slice = Array.prototype.slice,
args = slice.call(arguments, 1);
return function () {
return fn.apply(thisArg, args.concat(slice.call(arguments)));
};
};
}

var twosay2 = one.say.bind(two);
console.log(twosay2('Bonjour')); // "Bonjour, another object"

var twosay3 = one.say.bind(two, 'Enchanté');
console.log(twosay3()); // "Enchanté, another object"


// reference
// http://shop.oreilly.com/product/9780596806767.do
</script>
</body>
<head>
<title>JavaScript Patterns</title>
<meta charset="utf-8">
</head>
<body>
<script>
/* Title: Borrowing Methods
Description: reuse one or two methods of an existing object without forming a parent-child relationship with that object
*/

function f() {
var args = [].slice.call(arguments, 1, 3);
return args;
}

var one = {
name:'object',
say:function (greet) {
return greet + ', ' + this.name;
}
};

// test
console.log(one.say('hi')); // "hi, object"

var two = {
name:'another object'
};

console.log(one.say.apply(two, ['hello'])); // "hello, another object"

// assigning to a variable
// `this` will point to the global object
var say = one.say;
console.log(say('hoho')); // "hoho, undefined"

// passing as a callback
var yetanother = {
name:'Yet another object',
method:function (callback) {
return callback('Hola');
}
};
console.log(yetanother.method(one.say)); // "Holla, undefined"

function bind(o, m) {
return function () {
return m.apply(o, [].slice.call(arguments));
};
}

var twosay = bind(two, one.say);
console.log(twosay('yo')); // "yo, another object"


// ECMAScript 5 adds a method bind() to Function.prototype, making it just as easy to use as apply() and call().

if (typeof Function.prototype.bind === 'undefined') {
Function.prototype.bind = function (thisArg) {
var fn = this,
slice = Array.prototype.slice,
args = slice.call(arguments, 1);
return function () {
return fn.apply(thisArg, args.concat(slice.call(arguments)));
};
};
}

var twosay2 = one.say.bind(two);
console.log(twosay2('Bonjour')); // "Bonjour, another object"

var twosay3 = one.say.bind(two, 'Enchanté');
console.log(twosay3()); // "Enchanté, another object"


// reference
// http://shop.oreilly.com/product/9780596806767.do
</script>
</body>
</html>
93 changes: 47 additions & 46 deletions code-reuse-patterns/cp1-default.html
View file
Original file line number Diff line number Diff line change
@@ -1,49 +1,50 @@
<!doctype html>
<html lang="en">
<head>
<title>JavaScript Patterns</title>
<meta charset="utf-8">
</head>
<body>
<script>
/* Title: Classical Pattern #1 - The Default Pattern (a pattern that should be generally avoided)
Description: create an object using the Parent() constructor and assign this object to the Child()'s prototype
*/

function inherit(C, P) {
C.prototype = new P();
}

// the parent constructor
function Parent(name) {
this.name = name || 'Adam';
}
// adding functionality to the prototype
Parent.prototype.say = function () {
return this.name;
};
// empty child constructor
function Child(name) {}

// inheritance magic happens here
inherit(Child, Parent);

var kid = new Child();
console.log(kid.say()); // "Adam"

// Drawback 1: own properties added to `this` is inherited
var kiddo = new Child();
kiddo.name = "Patrick";
console.log(kiddo.say()); // "Patrick"


// Drawback 2: it doesn't enable you to pass parameters to the child constructor
var s = new Child('Seth');
console.log(s.say()); // "Adam"


// reference
// http://shop.oreilly.com/product/9780596806767.do
</script>
</body>
<head>
<title>JavaScript Patterns</title>
<meta charset="utf-8">
</head>
<body>
<script>
/* Title: Classical Pattern #1 - The Default Pattern (a pattern that should be generally avoided)
Description: create an object using the Parent() constructor and assign this object to the Child()'s prototype
*/

function inherit(C, P) {
C.prototype = new P();
}

// the parent constructor
function Parent(name) {
this.name = name || 'Adam';
}
// adding functionality to the prototype
Parent.prototype.say = function () {
return this.name;
};
// empty child constructor
function Child(name) {
}

// inheritance magic happens here
inherit(Child, Parent);

var kid = new Child();
console.log(kid.say()); // "Adam"

// Drawback 1: own properties added to `this` is inherited
var kiddo = new Child();
kiddo.name = "Patrick";
console.log(kiddo.say()); // "Patrick"


// Drawback 2: it doesn't enable you to pass parameters to the child constructor
var s = new Child('Seth');
console.log(s.say()); // "Adam"


// reference
// http://shop.oreilly.com/product/9780596806767.do
</script>
</body>
</html>
114 changes: 57 additions & 57 deletions code-reuse-patterns/cp2-rent-a-constructor.html
View file
Original file line number Diff line number Diff line change
@@ -1,60 +1,60 @@
<!doctype html>
<html lang="en">
<head>
<title>JavaScript Patterns</title>
<meta charset="utf-8">
</head>
<body>
<script>
/* Title: Classical Pattern #2 - Rent a Constructor (a pattern that should be generally avoided)
Description: it borrows the parent constructor, passing the child object to be bound to this and also forwarding any arguments
*/

// the parent constructor
function Parent(name) {
this.name = name || 'Adam';
}

// adding functionality to the prototype
Parent.prototype.say = function () {
return this.name;
};

// child constructor
function Child(name) {
Parent.apply(this, arguments);
}

var kid = new Child("Patrick");
console.log(kid.name); // "Patrick"

// Drawback 1: nothing from the prototype gets inherited
console.log(typeof kid.say); // "undefined"

// Multiple Inheritance by Borrowing Constructors
function Cat() {
this.legs = 4;
this.say = function () {
return "meaowww";
}
}

function Bird() {
this.wings = 2;
this.fly = true;
}

function CatWings() {
Cat.apply(this);
Bird.apply(this);
}

var jane = new CatWings();
console.dir(jane);


// reference
// http://shop.oreilly.com/product/9780596806767.do
</script>
</body>
<head>
<title>JavaScript Patterns</title>
<meta charset="utf-8">
</head>
<body>
<script>
/* Title: Classical Pattern #2 - Rent a Constructor (a pattern that should be generally avoided)
Description: it borrows the parent constructor, passing the child object to be bound to this and also forwarding any arguments
*/

// the parent constructor
function Parent(name) {
this.name = name || 'Adam';
}

// adding functionality to the prototype
Parent.prototype.say = function () {
return this.name;
};

// child constructor
function Child(name) {
Parent.apply(this, arguments);
}

var kid = new Child("Patrick");
console.log(kid.name); // "Patrick"

// Drawback 1: nothing from the prototype gets inherited
console.log(typeof kid.say); // "undefined"

// Multiple Inheritance by Borrowing Constructors
function Cat() {
this.legs = 4;
this.say = function () {
return "meaowww";
}
}

function Bird() {
this.wings = 2;
this.fly = true;
}

function CatWings() {
Cat.apply(this);
Bird.apply(this);
}

var jane = new CatWings();
console.dir(jane);


// reference
// http://shop.oreilly.com/product/9780596806767.do
</script>
</body>
</html>
Loading

0 comments on commit f1b4f9a

Please sign in to comment.