Skip to content

Commit 42b2851

Browse files
committed
create starter and finished files for video 61
1 parent 54c03c8 commit 42b2851

File tree

2 files changed

+89
-74
lines changed

2 files changed

+89
-74
lines changed

playground/new-this-FINISHED.html

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width,initial-scale=1.0">
7+
<title>New, This, Prototypes and Classes</title>
8+
<link rel="stylesheet" href="../base.css">
9+
</head>
10+
11+
<body>
12+
<button class="one">Button 1</button>
13+
<button class="two">Button 2</button>
14+
<script>
15+
const myDate = new Date('August 11, 2025');
16+
console.dir(myDate);
17+
console.log(myDate.getFullYear());
18+
19+
const names = new Array('wes', 'kait');
20+
const wes = new Object({ name: 'wes' });
21+
const span = document.createElement('span');
22+
23+
String.prototype.sarcastic = function () {
24+
// make sarcastic
25+
return [...this].map((char, i) => char[`to${i % 2 ? 'Upper' : 'Lower'}Case`]()).join('');
26+
const sarcastic = this.split('').map((char, i) => {
27+
if (i % 2) {
28+
return char.toUpperCase();
29+
} else {
30+
return char.toLowerCase();
31+
}
32+
}).join('');
33+
return sarcastic;
34+
}
35+
function Pizza(toppings = [], customer) {
36+
console.log('Making a pizza');
37+
// save the toppings that were passed in, to this instance of pizza
38+
this.toppings = toppings;
39+
this.customer = customer;
40+
this.id = Math.floor(Math.random() * 16777215).toString(16);
41+
this.slices = 10;
42+
// this.eat = function () {
43+
// if (this.slices > 0) {
44+
// this.slices = this.slices - 1;
45+
// console.log(`CHOMP you now have ${this.slices} left!`);
46+
// } else {
47+
// console.log(`Sorry! No slices left!`);
48+
// }
49+
// }
50+
}
51+
52+
Pizza.prototype.eat = function () {
53+
if (this.slices > 0) {
54+
this.slices = this.slices - 1;
55+
console.log(`CHOMP you now have ${this.slices} left!`);
56+
} else {
57+
console.log(`Sorry! No slices left!`);
58+
}
59+
}
60+
61+
Pizza.prototype.describe = function () {
62+
return `This pizza is for ${this.customer} with the toppings ${this.toppings.join(',')} and there are ${this.slices} left!`;
63+
}
64+
65+
const pepperoniPizza = new Pizza(['pepperoni'], 'Wes Bos');
66+
const canadianPizza = new Pizza(['pepperoni', 'mushrooms', 'onion'], 'Kait Bos');
67+
68+
69+
// const button1 = document.querySelector('.one');
70+
// const button2 = document.querySelector('.two');
71+
72+
// function tellMeAboutTheButton() {
73+
// console.log('outside', this);
74+
// setTimeout(() => {
75+
// console.log('inside', this);
76+
// this.textContent = 'You Clicked Me';
77+
// }, 1000);
78+
// }
79+
80+
// button1.addEventListener('click', tellMeAboutTheButton);
81+
// button2.addEventListener('click', tellMeAboutTheButton);
82+
83+
84+
85+
86+
</script>
87+
</body>
88+
89+
</html>

playground/new-this.html

Lines changed: 0 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -9,81 +9,7 @@
99
</head>
1010

1111
<body>
12-
<button class="one">Button 1</button>
13-
<button class="two">Button 2</button>
14-
<script>
15-
const myDate = new Date('August 11, 2025');
16-
console.dir(myDate);
17-
console.log(myDate.getFullYear());
1812

19-
const names = new Array('wes', 'kait');
20-
const wes = new Object({ name: 'wes' });
21-
const span = document.createElement('span');
22-
23-
String.prototype.sarcastic = function () {
24-
// make sarcastic
25-
return [...this].map((char, i) => char[`to${i % 2 ? 'Upper' : 'Lower'}Case`]()).join('');
26-
const sarcastic = this.split('').map((char, i) => {
27-
if (i % 2) {
28-
return char.toUpperCase();
29-
} else {
30-
return char.toLowerCase();
31-
}
32-
}).join('');
33-
return sarcastic;
34-
}
35-
function Pizza(toppings = [], customer) {
36-
console.log('Making a pizza');
37-
// save the toppings that were passed in, to this instance of pizza
38-
this.toppings = toppings;
39-
this.customer = customer;
40-
this.id = Math.floor(Math.random() * 16777215).toString(16);
41-
this.slices = 10;
42-
// this.eat = function () {
43-
// if (this.slices > 0) {
44-
// this.slices = this.slices - 1;
45-
// console.log(`CHOMP you now have ${this.slices} left!`);
46-
// } else {
47-
// console.log(`Sorry! No slices left!`);
48-
// }
49-
// }
50-
}
51-
52-
Pizza.prototype.eat = function () {
53-
if (this.slices > 0) {
54-
this.slices = this.slices - 1;
55-
console.log(`CHOMP you now have ${this.slices} left!`);
56-
} else {
57-
console.log(`Sorry! No slices left!`);
58-
}
59-
}
60-
61-
Pizza.prototype.describe = function () {
62-
return `This pizza is for ${this.customer} with the toppings ${this.toppings.join(',')} and there are ${this.slices} left!`;
63-
}
64-
65-
const pepperoniPizza = new Pizza(['pepperoni'], 'Wes Bos');
66-
const canadianPizza = new Pizza(['pepperoni', 'mushrooms', 'onion'], 'Kait Bos');
67-
68-
69-
// const button1 = document.querySelector('.one');
70-
// const button2 = document.querySelector('.two');
71-
72-
// function tellMeAboutTheButton() {
73-
// console.log('outside', this);
74-
// setTimeout(() => {
75-
// console.log('inside', this);
76-
// this.textContent = 'You Clicked Me';
77-
// }, 1000);
78-
// }
79-
80-
// button1.addEventListener('click', tellMeAboutTheButton);
81-
// button2.addEventListener('click', tellMeAboutTheButton);
82-
83-
84-
85-
86-
</script>
8713
</body>
8814

8915
</html>

0 commit comments

Comments
 (0)