Categories
JavaScript Best Practices

JavaScript Best Practices — Functions Parameters, Errors, and Loops

Spread the love

JavaScript is an easy to learn programming language. It’s easy to write programs that run and does something. However, it’s hard to account for all the uses cases and write robust JavaScript code.

In this article, we’ll look at the best way to define and work with functions.

We also look at throwing exceptions and loops.

Parameters and Return Types

We’ve to be careful with how we add parameters and return types in our functions.

Default Parameters

Default parameters have been a feature since ES6.

We can use them to define parameters with default values.

This way, we can skip them or set them to undefined and our parameter will still be set a value.

For instance, we can define a parameter with a default value by writing:

function foo(a, b = 2) {
  //...
}

b is a default parameter. Its default value is 2.

This way, when we call it as follows:

foo(1);

b will be set to 2.

Spread Operator

The spread operator should be used instead of using apply to call a function with multiple parameters using array entries.

It works with both traditional and arrow functions, unlike the apply method, which only works with traditional functions.

For instance, we can write:

fn(...foo, ...bar, ...baz);

Assuming that foo , bar , and baz are arrays, we can call them with all the entries from them as arguments.

Also, we can use it to retrieve arguments that haven’t been assigned to a parameter as an array.

For instance, if we have:

function fn(...elements) {}

Then if we call it by running:

fn(1, 2, 3);

Then elements would be [1, 2, 3] .

String Literals

It’s easy to step into traps when using JavaScript strings. Therefore, we should follow some best practices.

Use Single Quotes

Single quotes are easier to type, so we may consider using them so we don’t have to press the shift key to add double-quotes.

Ordinary strings shouldn’t span multiple lines.

Template Literals

If we’re thinking about concatenating strings, then we should use template literals instead.

It’s also great for creating multiline strings.

For instance, we can write:

function add(a, b) {
  return `${a} + ${b} = ${a + b}`;
}

Then we interpolate a and b in the string expression.

We should never concatenate strings again now that we have template strings.

No Line Continuations

The \ character has problems for forming multiline strings.

If there are any trailing whitespace, then we’ll get errors.

Therefore, we should use template strings to make long strings.

For instance, we can write:

const veryLongStr = 'very long string';
const longerStr = 'very very long string';
const longestStr = 'very very very long string';
const str = `${veryLongStr} ${longerStr} ${longestStr}`;

Now we embed the string variable in the template string to put them together.

Number Literals

Number literals may be specified in decimal, hex, octal, or binary.

We should never include a leading 0 unless it’s followed by x , o , or b so that they won’t be confused with the base.

Control Structures

There are many things to think about when creating control structures.

We should be aware of them.

For Loops

There are a few kinds of for loops. One is regular for loop. The other is for-in and for-of loops.

for-in shouldn’t be used to iterate over arrays. They should be used for iterating over the keys of objects.

We should use Object.prototype.hasOwnProperty should check if the property is an own property or an inherited one.

This way, we can check that a key isn’t inherited before working with them.

for-of is a loop that can loop through any iterable object, including arrays.

We can use the Object.keys method to get the own string keys of an object and loop through them with the for-of loop.

It’s better than for-in since Object.keys returns an array and loop through them.

Exceptions

Exceptions are an important part of JavaScript.

We should use them whenever exceptional cases occur.

To use it properly, we should throw Error or subclasses of Error .

Other objects shouldn’t be throw, or we’ll throw away useful information like line numbers of where the error occurred and stack traces.

Throwing exceptions is better than other ad-hoc error handling approaches.

Conclusion

We should throw exceptions to make errors more obvious.

When we use throw , we should throw an Error object or a subclass of it.

JavaScript has default parameters. We can use them to set the value of the parameter when the argument isn’t passed in.

for-of loop is versatile and simple, so it’s better to use it.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *