Add Book Chapter: Static Typing with TypeScript #118
Conversation
luyangkenneth
force-pushed
the
static-typing-with-typescript
branch
2 times, most recently
from
2a4222c
to
0767763
Compare
|
@marvinchin Can you help me to review the Intro section? 😄 |
luyangkenneth
force-pushed
the
static-typing-with-typescript
branch
2 times, most recently
from
4dc507b
to
4ce0782
Compare
|
@marvinchin Added some new sections :D |
|
|
||
| If we try to assign it a `number` value later on, the TypeScript compiler will raise an error: | ||
| ```typescript | ||
| myString = 123; // error: 123 is not assignable to type 'string' |
There was a problem hiding this comment.
Do we want to include a screenshot of the compiler/IDE displaying the error, to make it a little more "realistic" to the reader?
There was a problem hiding this comment.
Haha I definitely considered this. There a few reasons why I decided against it eventually.
-
Readers won't be able to copy-paste the code snippets if they wanna play with the examples themselves - I'm going to introduce https://www.typescriptlang.org/play/ in the last section.
-
If I hover over the error, it will block the rest of the code. Of course, I can work around this by adding more line breaks above the errored line, but it'll be uglier. I also want to simplify the error messages, so using comments would be better than letting readers see the actual IDE errors. This is especially true in the case of objects.
- Screenshots are much harder to update later on if someone else wants make any changes / additions to the article. Also, a new screenshot might have different syntax highlighting, different font, etc. which makes the article look less consistent overall.
|
|
||
| Sometimes, we don't know what the type of a variable might be. In those cases, we would use the `any` type to opt out of compile-time type checking. For example, `myList` is an array that contains elements with a mix of different types: | ||
| ```typescript | ||
| function printItemsToConsole(list: any[]): void { |
There was a problem hiding this comment.
would the method name logItems be shorter? 😛
There was a problem hiding this comment.
Because these examples are focusing on the types - but we still need some kind of implementation to help contextualize the example - I wanted to have implementation that was as simple as possible, to not distract the reader from the main focus. So I think I want to stick to a method name that is glaringly explicit (as opposed to abstract, which I might favor in a real-world codebase).
|
|
||
| ## TypeScript Basics | ||
|
|
||
| ### Compilation to JavaScript |
There was a problem hiding this comment.
Just some thoughts - I wonder how important this is for a reader who wants to know what typescript is. while it is important, I feel it may fall outside the "core" functionality of typescript, which is type checking, and hence it may make more sense to place it after the section on type checking.
There was a problem hiding this comment.
I intended this to be a slightly more detailed introduction to what TypeScript's relationship with JavaScript actually is, which I think is important to understand from the beginning - I can imagine lacking clarity about this as a new reader. Putting it here is also to extend on the statically typed superset of JavaScript that compiles to plain JavaScript one-liner in the previous section.
There was a problem hiding this comment.
It's kinda like providing that little bit of theoretical knowledge before diving into "how do we actually use this" for the rest of the article.
|
@marvinchin Just made some updates - if these are ok, I just have my last section remaining! (It's on the way) |
|
Ready for final review! |
|
|
||
| {{ booktitle | safe }} | ||
|
|
||
| # Static Typing with TypeScript |
There was a problem hiding this comment.
ATM it is not clear who the target audience is.
How about we make this Static Typing in JavaScript and add a couple of lines about Flow? That way, the target audience is clearly JS programmers who are looking to add static typing to their code. Also, it will be similar to the article on JavaScript modules.
There was a problem hiding this comment.
I'm not sure about adding more lines about Flow - almost all of the basics in Flow and TypeScript are similar so there's a lot of overlap there, unlike in the JavaScript modules article.
I'm happy to change the title to Static Typing in JavaScript - what do you think?
There was a problem hiding this comment.
If you think the suggested heading fits the current content without adding more on Flow, go ahead.
luyangkenneth
force-pushed
the
static-typing-with-typescript
branch
from
8f1f750
to
6174d25
Compare
|
Merged and deployed. |
Fixes #117
Here's the permalink to the preview page: https://deploy-preview-118--learningresources.netlify.com/contents/javascript/staticTypingInJavascript.html
Structure: