Node.js - Modern JavaScript

This article is Part 3 of Working With NodeJS, a series of articles to help simplify learning Node.js. In this topic, I will cover some tips on modernizing your JavaScript code.

Introduction

So you were tasked to write some code in JavaScript, and you've completed the task. Now, you want to submit your code for review so it can be merge to the project repository. Here are some things you should consider to give your code a cleaner look.

Variables

Unpacking Arrays

const x = [1, 2, 3, 4, 5];

let [y, z] = x;
console.log(y); // 1
console.log(z); // 2

Use Case - x[0], x[1]

Object Destructuring

const user = { id: 1, firstName: 'John', lastName: 'Doe' };

const { firstName, lastName } = user;
console.log(firstName); // John
console.log(lastName); // Doe

Use Case - user.firstName and user.lastName

Conditional Initializing

const fee = isMember ? '$2.00' : '$10.00';

Use Case - if/else

Copying Object Properties

const obj1 = {
    name: 'John Doe',
    email: '[e-mail]',
};

const obj2 = {
    id: 1,
    ...obj1
};

Use Case - Object.assign({}, obj1);

Arrays

forEach to loop

const items = [
    { id: 1, name: "TV", price: 300 },
    { id: 2, name: "Stereo", price: 100 },
    { id: 3, name: "Computer", price: 1800 },
];

items.forEach((item) => { // do something... });

Use Case - I want to loop through each index in the array and do something to it.

map a new array

const items = [
    { id: 1, name: "TV", price: 300 },
    { id: 2, name: "Stereo", price: 100 },
    { id: 3, name: "Computer", price: 1800 },
];

const halfOffItems = items.map((item) => { 
    return {
        ...item,
        price: item.price / 2
    }
 });

Use Case - I want a new array containing new copies or changes of each array element.

filter an array

const items = [
    { id: 1, name: "TV", price: 300 },
    { id: 2, name: "Stereo", price: 100 },
    { id: 3, name: "Computer", price: 1800 },
];

const expensiveItems = items.filter(item => item.price > 500);

Use Case - I want a new array containing just the items I need.

reduce an array

const items = [
    { id: 1, name: "TV", price: 300 },
    { id: 2, name: "Stereo", price: 100 },
    { id: 3, name: "Computer", price: 1800 },
];

const itemTotal = items.map(item => item.price)
    .reduce((prev, next) => prev + next);
console.log(expensiveItems); // 2200

Use Case - I want to reduce my array to a single value.

find an element in array

const items = [
    { id: 1, name: "TV", price: 300, promo: false },
    { id: 2, name: "Stereo", price: 100 , promo: false },
    { id: 3, name: "Computer", price: 1800, promo: true },
];

const promoItem = items.find(item => item.promo);
console.log(promoItem); // returns third object in items

Use Case - I want to find a particular element in my array.

some an array

const items = [
    { id: 1, name: "TV", price: 300, promo: false },
    { id: 2, name: "Stereo", price: 100 , promo: false },
    { id: 3, name: "Computer", price: 1800, promo: true },
];

const hasPromo = items.some(item => item.promo);
console.log(hasPromo); // true

Use Case - I want to check if any value(s) in my array meet a certain condition.

Functions

Closures - I want to call a function within a function.

function init(type) {
    let id = 0;
    return (name) => {
        id += 1;
        return { id: id, type: type, name: name };
    }
}
const createUser = init('user');
const createBook = init('book');
const dave = createUser('Dave');
const book = createBook('A book');
console.log(dave); //prints {id: 1, type: 'user', name: 'Dave'}
console.log(book) //prints {id: 1, type: 'book', name:'A book'}

The createUser and createBook have access to separate instances of the init functions closure scope.

Closure 2 - Another approach

 function doFunc() {
     let id = 0;
    function doSomething() {
        console.log('Do something...');
    }
    function doWork(name, email) {
         id += 1;
        console.log('Do work on user', name);
    }
    return {
         doSomething: doSomething,
         doWork: doWork,
    };
}
const fn = doFunc();
fn.doSomething();
fn.doWork('Timmy', '[e-mail]');
// Do something...
// Do work on user Timmy

Destructure Parameters

function myFunc({ id, firstName, lastName }) {
    console.log(id); // 1
    console.log(firstName); // John
    console.log(lastName); // Doe
}
const user = { id: 1, firstName: 'John', lastName: 'Doe' };
myFunc(user);

Classes

Classes and inheritance are available in JavaScript

class Person {
    constructor(name) {
      this.name = name;
    }
    greet() {
      console.log(`Hello ${this.name}!`);
    }
  }

class Student extends Person {
    constructor(name, level) {
      super(name);
      this.level = level;
    }
    greet() {
      console.log(`Hello ${this.name} from ${this.level}`);
    }
  }

  const max = new Person("Max");
  const tina = new Student("Tina", "1st Grade");
  const mary = new Student("Mary", "2nd Grade");

  max.greet();
  tina.greet();
  mary.greet();

The purpose of this article was to demonstrate some modern JavaScript code. If you found this article helpful please leave a rating and subscribe to the series.