Skip to content

Commit 792c973

Browse files
author
FX
committed
advancements
1 parent 82183fe commit 792c973

File tree

3 files changed

+759
-0
lines changed

3 files changed

+759
-0
lines changed

Arrays/Advanced/readme.md

Lines changed: 242 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,242 @@
1+
## **JavaScript Arrays Course**
2+
3+
### **1. Introduction to Arrays**
4+
5+
**Definition:** An array is a special type of object in JavaScript used to store multiple values in a single variable. Arrays are ordered collections where each item is accessible by its index.
6+
7+
**Syntax:**
8+
9+
```javascript
10+
let array = [element1, element2, element3, ...];
11+
```
12+
13+
**Examples:**
14+
15+
```javascript
16+
let fruits = ['Apple', 'Banana', 'Cherry']
17+
let numbers = [1, 2, 3, 4, 5]
18+
```
19+
20+
### **2. Creating Arrays**
21+
22+
**Using Array Literals:**
23+
24+
```javascript
25+
let colors = ['Red', 'Green', 'Blue']
26+
```
27+
28+
**Using the Array Constructor:**
29+
30+
```javascript
31+
let emptyArray = new Array()
32+
let numbers = new Array(1, 2, 3, 4, 5) // Array with specific elements
33+
let lengthArray = new Array(10) // Array with 10 empty slots
34+
```
35+
36+
### **3. Accessing and Modifying Arrays**
37+
38+
**Accessing Elements:**
39+
40+
```javascript
41+
let fruits = ['Apple', 'Banana', 'Cherry']
42+
console.log(fruits[0]) // "Apple"
43+
console.log(fruits[2]) // "Cherry"
44+
```
45+
46+
**Modifying Elements:**
47+
48+
```javascript
49+
fruits[1] = 'Blueberry'
50+
console.log(fruits) // ["Apple", "Blueberry", "Cherry"]
51+
```
52+
53+
**Array Length:**
54+
55+
```javascript
56+
let numbers = [1, 2, 3, 4, 5]
57+
console.log(numbers.length) // 5
58+
```
59+
60+
### **4. Array Methods**
61+
62+
**Adding and Removing Elements:**
63+
64+
- `push(element1, element2, ...)` – Adds elements to the end of an array.
65+
- `pop()` – Removes the last element from an array.
66+
- `unshift(element1, element2, ...)` – Adds elements to the beginning of an array.
67+
- `shift()` – Removes the first element from an array.
68+
69+
**Examples:**
70+
71+
```javascript
72+
let numbers = [1, 2, 3]
73+
numbers.push(4) // [1, 2, 3, 4]
74+
numbers.pop() // [1, 2, 3]
75+
numbers.unshift(0) // [0, 1, 2, 3]
76+
numbers.shift() // [1, 2, 3]
77+
```
78+
79+
**Finding Elements:**
80+
81+
- `indexOf(element)` – Returns the first index at which a given element can be found.
82+
- `includes(element)` – Checks if an array contains a specified element.
83+
84+
**Examples:**
85+
86+
```javascript
87+
let fruits = ['Apple', 'Banana', 'Cherry']
88+
console.log(fruits.indexOf('Banana')) // 1
89+
console.log(fruits.includes('Cherry')) // true
90+
```
91+
92+
**Iterating Over Arrays:**
93+
94+
- `forEach(callback)` – Executes a provided function once for each array element.
95+
- `map(callback)` – Creates a new array with the results of calling a function on every element.
96+
- `filter(callback)` – Creates a new array with all elements that pass the test implemented by the provided function.
97+
- `reduce(callback, initialValue)` – Applies a function against an accumulator and each element to reduce it to a single value.
98+
99+
**Examples:**
100+
101+
```javascript
102+
let numbers = [1, 2, 3, 4, 5]
103+
104+
numbers.forEach(num => console.log(num)) // Logs each number
105+
106+
let squared = numbers.map(num => num * num) // [1, 4, 9, 16, 25]
107+
108+
let evenNumbers = numbers.filter(num => num % 2 === 0) // [2, 4]
109+
110+
let sum = numbers.reduce((acc, num) => acc + num, 0) // 15
111+
```
112+
113+
**Sorting and Reversing:**
114+
115+
- `sort(compareFunction)` – Sorts the elements of an array in place and returns the array.
116+
- `reverse()` – Reverses the elements of an array in place.
117+
118+
**Examples:**
119+
120+
```javascript
121+
let numbers = [4, 2, 5, 1, 3]
122+
numbers.sort() // [1, 2, 3, 4, 5]
123+
124+
let letters = ['b', 'a', 'c']
125+
letters.reverse() // ["c", "a", "b"]
126+
```
127+
128+
### **5. Advanced Array Methods**
129+
130+
**Joining and Splitting:**
131+
132+
- `join(separator)` – Joins all elements of an array into a string.
133+
- `split(separator)` – Splits a string into an array of substrings.
134+
135+
**Examples:**
136+
137+
```javascript
138+
let fruits = ['Apple', 'Banana', 'Cherry']
139+
let fruitString = fruits.join(', ') // "Apple, Banana, Cherry"
140+
141+
let string = 'Red, Green, Blue'
142+
let colors = string.split(', ') // ["Red", "Green", "Blue"]
143+
```
144+
145+
**Array of Arrays (Multidimensional Arrays):**
146+
147+
```javascript
148+
let matrix = [
149+
[1, 2, 3],
150+
[4, 5, 6],
151+
[7, 8, 9],
152+
]
153+
154+
console.log(matrix[1][2]) // 6
155+
```
156+
157+
**Flattening Arrays:**
158+
159+
- `flat(depth)` – Creates a new array with all sub-array elements concatenated into it recursively up to the specified depth.
160+
161+
**Examples:**
162+
163+
```javascript
164+
let nestedArray = [1, [2, [3, 4]], 5]
165+
let flatArray = nestedArray.flat(2) // [1, 2, 3, 4, 5]
166+
```
167+
168+
### **6. Real-World Usage of Arrays**
169+
170+
**1. Managing User Data:**
171+
172+
```javascript
173+
let users = [
174+
{ name: 'Alice', age: 25 },
175+
{ name: 'Bob', age: 30 },
176+
{ name: 'Charlie', age: 35 },
177+
]
178+
179+
let names = users.map(user => user.name) // ["Alice", "Bob", "Charlie"]
180+
```
181+
182+
**2. Handling Dynamic Lists:**
183+
184+
```javascript
185+
let tasks = []
186+
187+
function addTask(task) {
188+
tasks.push(task)
189+
}
190+
191+
function removeTask(index) {
192+
tasks.splice(index, 1)
193+
}
194+
195+
addTask('Buy groceries')
196+
addTask('Clean the house')
197+
console.log(tasks) // ["Buy groceries", "Clean the house"]
198+
removeTask(0)
199+
console.log(tasks) // ["Clean the house"]
200+
```
201+
202+
**3. Data Transformation and Visualization:**
203+
204+
```javascript
205+
let sales = [200, 300, 250, 400, 500]
206+
let totalSales = sales.reduce((total, sale) => total + sale, 0) // 1650
207+
let averageSales = totalSales / sales.length // 330
208+
209+
console.log(`Total Sales: ${totalSales}`)
210+
console.log(`Average Sales: ${averageSales}`)
211+
```
212+
213+
**4. Filtering and Sorting Data:**
214+
215+
```javascript
216+
let products = [
217+
{ name: 'Laptop', price: 999 },
218+
{ name: 'Smartphone', price: 599 },
219+
{ name: 'Tablet', price: 399 },
220+
]
221+
222+
let affordableProducts = products.filter(product => product.price < 600) // Products with price less than 600
223+
let sortedProducts = products.sort((a, b) => a.price - b.price) // Sort by price
224+
```
225+
226+
### **7. Performance Considerations**
227+
228+
**1. Avoiding Array Reallocation:**
229+
230+
- Use `push` and `pop` instead of `concat` to avoid frequent reallocation.
231+
232+
**2. Efficient Search:**
233+
234+
- Use `Set` or `Map` for faster lookups if you need to frequently check for the existence of an element.
235+
236+
**3. Minimizing Side Effects:**
237+
238+
- Prefer functional methods like `map`, `filter`, and `reduce` to avoid mutating the original array.
239+
240+
### **8. Conclusion**
241+
242+
Arrays are a fundamental and versatile data structure in JavaScript. Understanding how to use array methods effectively will help you manage and manipulate collections of data efficiently. From basic operations to advanced techniques, mastering arrays will enable you to tackle a wide range of programming tasks and build robust applications.

0 commit comments

Comments
 (0)