Skip to content

Commit e72c90c

Browse files
authored
Merge pull request #59 from dummyeuy/master
Constructor, operator "new"
2 parents 0595120 + a661615 commit e72c90c

File tree

1 file changed

+70
-70
lines changed
  • 1-js/04-object-basics/06-constructor-new

1 file changed

+70
-70
lines changed
Lines changed: 70 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
1-
# Constructor, operator "new"
1+
# Konstruktor, operator "new"
22

3-
The regular `{...}` syntax allows to create one object. But often we need to create many similar objects, like multiple users or menu items and so on.
3+
Sintaks reguler `{...}` memungkinkan kita untuk membuat satu objek. Tapi seringkali kita perlu untuk membuat banyak objek-objek serupa, seperti pengguna atau *item* menu berganda dan sebagainya.
44

5-
That can be done using constructor functions and the `"new"` operator.
5+
Hal tersebut dapat diselesaikan dengan menggunakan fungsi konstruktor dan operator `"new"`.
66

7-
## Constructor function
7+
## Fungsi konstruktor
88

9-
Constructor functions technically are regular functions. There are two conventions though:
9+
Fungsi konstruktor secara teknis adalah fungsi biasa. Terdapat dua persetujuan sebelumnya, yakni:
1010

11-
1. They are named with capital letter first.
12-
2. They should be executed only with `"new"` operator.
11+
1. Fungsi tersebut diberi nama dengan huruf kapital terlebih dulu.
12+
2. Fungsi tersebut harus dieksekusi dengan hanya menggunakan operator `"new"`.
1313

14-
For instance:
14+
Sebagai contoh:
1515

1616
```js run
1717
function User(name) {
@@ -27,31 +27,31 @@ alert(user.name); // Jack
2727
alert(user.isAdmin); // false
2828
```
2929

30-
When a function is executed with `new`, it does the following steps:
30+
Ketika sebuah fungsi dieksekusi dengan menggunakan `new`, fungsi tersebut melakukan tahapan-tahapan berikut ini:
3131

32-
1. A new empty object is created and assigned to `this`.
33-
2. The function body executes. Usually it modifies `this`, adds new properties to it.
34-
3. The value of `this` is returned.
32+
1. Sebuah objek kosong yang dibuat dan diserahkan ke `this`.
33+
2. Bagian utama fungsi tersebut bereksekusi. Biasanya memodifikasi `this`, menambahkan properti baru ke `this`.
34+
3. Nilai dari `this` dikembalikan.
3535

36-
In other words, `new User(...)` does something like:
36+
Dengan kata lain, `new User(...)` berjalan seperti ini:
3737

3838
```js
3939
function User(name) {
4040
*!*
41-
// this = {}; (implicitly)
41+
// this = {}; (secara implisit)
4242
*/!*
4343

44-
// add properties to this
44+
// menambahkan properti ke this
4545
this.name = name;
4646
this.isAdmin = false;
4747

4848
*!*
49-
// return this; (implicitly)
49+
// mengembalikan this; (secara implisit)
5050
*/!*
5151
}
5252
```
5353

54-
So `let user = new User("Jack")` gives the same result as:
54+
Jadi `let user = new User("Jack")` memberikan hasil yang sama seperti halnya:
5555

5656
```js
5757
let user = {
@@ -60,134 +60,134 @@ let user = {
6060
};
6161
```
6262

63-
Now if we want to create other users, we can call `new User("Ann")`, `new User("Alice")` and so on. Much shorter than using literals every time, and also easy to read.
63+
Sekarang jika kita ingin membuat *user* lain, kita bisa memanggil `new User("Ann")`, `new User("Alice")` dan seterusnya. Lebih pendek penulisannya daripada menulis langsung sintaks baru setiap ingin membuat *user* baru, serta lebih mudah dibaca.
6464

65-
That's the main purpose of constructors -- to implement reusable object creation code.
65+
Itulah tujuan utama dari konstruktor -- untuk mengimplementasikan kode pembuatan objek yang dapat dipakai ulang (*reusable*).
6666

67-
Let's note once again -- technically, any function can be used as a constructor. That is: any function can be run with `new`, and it will execute the algorithm above. The "capital letter first" is a common agreement, to make it clear that a function is to be run with `new`.
67+
Mari ingat sekali lagi -- secara teknis, fungsi apapun dapat digunakan sebagai sebuah konstruktor. Hal tersebut berarti: fungsi apapun dapat dijalankan dengan `new`, dan bisa mengeksekusi algoritma di atas. "Huruf kapital dulu" adalah kesepakatan umum, untuk membuatnya lebih jelas bahwa sebuah fungsi untuk dijalankan dengan `new`.
6868

69-
````smart header="new function() { ... }"
70-
If we have many lines of code all about creation of a single complex object, we can wrap them in constructor function, like this:
69+
````smart header="function() { ... } baru"
70+
Jika kita memiliki banyak baris kode tentang pembuatan sebuah objek tunggal yang kompleks, kita dapat membungkus kode tersebut dalam fungsi konstruktor, seperti ini:
7171
7272
```js
7373
let user = new function() {
7474
this.name = "John";
7575
this.isAdmin = false;
7676
77-
// ...other code for user creation
78-
// maybe complex logic and statements
79-
// local variables etc
77+
// ...kode lain untuk pembuatan user
78+
// bisa jadi lebih rumit logika dan pernyataannya
79+
// variabel lokal dan lain-lain.
8080
};
8181
```
8282
83-
The constructor can't be called again, because it is not saved anywhere, just created and called. So this trick aims to encapsulate the code that constructs the single object, without future reuse.
83+
Konstruktor tersebut tidak dapat dipanggil lagi, karena tidak disimpan dimanapun, hanya dibuat dan dipanggil. Jadi trik ini ditujukan untuk mengenkapsulasi kode yang mengonstruksi objek tunggal, tanpa penggunaan di masa yang akan datang.
8484
````
8585

8686
## Constructor mode test: new.target
8787

88-
```smart header="Advanced stuff"
89-
The syntax from this section is rarely used, skip it unless you want to know everything.
88+
```smart header="Pembahasan tingkat lanjut"
89+
Sintaks dari bagian ini jarang digunakan, lewati saja kecuali kamu ingin mengetahui semuanya.
9090
```
9191

92-
Inside a function, we can check whether it was called with `new` or without it, using a special `new.target` property.
92+
Di dalam sebuah fungsi, kita dapat memeriksa apakah fungsi tersebut dipanggil dengan atau tanpa `new`, dengan cara menggunakan sebuah properti khusus `new.target`.
9393

94-
It is empty for regular calls and equals the function if called with `new`:
94+
Fungsi tersebut kosong untuk panggilan-panggilan reguler dan menyamai fungsi jika dipanggil dengan `new`:
9595

9696
```js run
9797
function User() {
9898
alert(new.target);
9999
}
100100

101-
// without "new":
101+
// tanpa "new":
102102
*!*
103103
User(); // undefined
104104
*/!*
105105

106-
// with "new":
106+
// dengan "new":
107107
*!*
108-
new User(); // function User { ... }
108+
new User(); // fungsi User { ... }
109109
*/!*
110110
```
111111

112-
That can be used inside the function to know whether it was called with `new`, "in constructor mode", or without it, "in regular mode".
112+
Sintaks itu dapat digunakan di dalam fungsi tersebut untuk mengetahui apakah fungsi dipanggil dengan `new`, "dalam mode konstruktor", atau tanpa `new`, "dalam mode reguler".
113113

114-
We can also make both `new` and regular calls to do the same, like this:
114+
Kita juga bisa membuat baik panggilan dengan `new` serta panggilan reguler untuk melakukan hal yang sama, seperti ini:
115115

116116
```js run
117117
function User(name) {
118-
if (!new.target) { // if you run me without new
119-
return new User(name); // ...I will add new for you
118+
if (!new.target) { // jika kamu menjalankanku tanpa new
119+
return new User(name); // ...aku akan menambahkan new untukmu
120120
}
121121

122122
this.name = name;
123123
}
124124

125-
let john = User("John"); // redirects call to new User
125+
let john = User("John"); // mengarahkan ulang panggilan ke User baru
126126
alert(john.name); // John
127127
```
128128

129-
This approach is sometimes used in libraries to make the syntax more flexible. So that people may call the function with or without `new`, and it still works.
129+
Pendekatan ini terkadang digunakan dalam *library* untuk membuat sintaks lebih fleksibel. Jadi orang-orang bisa memanggil fungsi dengan atau tanap `new`, dan masih bisa berfungsi.
130130

131-
Probably not a good thing to use everywhere though, because omitting `new` makes it a bit less obvious what's going on. With `new` we all know that the new object is being created.
131+
Mungkin saja bukanlah hal baik untuk menggunakan pendekatan tersebut dimana saja, karena melewatkan `new` membuat kurang jelas sintaks atau kode yang sedang berjalan. Dengan `new` kita semua tahu bahwa objek baru sedang dibuat.
132132

133-
## Return from constructors
133+
## Hasil *return* dari konstruktor
134134

135-
Usually, constructors do not have a `return` statement. Their task is to write all necessary stuff into `this`, and it automatically becomes the result.
135+
Biasanya, konstruktor tidak memiliki sebuah pernyataan `return`. Tugas konstruktor adalah untuk menulis semua hal-hal yang dibutuhkan ke dalam `this`, dan hal tersebut secara otomatis menjadi hasil.
136136

137-
But if there is a `return` statement, then the rule is simple:
137+
Tetapi jika ada sebuah pernyataan `return`, maka aturannya sederhana:
138138

139-
- If `return` is called with an object, then the object is returned instead of `this`.
140-
- If `return` is called with a primitive, it's ignored.
139+
- Jika `return` dipanggil dengan sebuah objek, maka objek tersebut dikembalikan sebagai ganti `this`.
140+
- Jika `return` dipanggil dengan sebuah *primitive*, panggilan tersebut diabaikan.
141141

142-
In other words, `return` with an object returns that object, in all other cases `this` is returned.
142+
Dalam kata lain, `return` dengan sebuah objek mengembalikan objek itu, dalam semua kasus lainnya `this` dikembalikan.
143143

144-
For instance, here `return` overrides `this` by returning an object:
144+
Sebagai contoh, di sini `return` mengambil alih `this` dengan cara mengembalikan sebuah objek:
145145

146146
```js run
147147
function BigUser() {
148148

149149
this.name = "John";
150150

151-
return { name: "Godzilla" }; // <-- returns this object
151+
return { name: "Godzilla" }; // <-- mengembalikan objek this
152152
}
153153

154-
alert( new BigUser().name ); // Godzilla, got that object
154+
alert( new BigUser().name ); // Godzilla, dapat objeknya
155155
```
156156

157-
And here's an example with an empty `return` (or we could place a primitive after it, doesn't matter):
157+
Dan berikut ini adalah sebuah contoh dengan sebuah `return` kosong (atau bisa kita tempatkan dengan sebuah *primitive* setelahnya, tidak dipermasalahkan):
158158

159159
```js run
160160
function SmallUser() {
161161

162162
this.name = "John";
163163

164-
return; // <-- returns this
164+
return; // <-- mengembalikan this
165165
}
166166

167167
alert( new SmallUser().name ); // John
168168
```
169169

170-
Usually constructors don't have a `return` statement. Here we mention the special behavior with returning objects mainly for the sake of completeness.
170+
Biasanya konstruktor tidak memiliki sebuah pernyataan `return`. Di sini kita menyebutkan perilaku khusus dengan cara mengembalikan objek dengan tujuan utamanya yakni hanya untuk melengkapi saja.
171171

172-
````smart header="Omitting parentheses"
173-
By the way, we can omit parentheses after `new`, if it has no arguments:
172+
````smart header="Mengabaikan parentheses"
173+
Omong-omong, kita bisa mengabaikan parentheses setelah `new`, jika tidak memiliki argumen:
174174
175175
```js
176-
let user = new User; // <-- no parentheses
177-
// same as
176+
let user = new User; // <-- tanpa parentheses
177+
// sama seperti
178178
let user = new User();
179179
```
180180
181-
Omitting parentheses here is not considered a "good style", but the syntax is permitted by specification.
181+
Mengabaikan parentheses di sini tidak dipandang sebagai sebuah "gaya yang baik", tetapi sintaks tersebut diperbolehkan oleh spesifikasi.
182182
````
183183

184-
## Methods in constructor
184+
## Metode dalam konstruktor
185185

186-
Using constructor functions to create objects gives a great deal of flexibility. The constructor function may have parameters that define how to construct the object, and what to put in it.
186+
Menggunakan fungsi-fungsi konstruktor untuk membuat objek memberikan sebuah fleksibilitas yang amat baik. Fungsi konstruktor bisa jadi memiliki parameter yang mendefinisikan bagaimana cara untuk mengonstruksi objek tersebut, serta hal apa yang dimasukkan ke objek tersebut.
187187

188-
Of course, we can add to `this` not only properties, but methods as well.
188+
Tentu saja, kita bisa menambahkan ke `this` tidak hanya properti, tapi metode juga.
189189

190-
For instance, `new User(name)` below creates an object with the given `name` and the method `sayHi`:
190+
Sebagai contoh, `new User(name)` di bawah membuat sebuah objek dengan `name` yang diberikan dan metode `sayHi`:
191191

192192
```js run
193193
function User(name) {
@@ -212,19 +212,19 @@ john = {
212212
*/
213213
```
214214

215-
To create complex objects, there's a more advanced syntax, [classes](info:classes), that we'll cover later.
215+
Untuk membuat objek yang kompleks, ada sintaks tingkat lanjut, yaitu [classes](info:classes), yang akan kita bahas nanti.
216216

217-
## Summary
217+
## Ringkasan
218218

219-
- Constructor functions or, briefly, constructors, are regular functions, but there's a common agreement to name them with capital letter first.
220-
- Constructor functions should only be called using `new`. Such a call implies a creation of empty `this` at the start and returning the populated one at the end.
219+
- Fungsi konstruktor, atau secara singkat, konstruktor, adalah fungsi reguler, tetapi ada sebuah kesepakatan umum untuk memberi nama konstruktor dengan huruf kapital terlebih dahulu.
220+
- Fungsi konstruktor seharusnya hanya bisa dipanggil menggunakan `new`. Panggilan yang demkian berarti sebuah pembuatan `this` kosong pada awalnya dan mengembalikan `this` yang sudah berisi di akhir.
221221

222-
We can use constructor functions to make multiple similar objects.
222+
Kita bisa menggunakan fungsi konstruktor untuk membuat objek-objek serupa sekaligus.
223223

224-
JavaScript provides constructor functions for many built-in language objects: like `Date` for dates, `Set` for sets and others that we plan to study.
224+
JavaScript menyediakan fungsi konstruktor untuk banyak objek bawaan di bahasa pemrograman: seperti `Date` untuk penanggalan, `Set` untuk kumpulan/rangkaian dan banyak lainnya yang akan kita pelajari.
225225

226-
```smart header="Objects, we'll be back!"
227-
In this chapter we only cover the basics about objects and constructors. They are essential for learning more about data types and functions in the next chapters.
226+
```smart header="Objek, kita akan kembali!"
227+
Dalam bab ini kita hanya membahas dasar-dasar tentang objek dan konstruktor. Objek dan konstruktor adalah dasar penting untuk mempelajari lebih banyak tentang tipe data dan fungsi dalam bab-bab selanjutnya.
228228
229-
After we learn that, we return to objects and cover them in-depth in the chapters <info:prototypes> and <info:classes>.
229+
Setelah kita mempelajari itu, kita kembali ke objek dan membahas objek lebih mendalam lagi di bab <info:prototypes> dan <info:classes>.
230230
```

0 commit comments

Comments
 (0)