Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 045aaf3

Browse files
remarcmijremarcmij
committed
Add Traversy OOP Crash Course
1 parent ac39409 commit 045aaf3

20 files changed

+618
-5
lines changed

‎.vscode/settings.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
"editor.detectIndentation": false,
66
"editor.tabSize": 2,
77
"cSpell.words": [
8+
"Traversy",
89
"networkidle",
910
"remarcmij",
1011
"tabindex",

‎Week3/MAKEME.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,9 @@ Replace `XMLHttpRequest` in the `fetchJSON` function with `fetch`. Because `fetc
7373

7474
This final assignment requires you to go the extra mile and get acquainted with Object Oriented Programming and ES6 classes.
7575

76-
Object Oriented Programming is a vast topic and in this homework we can only scratch the surface. The approach we have taken for this homework is for you, as aspiring junior developer, to complete an application for which the groundwork has been done by an experienced developer. You may find it difficult to understand the full details of the application, however this is not unlike a real world situation where you will be expected to make relative small modifications to a complex application, without breaking anything.
76+
Object Oriented Programming is a vast topic and in this homework we can only scratch the surface. The approach we have taken here is for you, as aspiring junior developer, to complete an application for which the groundwork has been done by an experienced developer. You may find it difficult to understand the full details of the application, however this is not unlike a real world situation where you will be expected to make relative small modifications to a complex application, without breaking anything.
77+
78+
> Note that OOP does not play the same, central role in JavaScript as it does in other languages, such as Java, C++ and C#. In JavaScript it is more common to decompose a larger application into JavaScript modules (but which could still contain classes), as you will come across in the Node.js module.
7779
7880
> The relevant files for this part of the homework can be found in the **homework-classes** folder.
7981

‎Week3/README.md

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,13 +9,14 @@ In week three we will discuss the following topics:
99

1010
Here are resources that we like you to read as a preparation for the third lecture:
1111

12-
### Fundamentals
12+
### OOP
1313

14-
- [Object-Oriented Programming & Classes](../../../../fundamentals/blob/master/fundamentals/oop_classes.md)
15-
- [What is 'this'?](../../../../fundamentals/blob/master/fundamentals/this.md)
14+
- Fundamental - [Object-Oriented Programming & Classes](https://github.com/HackYourFuture/fundamentals/blob/master/fundamentals/oop_classes.md)
15+
- Traversy Media - [OOP Crash Course](./traversy_oop_crash_course)
1616

17-
### `call` `apply`, `bind`
17+
### `this`, `call` `apply`, `bind`
1818

19+
- [What is 'this'?](https://github.com/HackYourFuture/fundamentals/blob/master/fundamentals/this.md)
1920
- [Function.prototype.call()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/call)
2021
- [Function.prototype.apply()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply)
2122
- [Function.prototype.bind()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind)

‎Week3/traversy_oop_crash_course/1_basics_literals.js

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
// Object Literal
2+
const book1 = {
3+
title: 'Book One',
4+
author: 'John Doe',
5+
year: 2013,
6+
getSummary: function() {
7+
return `${this.title} was written by ${this.author} in ${this.year}.`;
8+
},
9+
};
10+
11+
const book2 = {
12+
title: 'Book Two',
13+
author: 'Jane Doe',
14+
year: 2016,
15+
getSummary: function() {
16+
return `${this.title} was written by ${this.author} in ${this.year}.`;
17+
},
18+
};
19+
20+
console.log(book1.getSummary());
21+
console.log(book2.getSummary());

‎Week3/traversy_oop_crash_course/2_constructor.js

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
// Constructor
2+
function Book(title, author, year) {
3+
this.title = title;
4+
this.author = author;
5+
this.year = year;
6+
this.getSummary = function() {
7+
return `${this.title} was written by ${this.author} in ${this.year}.`;
8+
};
9+
}
10+
11+
// Instantiate an Object
12+
const book1 = new Book('Book One', 'John Doe', 2013);
13+
const book2 = new Book('Book Two', 'Jane Doe', 2016);
14+
15+
console.log(book1.getSummary());
16+
console.log(book2.getSummary());
17+
18+
console.log(book1);
19+
20+
book1.turnPage();

‎Week3/traversy_oop_crash_course/3_prototypes.js

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
// Constructor
2+
function Book(title, author, year) {
3+
this.title = title;
4+
this.author = author;
5+
this.year = year;
6+
}
7+
8+
Book.prototype.getSummary = function() {
9+
return `${this.title} was written by ${this.author} in ${this.year}.`;
10+
};
11+
12+
Book.prototype.getAge = function() {
13+
const years = new Date().getFullYear() - this.year;
14+
return `${this.title} is ${years} years old.`;
15+
};
16+
17+
// Revise / Change Year
18+
Book.prototype.revise = function(newYear) {
19+
this.year = newYear;
20+
this.revised = true;
21+
};
22+
23+
// Instantiate an Object
24+
const book1 = new Book('Book One', 'John Doe', 2013);
25+
const book2 = new Book('Book Two', 'Jane Doe', 2016);
26+
27+
console.log(book1.getSummary());
28+
console.log(book2.getSummary());
29+
30+
console.log(book2);
31+
book2.revise(2018);
32+
console.log(book2);
33+
34+
console.log(book2.getAge());

‎Week3/traversy_oop_crash_course/4_inheritance.js

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
// Book Constructor
2+
function Book(title, author, year) {
3+
this.title = title;
4+
this.author = author;
5+
this.year = year;
6+
}
7+
8+
Book.prototype.getSummary = function() {
9+
return `${this.title} was written by ${this.author} in ${this.year}.`;
10+
};
11+
12+
Book.prototype.getAge = function() {
13+
const years = new Date().getFullYear() - this.year;
14+
return `${this.title} is ${years} years old.`;
15+
};
16+
17+
// Magazine Constructor
18+
function Magazine(title, author, year, month) {
19+
Book.call(this, title, author, year);
20+
this.month = month;
21+
}
22+
23+
// Inherit Prototype
24+
Magazine.prototype = Object.create(Book.prototype);
25+
26+
// Use Magazine Constructor
27+
Magazine.prototype.constructor = Magazine;
28+
29+
Magazine.prototype.updateMonth = function(month) {
30+
this.month = month;
31+
};
32+
33+
// Instantiate Magazine Object
34+
const mag1 = new Magazine('Mag One', 'John Doe', 2018, 'Jan');
35+
36+
console.log(mag1);
37+
console.log(mag1.getSummary());

‎Week3/traversy_oop_crash_course/5_object_create.js

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
// Object of Protos
2+
const bookProtos = {
3+
getSummary: function() {
4+
return `${this.title} was written by ${this.author} in ${this.year}.`;
5+
},
6+
getAge: function() {
7+
const years = new Date().getFullYear() - this.year;
8+
return `${this.title} is ${years} years old.`;
9+
},
10+
};
11+
12+
// Create Object
13+
const book1 = Object.create(bookProtos);
14+
book1.title = 'Book One';
15+
book1.author = 'John Doe';
16+
book1.year = 2013;
17+
18+
const book2 = Object.create(bookProtos, {
19+
title: { value: 'Book Two' },
20+
author: { value: 'Jane Doe' },
21+
year: { value: 2016 },
22+
});
23+
24+
console.log(book1);
25+
console.log(book2);

‎Week3/traversy_oop_crash_course/6_classes.js

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
class Book {
2+
constructor(title, author, year) {
3+
this.title = title;
4+
this.author = author;
5+
this.year = year;
6+
}
7+
8+
getSummary() {
9+
return `${this.title} was written by ${this.author} in ${this.year}.`;
10+
}
11+
12+
getAge() {
13+
const years = new Date().getFullYear() - this.year;
14+
return `${this.title} is ${years} years old.`;
15+
}
16+
17+
revise(newYear) {
18+
this.year = newYear;
19+
this.revised = true;
20+
}
21+
22+
static topBookStore() {
23+
return 'Barnes & Noble';
24+
}
25+
}
26+
27+
// Instantiate an Object
28+
const book1 = new Book('Book One', 'John Doe', 2013);
29+
const book2 = new Book('Book Two', 'Jane Doe', 2016);
30+
31+
console.log(book1);
32+
33+
console.log(book1.getSummary());
34+
console.log(book2.getSummary());
35+
36+
console.log(book2);
37+
book2.revise(2018);
38+
console.log(book2);
39+
40+
console.log(book2.getAge());
41+
42+
console.log(Book.topBookStore());

‎Week3/traversy_oop_crash_course/7_subclasses.js

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
class Book {
2+
constructor(title, author, year) {
3+
this.title = title;
4+
this.author = author;
5+
this.year = year;
6+
}
7+
8+
getSummary() {
9+
return `${this.title} was written by ${this.author} in ${this.year}.`;
10+
}
11+
}
12+
13+
class Magazine extends Book {
14+
constructor(title, author, year, month) {
15+
super(title, author, year);
16+
this.month = month;
17+
}
18+
19+
updateMonth(month) {
20+
this.month = month;
21+
}
22+
}
23+
24+
// Instantiate Magazine Object
25+
const mag1 = new Magazine('Mag One', 'John Doe', 2018, 'Jan');
26+
27+
console.log(mag1);
28+
console.log(mag1.getSummary());

0 commit comments

Comments
 (0)