Factory functions | Noroff Front-end Development

Introduction

Consider the following object. What if youwanted to have multiple people using the exact same shape as below? You’d have to copy all of that code, and if you ever wanted to make a change such as change the greet function, then you’d have to make that same change across all of your objects.

const person = {
  firstName: 'Ola',
  lastName: 'Nordmann',
  address: {
    country: 'Norway',
    city: 'Oslo',
  },
  greet: function () {
    console.log('Hello world!');
  },
};

We can instead create a factory function.

function createPerson(firstName, lastName, country, city) {
  return {
    firstName: firstName,
    lastName: lastName,
    address: {
      country: country,
      city: city,
    },
    greet: function () {
      console.log(`Hello, I am ${this.firstName} ${this.lastName}.`);
    },
  };
}

const ola = createPerson('Ola', 'Nordmann', 'Norway', 'Oslo');
ola.greet();

Use cases

Factory functions are very useful and can be frequently used depending on the codebase.

A common use case for Factory Functions is for Jest testing, where you use a Factory Function to generate a common object that is used throughout your tests.

This allows one to modify the shape easily if something such as the API ever changes its data shape.

Lesson task

You are going to practise creating your own factory function.

Goal

To be able to create a factory function.

Brief

Complete the Level 1 process.

NOTE: Lesson tasks do not get submitted on Moodle and are not assessed by tutors. They are mainly there for you to practise what you have learned in the lesson.

Level 1 process

Create a factory function called createAnimal.
It should have the following properties:

2.1 name string, which is the name of the animal e.g. Jasper, Marley, Pookie etc. 2.2 type string, which is the animal type .e.g. dog, cat etc. 2.3 food string, which is the food the animal eats e.g. dog food, kibble, fish food etc.
It should have the method eat. This method should use the name, type and food property to console.log what the name of the animal is eating e.g.

// If we pass in 'Jasper' and 'dog food', we should console.log the following:
// Jasper is a dog and eats dog food.

// If we pass in 'Pookie' and 'cat food', we should console.log the following:
// Pookie is a cat and eats cat food.

You should then be able to create an animal from this createAnimal factory function using the following line of code:

const myAnimal = createAnimal('dog', 'mammal', 'Jasper', 'dog food');

myAnimal.eat();
// Logs:
// Jasper is a dog and eats dog food.

Additional resources

Patterns.dev: Factory Pattern

SessionStack: How JavaScript works: the factory design pattern + 4 use cases

Tags: