# JavaScript Arrays 101 When I started learning JavaScript, one thing became clear very quickly: storing one value is easy, but storing many related values one by one can become messy. For example, imagine I want to store my favorite fruits: `let fruit1 = "Apple"; let fruit2 = "Banana"; let fruit3 = "Mango"; ` This works, but it does not feel clean. What if I have 10 fruits? Or 50? That is where **arrays** become useful. In this article, we’ll understand what arrays are, why we use them, how to create them, access values, update values, check their length, and loop through them in a simple beginner-friendly way. ## **What Is an Array?** An array is a **collection of values stored in order**. Instead of creating many separate variables, we can store multiple values inside one array. For example: `let fruits = ["Apple", "Banana", "Mango"]; ` Here, fruits is an array that stores three values. So instead of writing: `let fruit1 = "Apple"; let fruit2 = "Banana"; let fruit3 = "Mango"; ` we can simply write: `let fruits = ["Apple", "Banana", "Mango"]; ` That is much cleaner and easier to manage. ## **Why Do We Need Arrays?** Arrays help us when we want to store multiple related values in one place. For example, we might want to store: * a list of fruits * marks of students * daily tasks * favorite movies * names of friends Without arrays, we would need many separate variables. With arrays, we can manage everything in a much better way. ## **How to Create an Array** We create an array using square brackets \[\]. ### **Example** `let fruits = ["Apple", "Banana", "Mango"]; ` This array contains three string values. We can also create an array of numbers: `let marks = [85, 90, 78, 92]; ` Or a simple task list: `let tasks = ["Study", "Exercise", "Read"]; ` ## **Arrays Store Values in Order** One important thing I learned is that arrays store values in a fixed order. Each value gets a position number called an **index**. But here is the important part: **Array indexing starts from 0, not 1.** That means: `let fruits = ["Apple", "Banana", "Mango"]; ` * "Apple" is at index 0 * "Banana" is at index 1 * "Mango" is at index 2 ## **Visual Representation of Array Index and Values** `Index: 0 1 2 Value: ["Apple", "Banana", "Mango"] ` This is one of the first things beginners need to remember about arrays. ## **Accessing Elements Using Index** We can access any array element by using its index. ### **Example** `let fruits = ["Apple", "Banana", "Mango"]; console.log(fruits[0]); // Apple console.log(fruits[1]); // Banana console.log(fruits[2]); // Mango ` If I want the first value, I use index 0. That feels a little strange in the beginning, but after a bit of practice, it becomes natural. ## **Printing the First and Last Element** Let’s say we have an array of movies: `let movies = ["Inception", "Interstellar", "3 Idiots", "Bahubali", "Dangal"]; ` To print the first element: `console.log(movies[0]); // Inception ` To print the last element: `console.log(movies[4]); // Dangal ` Because the array has 5 items, the last index is 4. ## **Updating Elements in an Array** We can also change values inside an array. ### **Example** `let fruits = ["Apple", "Banana", "Mango"]; fruits[1] = "Orange"; console.log(fruits); ` Output: `["Apple", "Orange", "Mango"] ` Here, I changed "Banana" to "Orange". So arrays are not just for storing values. We can also update them whenever needed. ## **Array Length Property** Every array has a length property. It tells us how many elements are inside the array. ### **Example** `let fruits = ["Apple", "Banana", "Mango"]; console.log(fruits.length); // 3 ` This is very useful because we do not always want to count elements manually. ### **Example with Movies** `let movies = ["Inception", "Interstellar", "3 Idiots", "Bahubali", "Dangal"]; console.log(movies.length); // 5 ` So the array has 5 elements. ## **Memory-Style Array Diagram** Here is a simple way to visualize an array: `movies | |-- [0] -> "Inception" |-- [1] -> "Interstellar" |-- [2] -> "3 Idiots" |-- [3] -> "Bahubali" |-- [4] -> "Dangal" ` This makes it easier to understand that each value is stored at a different index. ## **Basic Looping Over Arrays** When I first learned arrays, I quickly realized that printing each item one by one is not practical. For example: `let fruits = ["Apple", "Banana", "Mango"]; console.log(fruits[0]); console.log(fruits[1]); console.log(fruits[2]); ` This works for small arrays, but what if the array has 20 items? That is why we use a loop. ### **Using a for Loop** `let fruits = ["Apple", "Banana", "Mango"]; for (let i = 0; i < fruits.length; i++) { console.log(fruits[i]); } ` Output: `Apple Banana Mango ` ### **How This Works** * i = 0 starts from the first index * i < fruits.length keeps the loop running until the last element * fruits\[i\] gives the value at the current index This is the most basic and useful way to loop through an array as a beginner. ## **Assignment Example** Let’s do the full practice task. ### **Create an Array of 5 Favorite Movies** `let movies = ["Inception", "Interstellar", "3 Idiots", "Bahubali", "Dangal"]; ` ### **Print the First and Last Element** `console.log(movies[0]); // Inception console.log(movies[4]); // Dangal ` ### **Change One Value and Print Updated Array** `movies[2] = "Zindagi Na Milegi Dobara"; console.log(movies); ` Output: `["Inception", "Interstellar", "Zindagi Na Milegi Dobara", "Bahubali", "Dangal"] ` ### **Loop Through the Array and Print All Elements** `for (let i = 0; i < movies.length; i++) { console.log(movies[i]); } ` ## **Quick Summary** * Arrays store multiple values in one place * Arrays keep values in order * Indexing starts from 0 * We use array\[index\] to access values * We can update elements using their index * length tells us how many elements are in the array * Loops help us print or use all array elements easily ## **Easy Way to Remember** This is the simplest way I think about arrays: * array = a list of values * index = position of a value * first index = 0 * length = total number of items ## **Final Thoughts** When I first learned arrays, they felt like a small topic. But very quickly, I realized arrays are used everywhere in JavaScript. If you understand arrays well, many other topics become easier later. My advice is simple: create a small array on your own, access some values, change one value, and loop through it. That little bit of practice makes the concept much clearer.