Imagine for a second that you are outside in your backyard raking leaves. Now think about all of the operations performed within your body that allow for that to happen. More specifically think about what your brain tells the rest of your body. In a way your body communicates using a type of code. And that code allows your brain to pass information to parts of the body telling it when to pull back the rake and how far to move it. Your body then sends information back to your brain informing it of the movement in the form of sensory and visual information. For our purposes, you can consider the information being passed from the brain to the body as our arrays. The parts of the brain and body that do something with the information or arrays we can consider the lines of code or the program. While you need to know where the arrays are coming from, the ability to manipulate and edit that information once passed can make it useful in many ways than simply displaying it once received.
An array is a single variable that can hold many elements inside of itself. These elements can generally be a combination of numbers, Booleans, strings, symbols, objects, null and undefined. Arrays are a great tool because you can use all of these at the same time in the same array. You can even use key/value pairs or multiple objects with objects nested inside of them as well.
Array methods are the tools you will use to access and change the information contained within an array based on specific selections. The more proficient you are at using array methods the more options you will have that allow you to create functions and events that require less code making it easier to read.
comboNames = ["Apple", "Pear", "Apple", "Melon", "Apple"];
let map = comboNames.reduce((cnt, cur) => (cnt[cur] = cnt[cur] + 1 || 1, cnt), {});
console.log(map)
//{"Apple": 3, "Pear": 1, "Melon": 1}
In the code displayed above we use the .reduce() method on an array of fruits. This method allows you to take an array that contains many of the same value and reduces it to that variable and the amount of it that was contained in the array. It then displays them as key/value pairs in a new array that we created.
If you have something inside of a large array that you want to use it would help if if there was a way to find its specific location within that array. You could then run a different method to do something with it based on the found location. See below:
comboNames = ["Apple", "Pear", "Apple", "Melon", "Apple"];
let index = comboNames.indexOf("Apple");
console.log(index);
//[0]
if (index > -1) {
comboNames.splice(index, 1);
}
console.log(comboNames)
//["Pear", "Apple", "Melon", "Apple"];
Now in the code displayed above we have an array of fruit. Some of the fruit is in the array multiple times. If for some reason you have to remove one of the fruit from that array you have to find it first. There's more to it than just finding it on the screen. Sometimes you'll work with very large arrays and for the computer to remove it, you have to find the specific index of that item within the array. For that we can use .indexOf() at the end of the array variable. In the parentheses you place whatever it is you need to find. Using .indexOf() will return the index value for the location of the first item that matches what it is looking for.
Index of displays an index for an array starting at 0 for whatever it searches for. If it does not locate what it is told to it will return a -1. Using that we can create an if statement telling it to only run some code if the index that is returned is greater than -1. We can use the .slice() method on the array when the if statement returns true. There are so many intricate ways you can use array methods to improve your code. It simply takes some problem solving skills tied in with your knowledge of the methods you can employ to make the code work for you.
One interesting thing to note about arrays is that it can also be used to retrieve both functions and callback functions when called upon properly. See below:
const your_function = function(){ console.log("I am your function")};
const group = [0, "string", false, your_function];
group[3]();
//"I am your function"
As shown above you can call the function using a variable that is inside of the array. Simply call the array variable name and its index. Once it returns that value it then will run the function the variable calls on. This is just another example of how you can manipulate an array to do what you want in a different way. But the main thing to note is that practicing the various methods like those not shown here is how you improve your code.
Top comments (0)