javascript-patterns/code-reuse-patterns/inheritance-by-copying-properties.html at patch-1 · RecursiveOptimization/javascript-patterns · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!doctype html>
<html lang="en">
	<head>
		<title>JavaScript Patterns</title>
		<meta charset="utf-8">
	</head>
	<body>
		<script>
			/* Title: Inheritance by Copying Properties
			 Description: an object gets functionality from another object, simply by copying it
			 */

			/* shallow copy */
			function extend(parent, child) {
				var i;
				child = child || {};
				for (i in parent) {
					if (parent.hasOwnProperty(i)) {
						child[i] = parent[i];
					}
				}
				return child;
			}

			var dad = {name:"Adam"};
			var kid = extend(dad);
			console.log(kid.name); // "Adam"

			var dad = {
				counts:[1, 2, 3],
				reads:{paper:true}
			};
			var kid = extend(dad);
			kid.counts.push(4);
			console.log(dad.counts.toString()); // "1,2,3,4"
			console.log(dad.reads === kid.reads); // true


			/* deep copy */
			function extendDeep(parent, child) {
				var i,
						toStr = Object.prototype.toString,
						astr = "[object Array]";

				child = child || {};

				for (i in parent) {
					if (parent.hasOwnProperty(i)) {
						if (typeof parent[i] === 'object') {
							child[i] = (toStr.call(parent[i]) === astr) ? [] : {};
							extendDeep(parent[i], child[i]);
						} else {
							child[i] = parent[i];
						}
					}
				}
				return child;
			}

			var dad = {
				counts:[1, 2, 3],
				reads:{paper:true}
			};
			var kid = extendDeep(dad);

			kid.counts.push(4);
			console.log(kid.counts.toString()); // "1,2,3,4"
			console.log(dad.counts.toString()); // "1,2,3"

			console.log(dad.reads === kid.reads); // false
			kid.reads.paper = false;


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