Maintainable JavaScript — Undefined, Arrays, and Objects
Tags: javascript, webdev, beginners, codequality
Published: 2020-10-19 00:55:16

---
title: Maintainable JavaScript — Undefined, Arrays, and Objects
published: true
date: 2020-07-29 19:55:54 UTC
tags: javascript,webdev,beginner,codequality
canonical_url: https://thewebdev.info/2020/07/29/maintainable-javascript%e2%80%8a-%e2%80%8aundefined-arrays-and-objects/?utm_source=rss&utm_medium=rss&utm_campaign=maintainable-javascript%25e2%2580%258a-%25e2%2580%258aundefined-arrays-and-objects
---

**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/**

Creating maintainable JavaScript code is important if want to keep using the code.

In this article, we’ll look at the basics of creating maintainable JavaScript code with some conventions for `undefined` .

### Undefined

`undefined` is a value that’s often confused with `null` .

This is partly because `null == undefined` returns `true` .

However, they’re actually very different from each other.

Variables that haven’t been assigned a value have the initial value of `undefined` .

This means it’s waiting for a real value to be assigned to it.

If we have:

```
let animal;
console.log(animal === undefined);

```

Then the console log will log `true` .

`undefined` shouldn’t be used much in our code.

But we need to check for them so that we’ll avoid all sorts of runtime errors.

We often get things that are `undefined` .

Non-existent properties have value `undefined` .

Parameters that haven’t have an argument passed in for it is also `undefined` .

If we try to do something to something that’s `undefined` , then we’ll get an error.

Therefore, we need to check for them.

To check for `undefined` , we can use the `typeof` operator.

If something is `undefined` , `typeof` will return `'undefined'` .

For example, we can write:

```
let animal;
console.log(typeof animal);

```

Then we get `'undefined’` logged.

We shouldn’t use it for assignments, but we should check for them.

### Object Literals

Object literals is a popular way to create objects with a set of properties.

It’s shorter than using the `Object` constructor and does the same thing.

Therefore, we should use the object literal notation to create an object.

For example, instead of writing:

```
let book = new Object();
book.title = "javascript for beginners";
book.author = "jane smith";

```

We should write:

```
let book = {
  title: "javascript for beginners",
  author: "jane smith"
}

```

It’s shorter and cleaner.

We just specify all the properties and values in between the curly braces.

We include the opening curly brace in the first line.

The properties are indented one level.

And the closing brace is in its own line.

Most style guides and linters suggest this format.

Guides like the Google style guide, Airbnb, style guide, ESLint default rules, etc. all look for this style.

### Array Literals

Like object literals, we don’t need the `Array` constructor to create arrays.

Instead, we use the array literal notation.

For instance, instead of writing:

```
let fruits = new Array("apple", "orange", "grape");
let numbers = new Array(1, 2, 3, 4);

```

We write:

```
let fruits = ["apple", "orange", "grape"];
let numbers = [1, 2, 3, 4];

```

It’s much shorter and does the same thing.

It’s widely used and it’s common in JavaScript.

The `Array` constructor also has 2 versions.

It returns an array with the arguments if we pass in multiple arguments.

If there’s only one argument and it’s a nonnegative integer, then it creates an array with the number of empty slots as indicated by the argument.

Therefore, it’s another reason to avoid the `Array` constructor.

### Conclusion

We can work with `undefined` , objects and arrays in better ways.

Literals are better than constructors for arrays and objects.

The post [Maintainable JavaScript — Undefined, Arrays, and Objects](https://thewebdev.info/2020/07/29/maintainable-javascript%e2%80%8a-%e2%80%8aundefined-arrays-and-objects/) appeared first on [The Web Dev](https://thewebdev.info).