DEV Community

Cover image for Menggunakan Builder Class Untuk Membuat Object
Aris アリス
Aris アリス

Posted on

3 2

Menggunakan Builder Class Untuk Membuat Object

Hai teman-teman 👋

Kali ini saya akan membagikan tentang penggunaan builder class. Pada umumnya, ketika kita akan membuat object, maka kita langsung melakukan instansiasi dari class referensinya seperti contoh berikut:

class Person {
    constructor (firstName, phone, email) {
        this.firstName = firstName;
        this.phone = phone;
        this.email = email;
    }
}

const andi = new Person('Andi', '081234567890', 'andi@email.net');
const budi = new Person('Budi', '081234567891', 'budi@email.net');
const carli = new Person('Carli', '081234567892', 'carli@email.net');
Enter fullscreen mode Exit fullscreen mode

Cara di atas sangat umum digunakan, akan tetapi jika kita perlu mengubah susunan constructor dari class Person akan sedikit merepotkan. Misalkan saya ingin menambahkan variabel lastName setelah variabel firstName, akibatnya kita juga harus mengubah kode saat instansiasi objek dari class Person satu per satu. Apabila kita tidak merubahnya, maka variabel lastName akan terisi oleh nomor hp dan variabel nomor hp akan terisi dengan email. Dikarenakan alasan tersebut, kita perlu menggunakan builder class untuk meminimalisir perubahan kode yang signifikan. Berikut contoh penggunaan builder class:

class Person {
    constructor (firstName, phone, email) {
        this.firstName = firstName;
        this.phone = phone;
        this.email = email;
    }
}

class PersonBuilder {
    constructor() {
        this.firstName = '';
        this.phone = '';
        this.email = '';
    }

    setFirstName(firstName) {
        this.firstName = firstName;
        return this;
    }

    setPhone(phone) {
        this.phone = phone;
        return this;
    }

    setEmail(email) {
        this.email = email;
        return this;
    }

    build() {
        return new Person(this.name, this.phone, this.email);
    }
}

const andi = new PersonBuilder()
    .setFirstName('Andi')
    .setPhone('081234567890')
    .setEmail('andi@email.net')
    .build();

const budi = new PersonBuilder()
    .setFirstName('Budi')
    .setPhone('081234567891')
    .setEmail('budi@email.net')
    .build();

const carli = new PersonBuilder()
    .setFirstName('Carli')
    .setPhone('081234567892')
    .setEmail('carli@email.net')
    .build();
Enter fullscreen mode Exit fullscreen mode

Mungkin kode di atas terlihat lebih kompleks, akan tetapi jika kita akan merubah susunan constructor pada class Person kita tidak harus merubah setiap kode saat menginstansiasi objek dari class Person. Kita hanya perlu melakukan penyesuaian pada builder classnya. Misalkan saya akan menambah variabel lastName setelah variabel firstName pada constructor class Person, pada builder class kita dapat menambah method untuk melakukan setting lastName. Pada kode instansiasi objek pun opsional mau ditambahkan lastName atau tidak. Jika kita tidak melakukan setting lastName juga tidak akan menyebabkan data yang tertukar seperti nomor hp terbaca sebagai lastName. Berikut contoh kodenya:

class Person {
    constructor (firstName, lastName, phone, email) {
        this.firstName = firstName;
        this.lastName = lastName;
        this.phone = phone;
        this.email = email;
    }
}

class PersonBuilder {
    constructor() {
        this.firstName = '';
        this.lastName = '';
        this.phone = '';
        this.email = '';
    }

    setFirstName(firstName) {
        this.firstName = firstName;
        return this;
    }

    setLastName(lastName) {
        this.lastName = lastName;
        return this;
    }

    setPhone(phone) {
        this.phone = phone;
        return this;
    }

    setEmail(email) {
        this.email = email;
        return this;
    }

    build() {
        return new Person(this.name, this.phone, this.email);
    }
}

const andi = new PersonBuilder()
    .setFirstName('Andi')
    .setLastName('Santoso')
    .setPhone('081234567890')
    .setEmail('andi@email.net')
    .build();

const budi = new PersonBuilder()
    .setFirstName('Budi')
    .setPhone('081234567891')
    .setEmail('budi@email.net')
    .build();

const carli = new PersonBuilder()
    .setFirstName('Carli')
    .setPhone('081234567892')
    .setEmail('carli@email.net')
    .build();
Enter fullscreen mode Exit fullscreen mode

Pada kode di atas, walaupun saya menambahkan variabel lastName, itu tidak mewajibkan kita untuk merubah kode saat instansiasi objek seperti objek budi dan carli. Cara ini sangat berguna ketika aplikasi kita sudah kompleks dan instansiasi objek dari class tertentu tersebar di banyak file.

Demikian yang dapat saya bagikan, apabila ada yang perlu dikoreksi silahkan share di kolom komentar. 😁

Top comments (0)

typescript

11 Tips That Make You a Better Typescript Programmer

1 Think in {Set}

Type is an everyday concept to programmers, but it’s surprisingly difficult to define it succinctly. I find it helpful to use Set as a conceptual model instead.

#2 Understand declared type and narrowed type

One extremely powerful typescript feature is automatic type narrowing based on control flow. This means a variable has two types associated with it at any specific point of code location: a declaration type and a narrowed type.

#3 Use discriminated union instead of optional fields

...

Read the whole post now!

Instrument, monitor, fix: a hands-on debugging session

Join Lazar for a hands-on session where you’ll build it, break it, debug it, and fix it. You’ll set up Sentry, track errors, use Session Replay and Tracing, and leverage some good ol’ AI to find and fix issues fast.

Tune in to the full event

DEV is partnering to bring live events to the community. Join us or dismiss this billboard if you're not interested. ❤️