What are Arrays? - Part I
Tags: javascript, beginners, programming, tutorial
Published: 2022-08-27 08:09:00


![arrays](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/6uweexl44ushy0733g5n.jpeg)Arrays are where you can store multiple elements in the same variable.  You can store numbers, strings, booleans, arrays, objects, etc.

Examples:

```javascript
const numbers = []; // empty array
const ages = [10, 21, 35, 45]; // array of numbers
const names = ['Dutches', 'Monty', 'Benny', 'Lucky', 'Chili']; // array of strings
const mixAndMatch = [25, false, 'Brody'] // mixed
```
###.length property

`.length` property gives the number of elements in an array.  

Examples:

```javascript
[].length; // 0

const numbers = [22, 35, 43, 49, 98];
numbers.length; // 5
```

`.length` is a property of objects that are instances of type array. Objects have a property, and that property tracks length. So length is like an object key. Calling it will return that value. 

###Get Element by Index

If you use square bracket [] syntax with an index starting at 0, you can retrieve a specific element from an array. 

For example:

```javascript
const members = ['Dutches', 'Monty', 'Benny', 'Lucky', 'Chili'];
members[2]; // 'Benny'
```

You can alternatively use the `.at(index)` method, which makes it simpler to locate the array's final element because it permits negative indices.

```javascript
const members = ['Dutches', 'Monty', 'Benny', 'Lucky', 'Chili'];
members.at(3); // 'Lucky'
members.at(-2); // 'Lucky'
```

###.push() method

The `.push()` method can be used to add an element to an array.

```javascript
const ages = [12, 25, 45, 49];
ages.push(64);// returns 5 (the new length of the array)
console.log(ages); // [12, 25, 45, 49, 64];
```

`Array.push()` returns the new length of the array.  

We were able to add new data into the variable ages even though it was defined with `const`. The `const` states that once a variable is defined, it can only be assigned once. The variable may not always be immutable, but the contents are flexible.

###Array.forEach()

One of the most important concepts in javascript is array iteration.

Let's imagine you want to loop (or iterate) through every element in an array of ages.

```javascript
const ages = [21, 35, 49];
ages.forEach(function(age) {
   // do something with individual age
   console.log(age);
});
```

**Always begin your `.forEach()` with a `console.log()` so you can visualize the transition from array to array item.**

The callback function can be executed for each element in the array using the `.forEach(callback)` method.

A `callback` is a function definition passed as an argument to another function.  

```javascript
function(ages) {
   // do something with individual age
   console.log(grade);
}
```
When a grade is received, this callback function logs it to the console. This is a function definition because it's not being executed. It just describes how the function will behave. On the other hand, the `.forEach()` method receives this function definition as an argument.

```javascript
ages.forEach(callBackHere);
```
When you combine them together, pass the function definition as an argument to the `.forEach()` method:

```javascript
ages.forEach(function(age) {
   // do something with individual age
   console.log(age)
});
```
The code above will print each age from the ages array to the console. 

```javascript
21 
35 
49
```