8000 Add: array_method.js · deltanode/JavaScript-Arena@2bef337 · GitHub
[go: up one dir, main page]
Skip to content

Commit 2bef337

Browse files
deltanodedeltanode
committed
Add: array_method.js
1 parent 7fbed4a commit 2bef337

File tree

2 files changed

+257
-1
lines changed

2 files changed

+257
-1
lines changed

‎index.html

+2-1
Original file line numberDiff line numberDiff line change
@@ -13,12 +13,13 @@ <h1>JavaScript Arena ...</h1>
1313
<!-- <script src="js-core-concepts/01_execution_context.js"></script> -->
1414
<!-- <script src="js-core-concepts/02_scope.js"></script> -->
1515
<!-- <script src="js-core-concepts/03_this.js"></script> -->
16+
<script src="js-core-concepts/04_array_methods.js"></script>
1617

1718
<!-- Code Challenges - Programming Fundamentals -->
1819
<!-- <script src="code-challenges/01-programming-fundamentals/01_swap.js"></script> -->
1920
<!-- <script src="code-challenges/01-programming-fundamentals/02_precision_and_square_root.js"></script> -->
2021
<!-- <script src="code-challenges/01-programming-fundamentals/03_check_positive_negative_zero.js"></script> -->
21-
<script src="code-challenges/01-programming-fundamentals/04_random_number.js"></script>
22+
<!-- <script src="code-challenges/01-programming-fundamentals/04_random_number.js"></script> -->
2223

2324
<!-- Code Challenges - String -->
2425
<!-- <script src="code-challenges/02-string/01_replace_character.js"></script> -->

‎js-core-concepts/04_array_methods.js

+255
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,255 @@
1+
/**
2+
* Array Methodsin JavaScript:
3+
*
4+
* Array Method | Mutate Original Array | Return Value
5+
* ---------------|-----|------
6+
* - array.length | | It is a Array Property (not a Array method)
7+
*
8+
* - toString() | | A string representing the elements of the array.
9+
* - join() | | A string with all array elements joined. If arr.length is 0, the empty string is returned.
10+
* - concat() | | A new Array instance.
11+
* - splice() | Yes | An array containing the deleted elements. If no elements are removed, an empty array is returned.
12+
* - slice() | | A new array containing the extracted elements.
13+
* - indexOf() | | The first index of the element in the array; -1 if not found.
14+
* - lastIndexOf() | | The last index of the element in the array; -1 if not found.
15+
*
16+
* - forEach() | | undefined
17+
* - map() | |
18+
* - filter() | |
19+
* - reduce() | |
20+
* - some() | |
21+
* - every() | |
22+
* - flat() | |
23+
* - find() | |
24+
* - findIndex() | |
25+
* - sort() | |
26+
*
27+
* - array.pop() | |
28+
* - array.push() | |
29+
* - array.shift() | |
30+
* - array.unshift()| |
31+
*
32+
* - array delete() | |
33+
*
34+
* Reference:
35+
* - https://www.doabledanny.com/javascript-array-cheat-sheet
36+
* - https://dev.to/devsmitra/28-javascript-array-hacks-a-cheat-sheet-for-developer-5769
37+
* - https://htmlcheatsheet.com/js/
38+
*/
39+
40+
/**
41+
* Array methods are shared
42+
* - In JavaScript, all arrays are constructed from the global Array class.
43+
* - All array methods are stored in the Array.prototype object.
44+
*
45+
* - This means that array methods are shared between array instances via prototypal inheritance.
46+
* */
47+
const num = [11, 22, 33, 44, 5.5, 6.66, 77]
48+
const fruits = ["Banana", "Orange", "Apple", "Mango"]
49+
const arr = ["Apple", 11, 25.22222, true, false, NaN, null, undefined]
50+
51+
/**
52+
* Array.length
53+
*
54+
* - It is a Array Property.
55+
* - The length data property of an Array instance represents the number of elements in that array.
56+
* - The value is an unsigned, 32-bit integer that is always numerically greater than the highest index in the array.
57+
* */
58+
console.log(num.length) // 7
59+
console.log(fruits.length) // 4
60+
console.log(arr.length) // 8
61+
62+
/**
63+
* Array.prototype.toString()
64+
*
65+
* - Converts an array into a string of comma-separated array values.
66+
*
67+
* Syntax: toString()
68+
*
69+
* */
70+
console.log(num.toString()) // 11,22,33,44,5.5,6.66,77
71+
console.log(fruits.toString()) // Banana,Orange,Apple,Mango
72+
console.log(arr.toString()) // Apple,11,25.22222,true,false,NaN,,
73+
74+
/**
75+
* Array.prototype.join(separator)
76+
*
77+
* - Similar to toString, but you can specify the separator.
78+
* - The join() method creates and returns a new string by concatenating all of the elements in
79+
* an array, separated by commas or a specified separator string.
80+
* - If the array has only one item, then that item will be returned without using the separator.
81+
*
82+
* Syntax: join()
83+
* join(separator)
84+
*
85+
* */
86+
console.log(num.join()) // 11,22,33,44,5.5,6.66,77
87+
console.log(num.join("-")) // 11-22-33-44-5.5-6.66-77
88+
console.log(fruits.join(" ")) // Banana Orange Apple Mango
89+
console.log(arr.join(" and ")) // Apple and 11 and 25.22222 and true and false and NaN and and
90+
91+
/**
92+
* Array.prototype.concat()
93+
*
94+
* - The concat() method is used to merge two or more arrays.
95+
* - This method does not change the existing arrays, but instead returns a new array.
96+
* - Create a new array by concatenating existing arrays:
97+
*
98+
* Syntax: concat()
99+
* concat(value0)
100+
* concat(value0, value1)
101+
* concat(value0, value1, … , valueN)
102+
*
103+
* */
104+
let concatArr1 = num.concat(fruits)
105+
let concatArr2 = num.concat(fruits, arr)
106+
console.log(concatArr1) // [11, 22, 33, 44, 5.5, 6.66, 77, 'Banana', 'Orange', 'Apple', 'Mango']
107+
console.log(concatArr2) // [11, 22, 33, 44, 5.5, 6.66, 77, 'Banana', 'Orange', 'Apple', 'Mango', 'Apple', 11, 25.22222, true, false, NaN, null, undefined]
108+
109+
/**
110+
* Array.prototype.splice()
111+
*
112+
* - The splice() method can be used to add new items to an array.
113+
* - splice() returns an array with the deleted items.
114+
* - Since, splice() mutates the original array, it is often best to make a copy of it before splicing.
115+
*
116+
* Syntax: splice(start)
117+
* splice(start, deleteCount)
118+
* splice(start, deleteCount, item1)
119+
* splice(start, deleteCount, item1, item2, itemN)
120+
*
121+
* */
122+
123+
let fruits1 = [...fruits] // Shallow Copy
124+
125+
console.log(fruits1) // ['Banana', 'Orange', 'Apple', 'Mango']
126+
let splicedArr = fruits1.splice(1, 0, "A", "B")
127+
console.log(fruits1) // ['Banana', 'A', 'B', 'Orange', 'Apple', 'Mango']
128+
console.log(splicedArr) // []
129+
/* - The first parameter (1) defines the index from where the new elements should be added (spliced in).
130+
* - The second parameter (0) defines how many elements should be removed.
131+
* - The rest of the parameters ('A', 'B') define the new elements to be added.
132+
* */
133+
134+
let fruits2 = [...fruits] // Shallow Copy using spread operator
135+
136+
console.log(fruits2) // ['Banana', 'Orange', 'Apple', 'Mango']
137+
let splicedArr2 = fruits2.splice(1, 2, "A", "B", "C")
138+
console.log(fruits2) // (5) ['Banana', 'A', 'B', 'C', 'Mango']
139+
console.log(splicedArr2) // ['Orange', 'Apple']
140+
/* - The first parameter (1) defines the index from where the new elements should be added (spliced in).
141+
* - The second parameter (2) defines how many elements should be removed.
142+
* - The rest of the parameters ('A', 'B', 'C') define the new elements to be added.
143+
* */
144+
145+
let fruits3 = [...fruits, "Grapes", "Kiwi", "Guava"] // Shallow Copy using spread operator
146+
147+
console.log(fruits3) // ['Banana', 'Orange', 'Apple', 'Mango', 'Grapes', 'Kiwi', 'Guava']
148+
let splicedArr3 = fruits3.splice(1, 3)
149+
console.log(fruits3) // (5)  ['Banana', 'Grapes', 'Kiwi', 'Guava']
150+
console.log(splicedArr3) // ['Orange', 'Apple', 'Mango']
151+
/* - The first parameter (1) defines the index from where the new elements should be added (spliced in).
152+
* - The second parameter (2) defines how many elements should be removed.
153+
* - The rest of the parameters (optional) define the new elements to be added.
154+
* */
155+
156+
/**
157+
* Array.prototype.slice()
158+
*
159+
* - slice() slices out a piece of an array, and returns it in a new array:
160+
* - The original array will not be modified.
161+
* - The slice() method returns a shallow copy of a portion of an array into a new array object
162+
* - selected from start to end (end not included) where start and end represent the index of items in that array.
163+
*
164+
* Syntax: slice()
165+
* slice(start)
166+
* slice(start, end) (Note: As, the "end" index value is not included in the returned array.
167+
* So, value in retured array will included till index "end-1" )
168+
*
169+
* */
170+
console.log(fruits) // ['Banana', 'Orange', 'Apple', 'Mango']
171+
console.log(fruits.slice()) // ['Banana', 'Orange', 'Apple', 'Mango']
172+
console.log(fruits.slice(2)) // ['Apple', 'Mango']
173+
console.log(fruits.slice(0, 2)) // ['Banana', 'Orange']
174+
console.log(fruits.slice(1, 2)) // ['Orange']
175+
console.log(fruits.slice(1, 3)) // ['Orange', 'Apple']
176+
console.log(fruits.slice(0, 3)) // ['Banana', 'Orange', 'Apple']
177+
console.log(fruits) // ['Banana', 'Orange', 'Apple', 'Mango']
178+
179+
/**
180+
* Array.prototype..indexOf()
181+
*
182+
* - Find the first index that contains a certain value (searches from left to right) or -1 if it is not present.
183+
*
184+
* Syntax: indexOf(searchElement)
185+
* indexOf(searchElement, fromIndex)
186+
*
187+
* */
188+
let fruits4 = [...fruits, "Apple", "Kiwi", "Apple"]
189+
console.log(fruits4) //  ['Banana', 'Orange', 'Apple', 'Mango', 'Apple', 'Kiwi', 'Apple']
190+
console.log(fruits4.indexOf("Apple")) // 2
191+
console.log(fruits4.indexOf("Apple", 3)) // 4
192+
console.log(fruits4.indexOf("Apple", 4)) // 4
193+
console.log(fruits4.indexOf("Apple", 5)) // 6
194+
console.log(fruits4.indexOf("Apple", 7)) // -1
195+
console.log(fruits4.indexOf("ap")) // -1
196+
console.log(fruits4.indexOf("apple")) // -1
197+
198+
/**
199+
* Array.prototype.lastIndexOf()
200+
*
201+
* - Find the last index that contains a certain value (searches from right to left) or -1 if it is not present.
202+
* - The array is searched backwards, starting at fromIndex.
203+
*
204+
* Syntax: lastIndexOf(searchElement)
205+
* lastIndexOf(searchElement, fromIndex)
206+
*
207+
* */
208+
console.log(fruits4) //  ['Banana', 'Orange', 'Apple', 'Mango', 'Apple', 'Kiwi', 'Apple']
209+
console.log(fruits4.lastIndexOf("Apple")) // 6
210+
console.log(fruits4.lastIndexOf("Apple", 3)) // 2
211+
console.log(fruits4.lastIndexOf("Apple", 4)) // 4
212+
console.log(fruits4.lastIndexOf("Apple", 5)) // 4
213+
console.log(fruits4.lastIndexOf("Apple", 7)) // 6
214+
console.log(fruits4.lastIndexOf("Apple", 1)) // -1
215+
console.log(fruits4.lastIndexOf("ap")) // -1
216+
console.log(fruits4.lastIndexOf("apple")) // -1
217+
218+
/**
219+
* Array.prototype.forEach()
220+
*
221+
* - The forEach() method executes a provided function once for each array element.
222+
* - forEach() is used to loop through the array.
223+
*
224+
* - The forEach method is basically just a shorter way of writing:
225+
* for(let i = 0; i < arr.length; i++) {...}.
226+
* - It loops through the given array, and calls the given call-back function for each of the elements in the array.
227+
*
228+
* Syntax: forEach(callbackFn)
229+
* forEach(callbackFn, thisArg)
230+
*
231+
* - callbackFn: The call-back passed to the forEach() function can accept any of the three arguments:
232+
* -> element : The current element being processed in the array.
233+
* -> index : The index of the current element being processed in the array.
234+
* -> array : The array forEach() was called upon.
235+
* - thisArg: A value to use as this when executing callbackFn.
236+
* */
237+
console.log(fruits) // (4) ['Banana', 'Orange', 'Apple', 'Mango']
238+
fruits.forEach(element => console.log(element))
239+
// Banana
240+
// Orange
241+
// Apple
242+
// Mango
243+
244+
/**
245+
* Array.prototype.
246+
*
247+
* -
248+
* -
249+
*
250+
* Syntax:
251+
*
252+
* */
253+
// console.log(num.) //
254+
// console.log(fruits.) //
255+
// console.log(arr.) //

0 commit comments

Comments
 (0)
0