Skip to content

Commit 7899679

Browse files
committed
2 parents bf3b89d + 2951f6a commit 7899679

File tree

18 files changed

+88
-41
lines changed

18 files changed

+88
-41
lines changed

1-js/01-getting-started/1-intro/article.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -106,10 +106,18 @@ Tools modern membuat transpilasi sangat cepat dan transparan, yang memungkinkan
106106

107107
Contoh bahasa yang dimaksud:
108108

109+
<<<<<<< HEAD
109110
- [CoffeeScript](http://coffeescript.org/) merupakan "syntactic sugar" dari JavaScript. Dia memperkenalkan syntax yang lebih pendek, memungkingkan kita menulis kode lebih bersih dan lebih presisi. Biasanya, Ruby devs menyukainya.
110111
- [TypeScript](http://www.typescriptlang.org/) berfokus pada penambahan "strict data typing" yang menyederhanakan pengembangan dan dukungan sistem yang komplex. Ia dikembangkan oleh Microsoft.
111112
- [Flow](http://flow.org/) juga menambahkan data typing, tapi dalam cara berbeda. Dikembangkan oleh Facebook.
112113
- [Dart](https://www.dartlang.org/) ialah bahasa mandiri yang punya engine sendiri yang berjalan di lingkungan non-peramban (seperti mobile apps), tapi bisa juga ditranspile ke JavaScript. Dikembangkan oleh Google.
114+
=======
115+
- [CoffeeScript](http://coffeescript.org/) is a "syntactic sugar" for JavaScript. It introduces shorter syntax, allowing us to write clearer and more precise code. Usually, Ruby devs like it.
116+
- [TypeScript](http://www.typescriptlang.org/) is concentrated on adding "strict data typing" to simplify the development and support of complex systems. It is developed by Microsoft.
117+
- [Flow](http://flow.org/) also adds data typing, but in a different way. Developed by Facebook.
118+
- [Dart](https://www.dartlang.org/) is a standalone language that has its own engine that runs in non-browser environments (like mobile apps), but also can be transpiled to JavaScript. Developed by Google.
119+
- [Brython](https://brython.info/) is a Python transpiler to JavaScript that allow to write application in pure Python without JavaScript.
120+
>>>>>>> f830bc5d9454d85829e011d914f215eb5896579a
113121
114122
Masih banyak lagi. Tentunya, jika kita menggunakan salah satu bahasa yang ditranspile tersebut, kita sebaiknya juga paham JavaScript untuk mengerti apa yang mereka lakukan.
115123

1-js/02-first-steps/05-types/article.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,8 +81,13 @@ const bigInt = 1234567890123456789012345678901234567890n;
8181

8282
Sebenarnya `BigInt` jarang dibutuhkan, kita tidak akan mempelajarinya disini, tetapi akan dipisahkan didalam bagian <info:bigint>. Baca saja saat kamu membutuhkan nilai *integer* yang sangat panjang.
8383

84+
<<<<<<< HEAD
8485
```smart header="Masalah Kompabilitas"
8586
Sekarang `BigInt` sudah didukung oleh Firefox/Chrome/Edge, tapi tidak didalam Safari/Internet Explorer.
87+
=======
88+
```smart header="Compatibility issues"
89+
Right now `BigInt` is supported in Firefox/Chrome/Edge, but not in Safari/IE.
90+
>>>>>>> f830bc5d9454d85829e011d914f215eb5896579a
8691
```
8792

8893
## String

1-js/02-first-steps/11-logical-operators/article.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -223,8 +223,13 @@ Presedensi operator AND `&&` lebih tinggi dari OR `||`.
223223
Jadi kode `a && b || c && d` esensinya sama dengan jika expresi `&&` dibungkus tanda kurung: `(a && b) || (c && d)`.
224224
````
225225

226+
<<<<<<< HEAD
226227
````warn header="Jangan ganti `if` dengan || atau &&"
227228
Terkadang, orang-orang menggunakan operator AND `&&` untuk "memperpendek instruksi `if`".
229+
=======
230+
````warn header="Don't replace `if` with || or &&"
231+
Sometimes, people use the AND `&&` operator as a "shorter way to write `if`".
232+
>>>>>>> f830bc5d9454d85829e011d914f215eb5896579a
228233

229234
Misalnya:
230235

1-js/05-data-types/04-array/article.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -193,7 +193,11 @@ Sebuah *array* adalah objek yang spesial. Tanda kurung siku digunakan untuk meng
193193

194194
Sintaks tersebut memperpanjang objek yang menyediakan metode khusus untuk berfungsi dengan koleksi-koleksi data yang tertata serta properti `length`. Tetapi pada intinya, *array* tetaplah sebuah objek.
195195

196+
<<<<<<< HEAD
196197
Ingat, ada 7 tipe (data) dasar dalamJavaScript. *Array* adalah sebuah objek dan oleh karena itu berperilaku selayaknya sebuah objek.
198+
=======
199+
Remember, there are only eight basic data types in JavaScript (see the [Data types](https://javascript.info/types) chapter for more info). Array is an object and thus behaves like an object.
200+
>>>>>>> f830bc5d9454d85829e011d914f215eb5896579a
197201
198202
Sebagai contoh, *array* disalin oleh referensi:
199203

1-js/05-data-types/05-array-methods/6-calculator-extendable/_js.view/solution.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,14 +10,14 @@ function Calculator() {
1010
let split = str.split(' '),
1111
a = +split[0],
1212
op = split[1],
13-
b = +split[2]
13+
b = +split[2];
1414

1515
if (!this.methods[op] || isNaN(a) || isNaN(b)) {
1616
return NaN;
1717
}
1818

1919
return this.methods[op](a, b);
20-
}
20+
};
2121

2222
this.addMethod = function(name, func) {
2323
this.methods[name] = func;

1-js/05-data-types/11-date/1-new-date/solution.md

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,17 @@ Konstruktor `new Date` menggunakan zona waktu lokal. Sehingga hal penting yang h
22

33
Jadi Februari mempunyai angka 1.
44

5+
Here's an example with numbers as date components:
6+
7+
```js run
8+
//new Date(year, month, date, hour, minute, second, millisecond)
9+
let d1 = new Date(2012, 1, 20, 3, 12);
10+
alert( d1 );
11+
```
12+
We could also create a date from a string, like this:
13+
514
```js run
6-
let d = new Date(2012, 1, 20, 3, 12);
7-
alert( d );
15+
//new Date(datastring)
16+
let d2 = new Date("February 20, 2012 03:12:00");
17+
alert( d2 );
818
```

1-js/06-advanced-functions/05-global-object/article.md

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,11 @@ Objek global menyediakan variabel dan fungsi yang bisa didapatkan dimana saja. S
55

66
Di dalam browser ia dinamakan `window`, untuk Node.js `global`, untuk lingkungan lainnya ia mungkin mempunyai nama lain.
77

8+
<<<<<<< HEAD
89
Akhir-akhir ini, `globalThis` ditambahkan ke bahasanya, sebagai nama standar untuk objek global, yang harus di dukung di semua lingkungan. Di browser tertentu, ya itu non-Chromium Edge, `globalThis` belum didukung, tapi bisa dengan mudah dipolyfill.
10+
=======
11+
Recently, `globalThis` was added to the language, as a standardized name for a global object, that should be supported across all environments. It's supported in all major browsers.
12+
>>>>>>> f830bc5d9454d85829e011d914f215eb5896579a
913
1014
Kita akan memakai `window` disini, dengan anggapan bahwa lingkungan kita adalah browser. Jika script kamu mungkin digunakan di lingkungan lain, lebih baik menggunakan `globalThis`.
1115

@@ -79,9 +83,16 @@ if (!window.Promise) {
7983

8084
- Objek global menyimpan variabel yang harus tersedia dimana saja.
8185

86+
<<<<<<< HEAD
8287
Itu termasuk built-in Javascript, seperti `Array` dan nilai-nilai lingkungan-spesifik, seperti `window.innerHeight` -- tinggi window di dalam browser.
8388
- Objek global mempunyai nama universal `globalThis`.
8489
...Tapi lebih sering disebut nama lingkungan-spesifik "old-school", seperti `window` (browser) dan `global` (Node.js). Karena `globalThis` adalah usulan baru, ia belum didukung di dalam non-Chromium Edge (tapi bisa dipolyfill).
8590
- Kita harus menyimpan nilai di objek global jika kalau ia benar-benar global untuk projek kita. Dan pertahankan jumlah minimum.
8691
- Dalam browser, jika kita tidak menggunakan [modules](info:modules), fungsi global dan variabel ternyatakan `var` menjadi properti objek global.
8792
- Untuk membuat kode kami future-proof dan lebih mudah dimengerti, kita harus mengakses properti dari global objek secara langsung, sebagain `window.x`.
93+
=======
94+
...But more often is referred by "old-school" environment-specific names, such as `window` (browser) and `global` (Node.js).
95+
- We should store values in the global object only if they're truly global for our project. And keep their number at minimum.
96+
- In-browser, unless we're using [modules](info:modules), global functions and variables declared with `var` become a property of the global object.
97+
- To make our code future-proof and easier to understand, we should access properties of the global object directly, as `window.x`.
98+
>>>>>>> f830bc5d9454d85829e011d914f215eb5896579a

1-js/08-prototypes/01-prototype-inheritance/article.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -197,6 +197,9 @@ alert(admin.fullName); // John Smith (*)
197197

198198
// setter triggers!
199199
admin.fullName = "Alice Cooper"; // (**)
200+
201+
alert(admin.fullName); // Alice Cooper , state of admin modified
202+
alert(user.fullName); // John Smith , state of user protected
200203
```
201204

202205
Here in the line `(*)` the property `admin.fullName` has a getter in the prototype `user`, so it is called. And in the line `(**)` the property has a setter in the prototype, so it is called.

2-ui/2-events/02-bubbling-and-capturing/article.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -206,7 +206,7 @@ When an event happens -- the most nested element where it happens gets labeled a
206206
207207
- Then the event moves down from the document root to `event.target`, calling handlers assigned with `addEventListener(..., true)` on the way (`true` is a shorthand for `{capture: true}`).
208208
- Then handlers are called on the target element itself.
209-
- Then the event bubbles up from `event.target` up to the root, calling handlers assigned using `on<event>` and `addEventListener` without the 3rd argument or with the 3rd argument `false/{capture:false}`.
209+
- Then the event bubbles up from `event.target` to the root, calling handlers assigned using `on<event>` and `addEventListener` without the 3rd argument or with the 3rd argument `false/{capture:false}`.
210210
211211
Each handler can access `event` object properties:
212212
@@ -220,6 +220,6 @@ The capturing phase is used very rarely, usually we handle events on bubbling. A
220220
221221
In real world, when an accident happens, local authorities react first. They know best the area where it happened. Then higher-level authorities if needed.
222222
223-
The same for event handlers. The code that set the handler on a particular element knows maximum details about the element and what it does. A handler on a particular `<td>` may be suited for that exactly `<td>`, it knows everything about it, so it should get the chance first. Then its immediate parent also knows about the context, but a little bit less, and so on till the very top element that handles general concepts and runs the last.
223+
The same for event handlers. The code that set the handler on a particular element knows maximum details about the element and what it does. A handler on a particular `<td>` may be suited for that exactly `<td>`, it knows everything about it, so it should get the chance first. Then its immediate parent also knows about the context, but a little bit less, and so on till the very top element that handles general concepts and runs the last one.
224224
225225
Bubbling and capturing lay the foundation for "event delegation" -- an extremely powerful event handling pattern that we study in the next chapter.

2-ui/2-events/05-dispatch-events/article.md

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -187,7 +187,6 @@ Any handler can listen for that event with `rabbit.addEventListener('hide',...)`
187187
<button onclick="hide()">Hide()</button>
188188

189189
<script>
190-
// hide() will be called automatically in 2 seconds
191190
function hide() {
192191
let event = new CustomEvent("hide", {
193192
cancelable: true // without that flag preventDefault doesn't work
@@ -211,13 +210,13 @@ Please note: the event must have the flag `cancelable: true`, otherwise the call
211210

212211
## Events-in-events are synchronous
213212

214-
Usually events are processed in a queue. That is: if the browser is processing `onclick` and a new event occurs, e.g. mouse moved, then it's handing is queued up, corresponding `mousemove` handlers will be called after `onclick` processing is finished.
213+
Usually events are processed in a queue. That is: if the browser is processing `onclick` and a new event occurs, e.g. mouse moved, then it's handling is queued up, corresponding `mousemove` handlers will be called after `onclick` processing is finished.
215214

216215
The notable exception is when one event is initiated from within another one, e.g. using `dispatchEvent`. Such events are processed immediately: the new event handlers are called, and then the current event handling is resumed.
217216

218217
For instance, in the code below the `menu-open` event is triggered during the `onclick`.
219218

220-
It's processed immediately, without waiting for `onlick` handler to end:
219+
It's processed immediately, without waiting for `onclick` handler to end:
221220

222221

223222
```html run autorun
@@ -243,7 +242,7 @@ The output order is: 1 -> nested -> 2.
243242

244243
Please note that the nested event `menu-open` is caught on the `document`. The propagation and handling of the nested event is finished before the processing gets back to the outer code (`onclick`).
245244

246-
That's not only about `dispatchEvent`, there are other cases. If an event handler calls methods that trigger to other events -- they are too processed synchronously, in a nested fashion.
245+
That's not only about `dispatchEvent`, there are other cases. If an event handler calls methods that trigger other events -- they too are processed synchronously, in a nested fashion.
247246

248247
Let's say we don't like it. We'd want `onclick` to be fully processed first, independently from `menu-open` or any other nested events.
249248

@@ -283,9 +282,9 @@ Other constructors of native events like `MouseEvent`, `KeyboardEvent` and so on
283282

284283
For custom events we should use `CustomEvent` constructor. It has an additional option named `detail`, we should assign the event-specific data to it. Then all handlers can access it as `event.detail`.
285284

286-
Despite the technical possibility to generate browser events like `click` or `keydown`, we should use with the great care.
285+
Despite the technical possibility of generating browser events like `click` or `keydown`, we should use them with great care.
287286

288-
We shouldn't generate browser events as it's a hacky way to run handlers. That's a bad architecture most of the time.
287+
We shouldn't generate browser events as it's a hacky way to run handlers. That's bad architecture most of the time.
289288

290289
Native events might be generated:
291290

0 commit comments

Comments
 (0)