Web-Projects/blog-static
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Fix typos in TypeScript article

Browse Source
This commit is contained in:
Danila Fedorin 2021-09-19 12:30:44 -07:00
parent f2bf2fb025
commit 46e4ca3948
1 changed files with 6 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
content/blog/typescript_typesafe_events.md
View File

@ -25,8 +25,8 @@ We can even write some code to test that this works (just to ease my nerves):
As expected, we get:
```
Started!
Ended!
Started!
```
As you probably guessed, we're going to build on this problem a little bit.
@ -37,7 +37,7 @@ may want to know the number's new value. In JavaScript, this is a trivial change
{{< codelines "JavaScript" "typescript-emitter/js2.js" 1 17 "hl_lines = 6-8" >}}
That's literally it. Once again, let's ensure that this works by sending two new events:
`stringChanged` and `numberChanged`.
`stringChange` and `numberChange`.
{{< codelines "JavaScript" "typescript-emitter/js2.js" 19 23 >}}
@ -87,7 +87,7 @@ Let's go through each one of them step-by-step.
to limit the possible names to which handlers can be assigned. We limit these names
to the keys of our type `T`; in the preceding example, `keyof T` would be `"mouseClick"`.
* We also limit the values: `T[eventName]` retrieves the type of the value associated with
key `eventName`. In mouse example, this type would be `{ x: number, y: number }`. We require
key `eventName`. In the mouse example, this type would be `{ x: number, y: number }`. We require
that a key can only be associated with an array of functions to void, each of which accepts
`T[K]` as first argument. This is precisely what we want; for example, `mouseClick` would map to
an array of functions that accept the mouse click location.
@ -99,7 +99,7 @@ Let's go through each one of them step-by-step.
gives TypeScript enough information to narrow the type of `value`.
* __Line 12__: We use the exact same trick here as we did on line 8.
Let's give this a spin with our `numberChanged`/`stringChanged` example from earlier:
Let's give this a spin with our `numberChange`/`stringChange` example from earlier:
{{< codelines "TypeScript" "typescript-emitter/ts.ts" 21 27 >}}
@ -117,4 +117,5 @@ code/typescript-emitter/ts.ts:27:30 - error TS2345: Argument of type 'number' is
Found 2 errors.
```
And there you have it!
And there you have it! This approach is now also in use in [Hydrogen](https://github.com/vector-im/hydrogen-web),
a lightweight chat client for the [Matrix](https://matrix.org/) protocol. In particular, check out [`EventEmitter.ts`](https://github.com/vector-im/hydrogen-web/blob/master/src/utils/EventEmitter.ts).