Latihan 1: Builder Pattern — Design Patterns

Latihan 1 dari materi Builder Pattern di Design Patterns — praktek dengan editor kode interaktif, test case otomatis, dan hint terpandu. Langsung jalan di browser.

Lengkapi class URLBuilder supaya bisa merakit alamat URL lewat rantai pemanggilan (fluent API).

Di constructor, isi nilai awal: protokol "https", host dan path kosong, dan array kosong untuk query.
protocol(p), host(h), dan path(p) menyimpan nilainya, lalu return this.
query(k, v) boleh dipanggil berkali-kali: tiap panggilan menambah satu pasangan, lalu return this.
build() mengembalikan <protocol>://<host><path>. Kalau ada query, tambahkan ? lalu pasangan k=v yang digabung dengan &. Kalau gak ada query, tanda tanyanya gak ditulis.

Kode di bawah class sudah ada di starter dan tetap. Console harus mencetak tiga baris ini, berurutan:

https://api.example.com/users
https://example.com/search?q=laravel&page=2
http://localhost/

Yang juga dinilai: new URLBuilder().host("toko.id").path("/cart").query("id", 7).query("v", "x").build() harus menghasilkan https://toko.id/cart?id=7&v=x.

Hint

Builder menyimpan bagian-bagian di dalam object-nya, dan tiap method mengembalikan builder itu sendiri (this), jadi method berikutnya bisa dipanggil di belakangnya. build() yang menyusun semuanya di akhir.
Di constructor: this._protocol = "https"; this._host = ""; this._path = ""; this._query = []. query(k, v) melakukan this._query.push([k, v]). Tiap method selain build diakhiri return this.
build() { let url = this._protocol + "://" + this._host + this._path; if (this._query.length > 0) { url += "?" + this._query.map(([k, v]) => k + "=" + v).join("&"); } return url; }

</> { } .css => #id fn()

Versi baru

HyperSheets

bagian dari BelajarWeb.dev

Membuka gerbang…

Latihan 1: Builder Pattern — Design Patterns

Hint

Memperbarui Aplikasi