Skip to content

Commit 4fbfbbf

Browse files
committed
arrays
1 parent 9c1497d commit 4fbfbbf

File tree

2 files changed

+137
-0
lines changed

2 files changed

+137
-0
lines changed

playground/arrays.html

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
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>
8+
9+
</title>
10+
<link rel="stylesheet" href="../base.css">
11+
</head>
12+
13+
<body>
14+
<script>
15+
const names = ['wes', 'kait', 'snickers'];
16+
17+
console.log(names[0]);
18+
console.log(names.length);
19+
console.log(names[names.length - 1]);
20+
21+
names.push('lux');
22+
console.log(names);
23+
const names2 = [...names, 'lux'];
24+
names.unshift('poppy');
25+
console.log(names);
26+
const names3 = ['poppy', ...names];
27+
console.log(names3);
28+
29+
const bikes = ['bianchi', 'miele', 'panasonic', 'miyata'];
30+
const newBikes = [
31+
...bikes.slice(0, 2),
32+
'benotto',
33+
...bikes.slice(2)
34+
];
35+
36+
const newBikes2 = [
37+
...newBikes.slice(0, 3),
38+
...newBikes.slice(4)
39+
];
40+
console.log(newBikes2);
41+
42+
//
43+
const comments = [
44+
{ text: 'Cool Beans', id: 123 },
45+
{ text: 'Love this', id: 133 },
46+
{ text: 'Neato', id: 233 },
47+
{ text: 'good bikes', id: 333 },
48+
{ text: 'so good', id: 433 },
49+
];
50+
51+
function deleteComment(id, comments) {
52+
// first find the index of the item in the array
53+
const commentIndex = comments.findIndex(comment => comment.id === id);
54+
// make a new array without that item in it
55+
return [
56+
...comments.slice(0, commentIndex),
57+
...comments.slice(commentIndex + 1),
58+
];
59+
// return our new array
60+
}
61+
62+
const kaitIndex = names.findIndex(name => name === 'kait');
63+
const newNamesWithOutKait = [
64+
// get everything up to kait index
65+
...names.slice(0, kaitIndex),
66+
// everything after Kait index
67+
...names.slice(kaitIndex + 1)
68+
];
69+
console.log(newNamesWithOutKait);
70+
71+
// const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];
72+
73+
// console.log(numbers);
74+
// numbers.splice(3, 2);
75+
// console.log(numbers);
76+
77+
// // Mutation Methods - DO CHANGE THE ORIGINAL DATA
78+
// const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];
79+
// // anytime you want to use a mutation method and NOT mutate the orignal array
80+
// // we need to take a copy of the array
81+
// const numbersReversed = [...numbers].reverse();
82+
// console.log(numbersReversed);
83+
// // numbers.reverse();
84+
// console.log(numbers);
85+
// // Immutable - THEY DO NOT CHANGE THE ORIGINAL DATA
86+
// const pizzaSlice = numbers.slice(2, 4);
87+
// console.log(pizzaSlice);
88+
// console.log(numbers);
89+
90+
</script>
91+
</body>
92+
93+
</html>

playground/maps.html

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
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>Maps</title>
8+
<link rel="stylesheet" href="../base.css">
9+
</head>
10+
11+
<body>
12+
<ul class="prizes"></ul>
13+
<script>
14+
const person1 = {
15+
name: 'wes',
16+
age: 200
17+
};
18+
19+
const myMap = new Map();
20+
// .set()
21+
myMap.set('name', 'wes');
22+
myMap.set(100, 'This is a number');
23+
myMap.set(person1, 'Really Cool');
24+
console.log(myMap);
25+
26+
const score = 200;
27+
const prizes = new Map();
28+
prizes.set(100, 'Bear');
29+
prizes.set(200, 'Duck');
30+
prizes.set(300, 'Car');
31+
console.log(`you win a ${prizes.get(score)}`);
32+
33+
// select that ul
34+
const ul = document.querySelector('.prizes');
35+
for (const [points, prize] of prizes) {
36+
const li = `<li>${points} - ${prize}</li>`;
37+
ul.insertAdjacentHTML('beforeend', li);
38+
}
39+
// .has()
40+
// .delete()
41+
</script>
42+
</body>
43+
44+
</html>

0 commit comments

Comments
 (0)