-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
170 lines (127 loc) · 6.26 KB
/
index.html
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
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Array Cardio 💪</title>
</head>
<body>
<p><em>Psst: have a look at the JavaScript Console</em> 💁</p>
<script>
// Get your shorts on - this is an array workout!
// ## Array Cardio Day 1
// Some data we can work with
const inventors = [
{ first: 'Albert', last: 'Einstein', year: 1879, passed: 1955 },
{ first: 'Isaac', last: 'Newton', year: 1643, passed: 1727 },
{ first: 'Galileo', last: 'Galilei', year: 1564, passed: 1642 },
{ first: 'Marie', last: 'Curie', year: 1867, passed: 1934 },
{ first: 'Johannes', last: 'Kepler', year: 1571, passed: 1630 },
{ first: 'Nicolaus', last: 'Copernicus', year: 1473, passed: 1543 },
{ first: 'Max', last: 'Planck', year: 1858, passed: 1947 },
{ first: 'Katherine', last: 'Blodgett', year: 1898, passed: 1979 },
{ first: 'Ada', last: 'Lovelace', year: 1815, passed: 1852 },
{ first: 'Sarah E.', last: 'Goode', year: 1855, passed: 1905 },
{ first: 'Lise', last: 'Meitner', year: 1878, passed: 1968 },
{ first: 'Hanna', last: 'Hammarström', year: 1829, passed: 1909 }
];
const people = ['Beck, Glenn', 'Becker, Carl', 'Beckett, Samuel', 'Beddoes, Mick', 'Beecher, Henry', 'Beethoven, Ludwig', 'Begin, Menachem', 'Belloc, Hilaire', 'Bellow, Saul', 'Benchley, Robert', 'Benenson, Peter', 'Ben-Gurion, David', 'Benjamin, Walter', 'Benn, Tony', 'Bennington, Chester', 'Benson, Leana', 'Bent, Silas', 'Bentsen, Lloyd', 'Berger, Ric', 'Bergman, Ingmar', 'Berio, Luciano', 'Berle, Milton', 'Berlin, Irving', 'Berne, Eric', 'Bernhard, Sandra', 'Berra, Yogi', 'Berry, Halle', 'Berry, Wendell', 'Bethea, Erin', 'Bevan, Aneurin', 'Bevel, Ken', 'Biden, Joseph', 'Bierce, Ambrose', 'Biko, Steve', 'Billings, Josh', 'Biondo, Frank', 'Birrell, Augustine', 'Black, Elk', 'Blair, Robert', 'Blair, Tony', 'Blake, William'];
// Array.prototype.filter()
// 1. Filter the list of inventors for those who were born in the 1500's
//shorthand notation using fat-arrow notation (ES6)
const inFifteenHundred = inventors.filter(inventor => (inventor.year >= 1500 && inventor.year < 1600));
/*
<>return true;</> signals the filter function to keep the object
in the array i.e. inFifteenHundred.
You can also use an else condition to return false; but that's
unnecessary.
*/
console.table(inFifteenHundred);
// Array.prototype.map()
// 2. Give us an array of the inventors' first and last names
/*
Difference between filter and map:
1. map function takes in an array and returns another array of the same length.
Whereas filter function may or may not return an array of same length.
2. Also map function can be looked upon as a factory machine which takes in
the raw-materials and modify them and then returns the modified raw-materials.
Whereas filter function returns all or some of the raw-material (without modifying it)
*/
const firstAndLast = inventors.map(inventor => `${inventor.first} ${inventor.last}`);
console.log(firstAndLast);
// Array.prototype.sort()
// 3. Sort the inventors by birthdate, oldest to youngest
/*
const sortByBirth = inventors.sort(function(firstInventor, secondInventor) {
if(firstInventor.year >= secondInventor.year){
return 1;
//return 1 signifies, they are already in correct order.
} else {
return -1;
//return -1 signifies, they are not in correct order. Thus swap the elements.
}
});
*/
const sortByBirth = inventors.sort((firstPerson, secondPerson) =>
firstPerson.year > secondPerson.year ? 1 : -1);
console.table(sortByBirth);
// Array.prototype.reduce()
// 4. How many years did all the inventors live?
const totalYears = inventors.reduce((total, inventor) => {
return total + (inventor.passed - inventor.year);
}, 0);
/*
Array.prototype.reduce((total, inventor) => {
}, initialValue of total);
*/
console.log(totalYears);
// 5. Sort the inventors by years lived
const inventorsByYearsLived = inventors.sort((firstPerson, secondPerson) => {
const firstPersonYearsLived = (firstPerson.passed - firstPerson.year);
const secondPersonYearsLived = (secondPerson.passed - secondPerson.year);
return firstPersonYearsLived >= secondPersonYearsLived ? -1 : 1;
});
console.table(inventorsByYearsLived);
// 6. create a list of Boulevards in Paris that contain 'de' anywhere in the name
// https://en.wikipedia.org/wiki/Category:Boulevards_in_Paris
//const category = document.querySelector('.mw-category');
//const links = category.querySelectorAll('a');
/*
querySelectorAll returns a NodeList. In order to use array methods on it,
we first need to convert the NodeList into an Array.
This can be done in 2 ways:
1. Array.from(category.querySelectorAll('a'));
2. [...category.querySelectorAll('a')]; //using the spread operator of ES6
*/
//const links = Array.from(category.querySelectorAll('a'));
//const links = [...category.querySelectorAll('a')];
/*
querySelector and querySelectorAll can be applied to document as well as other variables
which in this case is category
*/
//const de = links
// .map(link => link.textContent)
// .filter(text => text.includes('de'));
//console.log(de);
// 7. sort Exercise
// Sort the people alphabetically by last name
const alpha = people.sort((firstOne, secondOne) => {
const [firstLast, firstFirst] = firstOne.split(', ');
const [secondLast, secondFirst] = secondOne.split(', ');
return firstLast > secondLast ? 1 : -1;
});
console.log(alpha);
// 8. Reduce Exercise
// Sum up the instances of each of these
const data = ['car', 'car', 'truck', 'truck', 'bike', 'walk', 'car', 'van', 'bike', 'walk', 'car', 'van', 'car', 'truck' ];
const transportation = data.reduce((obj, item) => {
//if obj[item] is not defined then define and initialise it with 0
if (!obj[item]){
obj[item] = 0;
}
obj[item]++;
return obj;
}, {});
console.log(transportation);
</script>
</body>
</html>