Фабричные функции в JavaScript с примерами

В этом руководстве вы узнаете о фабричных функциях JavaScript, которые возвращают объекты.

Фабричная функция — это функция, которая возвращает новый объект. Следующий пример создает объект человека с именем person1 :

let person1 = {
    firstName: 'John',
    lastName: 'Doe',
    getFullName() {
        return this.firstName + ' ' + this.lastName;
    },
};
console.log(p1.getFullName());

Выход:

John Doe

Объект person1 имеет два свойства: firstName и lastName и один метод getFullName(), который возвращает полное имя.

Предположим, что вам нужно создать еще один подобный объект с именем person2, вы можете продублировать код следующим образом:

let person2 = {
    firstName: 'Jane',
    lastName: 'Doe',
    getFullName() {
        return this.firstName + ' ' + this.lastName;
    },
};
console.log(jane.getFullName());

Выход:

Jane Doe

В этом примере объекты person1 и person2 имеют одинаковые свойства и методы.

Проблема в том, что чем больше объектов вы хотите создать, тем больше у вас будет повторяющегося кода.

Чтобы избежать повторного копирования одного и того же кода, вы можете определить функцию, которая создает объект person :

function createPerson(firstName, lastName) {
    return {
        firstName: firstName,
        lastName: lastName,
        getFullName() {
            return firstName + ' ' + lastName;
        },
    };
}

Когда функция создает и возвращает новый объект, она называется фабричной функцией. createPerson() — это фабричная функция, поскольку она возвращает новый объект person.

Ниже показано, как использовать фабричную функцию createPerson() для создания двух объектов person1 и person2 :

function createPerson(firstName, lastName) {
    return {
        firstName: firstName,
        lastName: lastName,
        getFullName() {
            return firstName + ' ' + lastName;
        },
    };
} 
let person1 = createPerson('John', 'Doe'); 
let person2 = createPerson('Jane', 'Doe'); 
console.log(person1.getFullName()); 
console.log(person2.getFullName());

Используя фабричную функцию, вы создадите любое количество объектов- person без дублирования кода.

Когда вы создаете объект, движок JavaScript выделяет ему память. Если вы создаете много объектов- person, движку JavaScript требуется много места в памяти для хранения этих объектов.

Однако у каждого объекта- person есть копия одного и того же getFullName(). Это неэффективное управление памятью.

Чтобы избежать дублированияgetFullName() в каждом объекте, вы можете удалить метод getFullName() из объекта person :

function createPerson(firstName, lastName) {
    return {
        firstName: firstName,
        lastName: lastName
    }
}

И переместите этот метод на другой объект:

var personActions = {
    getFullName() {
        return this.firstName + ' ' + this.lastName;
    },
};

И перед вызовом getFullName() для объекта person вы можете назначить метод объекта personActions объекту person следующим образом:

let person1 = createPerson('John', 'Doe'); 
let person2 = createPerson('Jane', 'Doe'); 
person1.getFullName = personActions.getFullName; 
person2.getFullName = personActions.getFullName; 
console.log(person1.getFullName()); 
console.log(person2.getFullName());

Этот подход не масштабируется, если у объекта много методов, потому что вам нужно вручную назначать их по отдельности. Вот почему в игру вступает метод Object.create().

Метод Object.create()

Метод Object.create() создает новый объект, используя существующий объект в качестве прототипа нового объекта:

Object.create(proto, [propertiesObject])

Таким образом, вы можете использовать Object.create() следующим образом:

var personActions = {
    getFullName() {
        return this.firstName + ' ' + this.lastName;
    },
};
function createPerson(firstName, lastName) {
    let person = Object.create(personActions);
    person.firstName = firstName;
    person.lastName = lastName;
    return person;
}

Теперь вы можете создавать объекты person и вызывать методы объекта personActions :

let person1 = createPerson('John', 'Doe'); 
let person2 = createPerson('Jane', 'Doe'); 
console.log(person1.getFullName()); 
console.log(person2.getFullName());

Код работает отлично. Однако на практике вы редко будете использовать фабричные функции. Вместо этого часто используются классы или шаблоны конструктора/прототипа.

Заключение

• Фабричная функция — это функция, которая возвращает новый объект.
• Используйте Object.create() для создания нового объекта с помощью существующего объекта в качестве прототипа.