Arrays sounds nice (JS)💸

It’s time to ask for a raise, and learn about arrays.

🤷‍♀ Basics

Index
Indices in arrays are 0 based.

Length
Length of an array is measured by how many items it has.
The number of indices could be found by length-1.

Declare an array
There are two ways of declaring arrays.
Note: In JavaScript, an array doesn’t have to have all elements of the same types.

Nested array
You can nest them as much as you want

Reference vs Value
One of the best videos about this subject can be found here!
Arrays are Object. Object are assigned by references.
That is, let say we assign an array to variable b .Let’s say we also assign b to variable c. If we then modify b, changes will also be affect c as they both point to the same memory address.

However, with primitive values, such as number, string and char, they are passed by value.

Duplicates are allowed

➕ Add to an array

‣ Index

Let array c be of length 3 (from the previous example).
If we add, c[5] and skip c[3] and c[4] , the length of the array is actually 6, as it pads undefined element to the indexes we missed.

‣ Push()

Adds received params to the end of the array.
Behind the scenes: will modify the memory address allocated to the array.

Push can take many params:

‣ Spread operator

Adds received params to the end of the array.
Behind the scenes: will create a new memory allocation & assign all the items within the array x to new array y.

‣ Contact()

Acts the same way as the spread operator.
Takes an array as a parameter, and “spreads” the item within the array.
Just like the spread operator, contact doesn’t actually modify b

If you want to add an array to an array, wrap the items in another []

‣ Unshift()

Adds received params to the beginning of the array.
Behind the scenes: will modify the arrays memory address, and “push” everything to index +1

Remove from an array ➖:

‣ Pop()

Removes last element in the array
Behind the scene: will actually modify the array’s memory address.

‣ Shift()

Will remove from the begging of the array. Similar to unshift, that adds in the front.
Behind the scene: will actually modify the array’s memory address.

‣ Delete — well…. does it really?

Behind the scene: will actually modify the array’s memory address and will assign the value undefined to a given index.
The length of the array doesn’t change.

this code is equivalent to:

Recall falsy values are: [] , {}, false , undefined , null
To get rid rid of the falsy values we can do the following:
In this case, we filter for “truthy” values.

Don’t worry about filter() , we talk about it in the next few sections.

‣ Length

We can reduce array’s length nto m.
Which will remove n-m elements from the array.
Behind the scene: will actually modify the array’s memory address.

You can also reset the array length to 0 like this:

‣ Splice()

Behind the scene: will actually modify the array’s memory address.

• splice() — if no params passed, will remove nothing
• splice(x) — if one param passed, will keep all elements after this x (including)
• splice(x,y) — will “cut” the elements starting at x, until it cut y elements

Other cool and useful methods ✨:

‣ Map()

Each element within the array will have some sort of function applied on it.
Behind the scene: will not actually modify the array’s memory address.

‣ ForEach()

Behind the scene: Simply loops through the array. Doesn't modify or return anything.

So why not use map? what’s the use?
Following the map example above, what if c=[1,2,'some sentence', 3]
We would not be able to to perform x+1 on each.
Instead:

‣ Splice()

We meet splice again 🤝🏻

Here we are removing and adding data at the same time.
The first argument of splice will be the starting index.
The second argument of splice will be an indicator from where to keep the old array.

Another example:
We will insert ["hello"] at index 0, and keep the old array from index 2

‣ Splice() vs Slice()

They are very similar in what they do but
splice: will modify the actual memory address.

slice: will not modify the actual memory address, will return a new array with the expected result. For example:

‣ Filter()

Takes in a lambda expression which will evaluate to true or false on each value.
Behind the scene: will not actually modify the array’s memory address.
All the values in the array that have evaluated to true will be added to a new array.

🔥The same as filter, just return the first match

‣ Fill()

Create a new array of length n and fill with x
I have seen people use this one a lot for test data.

🔥 Conclusion 🔥

There are A LOT more methods, those are the once’s I use the most.
The way best to learn about arrays, is simply practicing it in your personal projects or even play around the JS console in your browser.

You will discover how (‘ba’ + + ‘s’ +’as’) JS is.
Yes, baNaNas”! 🍌.

P.S:

Explaining jokes makes them not funny more. I will still explain this one 😉.

‘ba’ + + ‘s’ +’as’ is baNaNas because:

• You can contact characters together like so:

console.log('b' + 'a') //ba

• the + operator is used to convert a string/char to a number

console.log(typeof '3') //string
console.log(typeof +'3')// number

• but the + operator will not convert ‘s’ to a number, it will be NaN
  hence: baNaNas 🍌.

Until next time,

LaraMo