Object-Oriented JavaScript — Arrays
Tags: beginners, webdev, programming, javascript
Published: 2021-01-24 21:50:40

**Check out my books on Amazon at https://www.amazon.com/John-Au-Yeung/e/B08FT5NT62**

**Subscribe to my email list now at http://jauyeung.net/subscribe/**


JavaScript is partly an object-oriented language.

To learn JavaScript, we got to learn the object-oriented parts of JavaScript.

In this article, we’ll look at arrays.

### Array

`Array` is a built-in function that lets us create an array.

For instance, we can use it by writing:

```
const a = new Array();
```

This is the same as:

```
const a = [];
```

Either way, we can populate it by writing:

```
a[0] = 1;
a[1] = 2;
```

We can use the `Array` constructor to populate an array.

For instance, we can write:

```
const a = new Array(1, 2, 3, 4);
```

Then `a` is:

```
[1, 2, 3, 4]
```

We can create an array with some empty slots by passing in one integer.

For instance, we can write:

```
const a = new Array(5);
```

Then we get:

```
[empty × 5]
```

Arrays are just objects.

We can convert it to a string with the `toString` method.

For instance, we can write:

```
const a = new Array(1, 2, 3, 4);
console.log(a.toString());
```

And we get:

```
'1,2,3,4'
```

logged.

And we can get the constructor with:

```
console.log(a.constructor);
```

And we get:

```
ƒ Array() { [native code] }
```

logged.

We can use the `length` property to get the number of items in the array.

For instance, we can write:

```
const a = new Array(1, 2, 3, 4);
console.log(a.length);
```

Then we get 4.

We can set the `length` to a different number to change the array size.

If we set the `length` to something bigger than what it is now, then we get new entries in the array.

For instance, if we have:

```
const a = new Array(1, 2, 3, 4);
a.length = 5;
console.log(a);
```

And we get:

```
[1, 2, 3, 4, empty]
```

logged.

If we set the `length` to a shorter length than what it is now, then the array is truncated.

For instance, if we have:

```
const a = new Array(1, 2, 3, 4);
a.length = 2;
console.log(a);
```

And we get:

```
[1, 2]
```

### Array Methods

We can set use various array methods to manipulate arrays.

We can use the `push` method to add an entry to the end of the array.

For instance, if we have:

```
const a = [1, 2, 3, 4];
```

Then we can call `push` to add a new entry:

```
a.push(5);
```

And we get:

```
[1, 2, 3, 4, 5]
```

The `pop` method removes the last entry of the array.

For instance, we can write:

```
const a = [1, 2, 3, 4];
a.pop();
console.log(a);
```

Then we get:

```
[1, 2, 3]
```

We can use the `sort` method to sort an array.

For instance, we can write:

```
const a = [6, 3, 1, 3, 5];
const b = a.sort();
console.log(a);
```

Then we get:

```
[1, 3, 3, 5, 6]
```

it returns a new array with the entries sorted.

The `slice` method returns a part of an array without modifying the source array.

For instance, if we have:

```
const a = [1, 2, 3, 4, 5];
const b = a.slice(1, 3);
console.log(b);
```

Then we get:

```
[2, 3]
```

logged.

The `splice` method lets us modify the source array.

We can use it to remove a slice, return it, and optionally fills the gap with new elements.

For instance, we can write:

```
const a = [1, 2, 3, 4, 5];
b = a.splice(1, 2, 100, 101, 102);
console.log(a);
console.log(b);
```

Then `a` is:

```
[1, 100, 101, 102, 4, 5]
```

and `b` is:

```
[2, 3]
```

We replaced values from index 1 with 2 entries.

Then we replaced that with 100, 101, and 102.

The removed entries are returned.

### Conclusion

Arrays let us store data in sequence. They have various methods we can use to manipulate them.