Skip to content

Commit d51463c

Browse files
cleancoderockercleancoderocker
committed
Updated adapter, builder and prototype patterns
1 parent 626a93e commit d51463c

File tree

6 files changed

+354
-0
lines changed

6 files changed

+354
-0
lines changed

‎Kapitel8/Adapter/ES2015/Adapter.js

+64
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
(function() {
2+
Logger = {
3+
log(message) {
4+
console.log(message);
5+
},
6+
warn(message) {
7+
console.warn(message);
8+
},
9+
error(message) {
10+
console.error(message);
11+
}
12+
}
13+
14+
NewLogger = {
15+
reportLog(message) {
16+
console.log(new Date() + ': ' + message);
17+
},
18+
reportWarn(message) {
19+
console.warn(new Date() + ': ' + message);
20+
},
21+
reportError(message) {
22+
console.error(new Date() + ': ' + message);
23+
}
24+
}
25+
26+
let logger = Logger;
27+
logger.log('Programm gestartet');
28+
29+
// Funktioniert nicht
30+
// logger = NewLogger;
31+
// logger.log('Programm gestartet');
32+
33+
// Adapter
34+
function LoggerAdapter(logger) {
35+
return {
36+
log(message) {
37+
logger.reportLog(message);
38+
},
39+
warn(message) {
40+
logger.reportWarn(message);
41+
},
42+
error(message) {
43+
logger.reportError(message);
44+
}
45+
}
46+
}
47+
// Funktioniert über Adapter
48+
logger = new LoggerAdapter(NewLogger);
49+
logger.log('Programm gestartet');
50+
51+
// First Class Functions
52+
logger = Logger;
53+
Logger.log = (message) => {
54+
NewLogger.reportLog(message);
55+
}
56+
Logger.warn = (message) => {
57+
NewLogger.reportWarn(message);
58+
}
59+
Logger.error = (message) => {
60+
NewLogger.reportError(message);
61+
}
62+
// Funktioniert wegen First Class Functions
63+
logger.log('Programm gestartet');
64+
})();

‎Kapitel8/Adapter/ES5/Adapter.js

+64
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
(function() {
2+
Logger = {
3+
log: function(message) {
4+
console.log(message);
5+
},
6+
warn: function(message) {
7+
console.warn(message);
8+
},
9+
error: function(message) {
10+
console.error(message);
11+
}
12+
}
13+
14+
NewLogger = {
15+
reportLog: function(message) {
16+
console.log(new Date() + ': ' + message);
17+
},
18+
reportWarn: function(message) {
19+
console.warn(new Date() + ': ' + message);
20+
},
21+
reportError: function(message) {
22+
console.error(new Date() + ': ' + message);
23+
}
24+
}
25+
26+
var logger = Logger;
27+
logger.log('Programm gestartet');
28+
29+
// Funktioniert nicht
30+
// logger = NewLogger;
31+
// logger.log('Programm gestartet');
32+
33+
// Adapter
34+
function LoggerAdapter(logger) {
35+
return {
36+
log: function(message) {
37+
logger.reportLog(message);
38+
},
39+
warn: function(message) {
40+
logger.reportWarn(message);
41+
},
42+
error: function(message) {
43+
logger.reportError(message);
44+
}
45+
}
46+
}
47+
// Funktioniert über Adapter
48+
logger = new LoggerAdapter(NewLogger);
49+
logger.log('Programm gestartet');
50+
51+
// First Class Functions
52+
logger = Logger;
53+
Logger.log = function(message) {
54+
NewLogger.reportLog(message);
55+
}
56+
Logger.warn = function(message) {
57+
NewLogger.reportWarn(message);
58+
}
59+
Logger.error = function(message) {
60+
NewLogger.reportError(message);
61+
}
62+
// Funktioniert wegen First Class Functions
63+
logger.log('Programm gestartet');
64+
})();

‎Kapitel8/Builder/Klassensyntax/Builder.js

+71
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
// Hinweis: dieses Beispiel funktioniert nur im Browser
2+
// bzw. in Laufzeitumgebungen, in denen das document-Objekt
3+
// zur Verfügung steht.
4+
(function () {
5+
6+
class TableBuilder {
7+
8+
constructor() {
9+
this.table = document.createElement('table');
10+
this.numberOfRows = 0;
11+
this.numberOfColumns = 0;
12+
this.headerNames = [];
13+
}
14+
15+
buildHeaders(headers) {
16+
this.headerNames = headers;
17+
const tr = document.createElement('tr');
18+
for(let i = 0; i < this.headerNames.length; i++) {
19+
const th = document.createElement('th');
20+
const text = document.createTextNode(this.headerNames[i]);
21+
th.appendChild(text);
22+
tr.appendChild(th);
23+
}
24+
this.table.appendChild(tr);
25+
return this;
26+
}
27+
28+
buildColumns(numberOfColumns) {
29+
this.numberOfColumns = numberOfColumns;
30+
return this;
31+
}
32+
33+
buildRows(numberOfRows) {
34+
this.numberOfRows = numberOfRows;
35+
for(let i = 0; i < this.numberOfRows; i++) {
36+
const tr = document.createElement('tr');
37+
for(let j = 0; j < this.numberOfColumns; j++) {
38+
const td = document.createElement('td');
39+
tr.appendChild(td);
40+
}
41+
this.table.appendChild(tr);
42+
}
43+
return this;
44+
}
45+
46+
getResult() {
47+
return this.table;
48+
}
49+
};
50+
51+
class TableDirector {
52+
53+
constructor() {
54+
this.tableBuilder = new TableBuilder();
55+
}
56+
57+
constructArtistTable() {
58+
const table = this.tableBuilder
59+
.buildHeaders(['Artist', 'Title'])
60+
.buildColumns(2)
61+
.buildRows(4)
62+
.getResult();
63+
return table;
64+
}
65+
}
66+
67+
const tableDirector = new TableDirector();
68+
const table = tableDirector.constructArtistTable();
69+
// document.getElementById('artist-table').appendChild(table);
70+
console.log(table);
71+
})();

‎Kapitel8/Builder/Pseudoklassisch/Builder.js

+61
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
// Hinweis: dieses Beispiel funktioniert nur im Browser
2+
// bzw. in Laufzeitumgebungen, in denen das document-Objekt
3+
// zur Verfügung steht.
4+
(function () {
5+
var TableBuilder = function() {
6+
var table = document.createElement('table');
7+
var numberOfRows = 0;
8+
var numberOfColumns = 0;
9+
var headerNames = [];
10+
return {
11+
buildHeaders : function(headers) {
12+
this.headerNames = headers;
13+
var tr = document.createElement('tr');
14+
for(var i = 0; i < this.headerNames.length; i++) {
15+
var th = document.createElement('th');
16+
var text = document.createTextNode(this.headerNames[i]);
17+
th.appendChild(text);
18+
tr.appendChild(th);
19+
}
20+
table.appendChild(tr);
21+
return this;
22+
},
23+
buildColumns : function(numberOfColumns) {
24+
this.numberOfColumns = numberOfColumns;
25+
return this;
26+
},
27+
buildRows : function(numberOfRows) {
28+
this.numberOfRows = numberOfRows;
29+
for(var i = 0; i < this.numberOfRows; i++) {
30+
var tr = document.createElement('tr');
31+
for(var j = 0; j < this.numberOfColumns; j++) {
32+
var td = document.createElement('td');
33+
tr.appendChild(td);
34+
}
35+
table.appendChild(tr);
36+
}
37+
return this;
38+
},
39+
getResult : function() {
40+
return table;
41+
}
42+
};
43+
};
44+
var TableDirector = function() {
45+
var tableBuilder = new TableBuilder();
46+
return {
47+
constructArtistTable: function() {
48+
var table = tableBuilder
49+
.buildHeaders(['Artist', 'Title'])
50+
.buildColumns(2)
51+
.buildRows(4)
52+
.getResult();
53+
return table;
54+
}
55+
}
56+
}
57+
var tableDirector = new TableDirector();
58+
var table = tableDirector.constructArtistTable();
59+
// document.getElementById('artist-table').appendChild(table);
60+
console.log(table);
61+
})();

‎Kapitel8/Prototype/ES2015/Prototype.js

+47
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
(function() {
2+
const cube= {
3+
width: 20,
4+
depth: 20,
5+
height: 20,
6+
color: 'weiß',
7+
setWidth(width) {
8+
this.width = width;
9+
},
10+
getWidth() {
11+
return this.width;
12+
},
13+
setDepth(depth) {
14+
this.depth = depth;
15+
},
16+
getDepth() {
17+
return this.depth;
18+
},
19+
setHeight(height) {
20+
this.height = height;
21+
},
22+
getHeight() {
23+
return this.height;
24+
},
25+
setColor(color) {
26+
this.color = color;
27+
},
28+
getColor() {
29+
return this.color;
30+
}
31+
}
32+
const yellowCube= Object.create(cube);
33+
yellowCube.setColor('gelb');
34+
const blueCube = Object.create(cube);
35+
blueCube.setColor('blau');
36+
console.log(cube.getColor()); // weiß
37+
console.log(yellowCube.getColor()); // gelb
38+
console.log(blueCube.getColor()); // blau
39+
console.log(yellowCube.getWidth()); // 20
40+
console.log(blueCube.getWidth()); // 20
41+
cube.setWidth(40);
42+
console.log(yellowCube.getWidth()); // 40
43+
console.log(blueCube.getWidth()); // 40
44+
yellowCube.setWidth(60);
45+
console.log(yellowCube.getWidth()); // 60
46+
console.log(blueCube.getWidth()); // 40
47+
})();

‎Kapitel8/Prototype/ES5/Prototype.js

+47
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
(function() {
2+
var cube= {
3+
width: 20,
4+
depth: 20,
5+
height: 20,
6+
color: 'weiß',
7+
setWidth: function(width) {
8+
this.width = width;
9+
},
10+
getWidth: function() {
11+
return this.width;
12+
},
13+
setDepth: function(depth) {
14+
this.depth = depth;
15+
},
16+
getDepth: function() {
17+
return this.depth;
18+
},
19+
setHeight: function(height) {
20+
this.height = height;
21+
},
22+
getHeight: function() {
23+
return this.height;
24+
},
25+
setColor: function(color) {
26+
this.color = color;
27+
},
28+
getColor: function() {
29+
return this.color;
30+
}
31+
}
32+
const yellowCube= Object.create(cube);
33+
yellowCube.setColor('gelb');
34+
const blueCube = Object.create(cube);
35+
blueCube.setColor('blau');
36+
console.log(cube.getColor()); // weiß
37+
console.log(yellowCube.getColor()); // gelb
38+
console.log(blueCube.getColor()); // blau
39+
console.log(yellowCube.getWidth()); // 20
40+
console.log(blueCube.getWidth()); // 20
41+
cube.setWidth(40);
42+
console.log(yellowCube.getWidth()); // 40
43+
console.log(blueCube.getWidth()); // 40
44+
yellowCube.setWidth(60);
45+
console.log(yellowCube.getWidth()); // 60
46+
console.log(blueCube.getWidth()); // 40
47+
})();

0 commit comments

Comments
 (0)