You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: module8-typescript/r1.1-everyday-types/README.md
+12-12Lines changed: 12 additions & 12 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -60,14 +60,14 @@ We'll go through a few examples.
60
60
61
61
### Inferred array types
62
62
63
-
TypeScript will infer the type of an array if it is declared with some value initially. For example, we have an array of numbers below; TypeScript is smart enough to figure out that `ids` has type `number[]`.
63
+
TypeScript will infer the type of an array if it is declared with some value initially. For example, we have an array of numbers below; TypeScript is smart enough to figure out that `ids` has the type `number[]`.
64
64
65
65
```typescript
66
66
const ids = [1, 2, 3];
67
67
ids.push("somestring");
68
68
```
69
69
70
-
This gives an error, which tells us that we can't push a string to the parameter (of the `push` function) that expects type `number`. TypeScript has inferred that this is an array of numbers.
70
+
This gives an error, which tells us that we can't push a string to the parameter (of the `push` function) that expects the type `number`. TypeScript has inferred that this is an array of numbers.
71
71
72
72
```
73
73
Argument of type 'string' is not assignable to parameter of type 'number'.
@@ -97,18 +97,18 @@ const ids: number[] = [];
97
97
ids.push(5);
98
98
```
99
99
100
-
The `number[]` indicates that this will be an array of numbers. Similarly you could have `string[]` or `boolean[]`.
100
+
The `number[]` indicates that this will be an array of numbers. Similarly, you could have `string[]` or `boolean[]`.
101
101
102
102
## Any
103
103
104
-
TypeScript also has a special type, `any`, that you can use whenever you don't want a particular value to cause typechecking errors. It is useful when you don't want to write out a long type just to convince TypeScript that a particular line of code is okay.
104
+
TypeScript also has a special type, `any`, that you can use whenever you don't want a particular value to cause type-checking errors. It is useful when you don't want to write out a long type just to convince TypeScript that a particular line of code is okay.
105
105
106
106
```typescript
107
107
let x:any="Hello";
108
108
let arr:any[] = [1, true, "Hello"];
109
109
```
110
110
111
-
When a value is of type `any`, you can access any properties of it (which will in turn be of type `any`), call it like a function, assign it to (or from) a value of any type, or pretty much anything else that’s syntactically legal.
111
+
When a value is of type `any`, you can access any properties of it (which will, in turn, be of type `any`), call it like a function, assign it to (or from) a value of any type, or pretty much anything else that’s syntactically legal.
112
112
113
113
```typescript
114
114
let obj:any= { x: 0 };
@@ -122,9 +122,9 @@ obj = "hello";
122
122
const n:number=obj;
123
123
```
124
124
125
-
Beginners of TypeScript are often tempted to use `any` type, but it is highly discouraged. It is possible in almost all cases to write code without `any`. Do not use `any` as a crutch in order to skip past type errors: doing so is often a sign that something else is wrong with the code (and `any` is simply being used to ignore the fundamental issue).
125
+
Beginners of TypeScript are often tempted to use `any` type, but it is highly discouraged. It is possible in almost all cases to write code without `any`. Do not use `any` as a crutch to skip past type errors: doing so is often a sign that something else is wrong with the code (and `any` is simply being used to ignore the fundamental issue).
126
126
127
-
When the keyword `any` is used, TypeScript no longer performs typechecking, since it has no information about the type. This means that we no longer have the benefits of the type-checker.
127
+
When the keyword `any` is used, TypeScript no longer performs type checking, since it has no information about the type. This means that we no longer have the benefits of the type-checker.
128
128
129
129
Here is an example of typing something as `any`, demonstrating how we can start introducing errors in our code that were previously prevented:
130
130
@@ -134,7 +134,7 @@ const invalidAddition = a + 5; // Adding a list to a number?
134
134
const functionDoesntExist =a.someInvalidFunction(); // This also compiles!
135
135
```
136
136
137
-
Some valid usages of `any` might be: facilitating migration of code from JavaScript to TypeScript, leveraging third-party code without types, working with input of completely unknown structure.
137
+
Some valid usages of `any` might be: facilitating code migration from JavaScript to TypeScript, leveraging third-party code without types, and working with input of completely unknown structure.
Note the addition of three number types: the two parameters `x`, `y`, and the return type `number`. You may omit the return type sometimes if TypeScript is able to infer it, but it's also good practice to keep it in so that readers of your functions, such as your team mates, can immediately know at a glance what type should be returned from the function.
185
+
Note the addition of three number types: the two parameters `x`, `y`, and the return type `number`. You may omit the return type sometimes if TypeScript can infer it, but it's also good practice to keep it in so that readers of your functions, such as your teammates, can immediately know at a glance what type should be returned from the function.
186
186
187
187
It should be noted that in TypeScript every parameter is required unless specified by adding a `?` after the parameter. In JavaScript, if a function has three declared parameters, you can choose not to provide them, and they will take the value of `undefined`. This is not the case in TypeScript.
JavaScript has two primitive values used to signal absent or uninitialized value: `null` and `undefined`. TypeScript has two corresponding types by the same names. How these types behave depends on whether you have the `strictNullChecks` option on. We'll learn more about how to configure this setting in a later section of this module.
338
+
JavaScript has two primitive values used to signal absent or uninitialized values: `null` and `undefined`. TypeScript has two corresponding types by the same names. How these types behave depends on whether you have the `strictNullChecks` option on or off. We'll learn more about how to configure this setting in a later section of this module.
339
339
340
340
With `strictNullChecks` off, values that might be `null` or `undefined` can still be accessed normally, and the values `null` and `undefined` can be assigned to a property of any type. This is similar to how languages without null checks (e.g. C#, Java) behave. The lack of checking for these values tends to be a major source of bugs; it is always recommended to turn `strictNullChecks` on if it's practical to do so in their codebase.
341
341
@@ -362,7 +362,7 @@ function liveDangerously(x?: number | null) {
362
362
363
363
## Enums
364
364
365
-
Enums are a feature added to JavaScript by TypeScript which allows for describing a value which could be one of a set of possible named constants. Unlike most TypeScript features, this is not a type-level addition to JavaScript but something added to the language and runtime. Because of this, it's a feature which you should know exists, but maybe hold off on using unless you are sure.
365
+
Enums are a feature added to JavaScript by TypeScript which allows for describing a value that could be one of a set of possible named constants. Unlike most TypeScript features, this is not a type-level addition to JavaScript but something added to the language and runtime. Because of this, it's a feature that you should know exists, but maybe hold off on using it unless you are sure.
You would mostly find yourself using primitive types, arrays, objects and functions in your everyday code. TypeScript powers all of these elements with static typing and type checking. You have now learned the syntax for type annotations and assertions. You have also learned about how TypeScript infers types and applies contextual typing. You can get creative and use Tuples, Unions, Enums, and Any types but of course these require a lot more thought and consideration put in first. You can also create your own type aliases and reuse them wherever required across the codebase. With that, let's prepare ourselves to look at more complex and advanced types in the next lesson.
401
+
You would mostly find yourself using primitive types, arrays, objects, and functions in your everyday code. TypeScript powers all of these elements with static typing and type checking. You have now learned the syntax for type annotations and assertions. You have also learned about how TypeScript infers types and applies contextual typing. You can get creative and use Tuples, Unions, Enums, and Any types but of course, these require a lot more thought and consideration put in first. You can also create your own type aliases and reuse them wherever required across the codebase. With that, let's prepare ourselves to look at more complex and advanced types in the next lesson.
Copy file name to clipboardExpand all lines: module8-typescript/r1.2-advanced-types/README.md
+10-10Lines changed: 10 additions & 10 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,6 +1,6 @@
1
1
# Advanced Types
2
2
3
-
We have learnt quite a bit about Types so far, but when it comes to largescale projects there are some more advanced types that help us write more robust code which will dive into now. The objectives of this lesson are:
3
+
We have learned quite a bit about Types so far, but when it comes to large-scale projects there are more advanced types that help us write more robust code which will dive into now. The objectives of this lesson are:
4
4
5
5
1. Viewing practical usage examples of advanced Types
6
6
2. Understanding when to use advanced Types
@@ -23,7 +23,7 @@ function printCoord(pt: Point) {
23
23
printCoord({ x: 100, y: 100 });
24
24
```
25
25
26
-
Just like when we used a type alias above, the example works just as if we had used an anonymous object type. TypeScript is only concerned with the structure of the value we passed to `printCoord` - it only cares that it has the expected properties.
26
+
Like when we used a type alias above, the example works just as if we had used an anonymous object type. TypeScript is only concerned with the structure of the value we passed to `printCoord` - it only cares that it has the expected properties.
27
27
28
28
You can also define properties in an interface to be optional using `?` or non-editable by specifying `readonly`.
29
29
@@ -53,7 +53,7 @@ const sub: MathFunc = (x: number, y: number): number => x - y;
53
53
54
54
## Classes
55
55
56
-
TypeScript offers full support for the class keyword introduced in ES2015. As with other JavaScript language features, TypeScript adds type annotations and other syntax to allow you to express relationships between classes and other types. Just like any other OOP language, classes have members or fields and a constructor function used to instantiate the objects of this class with initial field values. Classes can also have member functions.
56
+
TypeScript offers full support for the class keyword introduced in ES2015. As with other JavaScript language features, TypeScript adds type annotations and other syntax features to allow you to express relationships between classes and other types. Just like any other OOP language, classes have members or fields and a constructor function is used to instantiate the objects of this class with initial field values. Classes can also have member functions.
57
57
58
58
```typescript
59
59
// Class with constructor
@@ -105,7 +105,7 @@ alice.register();
105
105
mike.register();
106
106
```
107
107
108
-
Classes may extend from a base class. A derived class has all the properties and methods of its base class, and also define additional members.
108
+
Classes may extend from a base class. A derived class has all the properties and methods of its base class, and also defines additional members.
109
109
110
110
```typescript
111
111
classEmployeeextendsPerson {
@@ -129,15 +129,15 @@ A field of a class can be one of the following: `public`, `private`, `protected`
129
129
-`protected`: Similar to `private`, but subclasses can access the field.
130
130
-`readonly`: This field can only be read, but it can never be assigned or have its value changed (similar to `const`).
131
131
132
-
By default all class members are `public` but you can apply other data modifiers like `private` and `protected` to control member visibility. Protected members are only visible to subclasses of the class they're declared in. Private is like Protected, but doesn't allow access to the member even from subclasses.
132
+
By default, all class members are `public` but you can apply other data modifiers like `private` and `protected` to control member visibility. Protected members are only visible to subclasses of the class they're declared in. Private is like Protected but doesn't allow access to the member even from subclasses.
133
133
134
134
In general, it is considered good practice in coding to use the minimal visibility required. For example, if you never plan to write to the field, you should start with `readonly`. If you find that you need to write to the field, but only in the code in the class, you should use `private`. Usage of `protected` is rare. In most cases, well-structured code will have most instance variables of a class as `private`.
135
135
136
-
We've tried to cover the basics about Classes here. You can read a lot more in detail [on the TypeScript handbook](https://www.typescriptlang.org/docs/handbook/2/classes.html).
136
+
We've tried to cover the basics of Classes here. You can read a lot more in detail [on the TypeScript handbook](https://www.typescriptlang.org/docs/handbook/2/classes.html).
137
137
138
138
## Generics
139
139
140
-
Generics allow us to create reusable and flexible components which can work over a variety of types rather than a single one. This allows users to consume these components and use their own types.
140
+
Generics allow us to create reusable and flexible components which can work over a variety of types rather than a single one. This allows users to consume these components and use their types.
let strArray =getArray<string>(["alice", "dave", "mike"]);
158
158
```
159
159
160
-
The drawback of using `any[]` is that something like `numArray.push('hello')` would not throw an error, but when you use generics it acts like a placeholder with types defined and applied when creating variables from the generic.
160
+
The drawback of using `any[]` is that something like `numArray.push('hello')` would not throw an error, but when you use generics it acts as a placeholder with types defined and applied when creating variables from the generic.
161
161
162
-
You can read more about generics and considerations for using this feature of TypeScript [on the TypeScript handbook](https://www.typescriptlang.org/docs/handbook/2/generics.html).
162
+
You can read more about generics and considerations for using this feature of TypeScript on [The TypeScript handbook](https://www.typescriptlang.org/docs/handbook/2/generics.html).
163
163
164
164
## Decorators
165
165
166
166
With the introduction of Classes in TypeScript and ES6, there now exist certain scenarios that require additional features to support annotating or modifying classes and class members. Decorators provide a way to add both annotations and a meta-programming syntax for class declarations and members. Decorators are a stage 2 proposal for JavaScript and are available as an experimental feature of TypeScript.
167
167
168
-
A Decorator is a special kind of declaration that can be attached to a class declaration, method, accessor, property, or parameter. Decorators use the form `@expression`, where `expression` must evaluate to a function that will be called at runtime with information about the decorated declaration. For example, given the decorator `@sealed` we might write the `sealed` function as follows:
168
+
A Decorator is a special kind of declaration that can be attached to a class declaration, method, accessor, property, or parameter. Decorators use the form `@expression`, where `expression` must be a function that will be called at runtime with information about the decorated declaration. For example, given the decorator `@sealed` we might write the `sealed` function as follows:
0 commit comments