Advanced-JavaScript-With-Projects/arrayMethod.html at main · marleyDip/Advanced-JavaScript-With-Projects · GitHub

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
171
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Array Method</title>
  </head>
  <body></body>
  <script>
    /* push() method */

    let m = [10, 20, 30, 40, 50];

    m.push(99); // add value in before last => m[5] ; 99

    m.push(55); // add value in last => m[6] ; 99, 55

    console.log(m);
    console.log(m.join(", "));

    /* unshift() method */

    let n = [10, 20, 30, 40, 50];

    n.unshift(99); // add value in 1st => n[1]; 99, 10

    n.unshift(55); // add value in before 1st => n[0]; 55, 99, 10

    console.log(n);
    console.log(n.join(", "));

    /* pop() method */

    let o = [10, 20, 30, 40, 50];

    console.log(o.pop()); // delete last value of the array and show the number which delete; 50

    o.pop(); // delete value in last => n[3] ; 40
    o.pop(); // delete value in before last => n[2]; 30

    console.log(o);

    /* shift() method */

    let p = [10, 20, 30, 40, 50];

    p.pop(); // delete value in 1st => n[0]; 10
    p.pop(); // delete value in after 1st => n[1]; 20

    console.log(p);

    /* toString() & join() method */

    let q = ["Sofian", "Hasan", "Deep", "Akand"];

    let data = q.toString(); // separated by comma
    console.log(data); // Sofian, Hasan, Deep, Akand

    let joinData = q.join(" | "); // convert array to string
    console.log(joinData); // Sofian | Hasan | Deep | Akand

    /* includes() method */

    let l = [10, 20, 30, 40, 50];
    console.log(l.includes(30));
    // true / false....most used in if -else conditional loop

    /* concat() method */

    let b = [10, 20, 30, 40, 50];
    let b1 = ["hi", "deep", 30, "Akand", 50];

    let newArray = b1.concat(b);
    console.log(newArray);

    let newArray1 = b.concat(b1);
    console.log(newArray1);

    /* splice() method */

    let h = [10, 20, 30, 40, 50];

    h.splice(1, 2); // (a, b, c) => a = position; b = how many element delete of existing array; c = add element in those position

    console.log(h); // [ 10, 40, 50 ]

    h.splice(1, 0, 88, 77); // add 88 & 77 in 1 position, 0 means no delete
    console.log(h); // [10, 88, 77, 20, 30, 40, 50]

    h.splice(1, 2, 90, 100); // add 88 & 77 in 1 position and delete element n[1] to n[2]; means position 1 and position 2
    console.log(h); // [ 10, 90, 100, 40, 50 ]

    h.splice(4, 2, 90, 100);
    console.log(h); // [ 10, 20, 30, 40, 50, 90, 100 ]

    /* slice() method */

    let s = [10, 20, 30, 40, 50];

    let newArray3 = s.slice(0, 2); // (a, b) => a = position (start point), b = less than position (end point) ==> start point equal and less than end point
    console.log(newArray3); // [10, 20]

    // koto theke koto - 2 theke 2
    let newArray4 = s.slice(2, 2);
    console.log(newArray4); // []

    let newArray5 = s.slice(2, 4); // here only show position 2 to less than position 4
    console.log(newArray5); // [30, 40]

    /* flat() method */

    let w = [10, 20, 30, [77, 80], 40, [45, 60], 50];

    console.log(w.flat());
    // new array with sub-array elements concatenated to a specified depth.

    /* flatmap() method */

    // The flatMap() method first maps all elements of an array and then creates a new array by flattening the array.

    const num = [1, 2, 3, 4];
    const doubleOdds = num.flatMap((n) => (n % 2 == 1 ? [n * 2] : []));

    console.log(doubleOdds);

    const data1 = [[1], [2, 3], [4]];

    const flattened1 = data1.flatMap((x) => x.map((y) => y * 2));

    console.log(flattened1);

    let v = [10, 20, 30, [77, 80], 40, [45, 60], 50];

    let flattened = v.flat().map((x) => x * 2);

    // flat() first converts [10, [77, 80], 40] to [10, 77, 80, 40]
    // Then applies map to double each element

    console.log(flattened);

    let v1 = [10, 20, 30, [77, 80], 40, [45, 60], 50];

    let flatMapArray = v1.flatMap((x) =>
      Array.isArray(x) ? x.map((y) => y * 2) : [x * 2]
    );
    //If x is an array (Array.isArray(x)): apply map to double each element
    // if x is a number => return it doubled inside new array
    console.log(flatMapArray);

    // let v2 = [10, 20, 30, [77, 80], 40, [45, 60], 50];

    let reduceArray = v.reduce(
      (accumulator, x) =>
        accumulator.concat(Array.isArray(x) ? x.map((y) => y * 2) : x * 2),
      []
    );
    // starts with empty array [] as accumulator
    // for each element x:
    // if array: double its element & concatenation
    // if number: double and concatenation
    console.log(reduceArray);

    /* update array */
    let z = [10, 20, 30, 40, 50];

    z[3] = 67;
    z[2] = 77;

    console.log(z);
  </script>
</html>