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: src/content/9/en/part9d.md
+6-6Lines changed: 6 additions & 6 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -821,7 +821,7 @@ When we hover over the *response.data* we see that it has the type *any*
821
821
822
822
To set the data to the state with function *setNotes* we must type it properly.
823
823
824
-
With a little [help from internet](https://upmostly.com/typescript/how-to-use-axios-in-your-typescript-apps), we find a clever trick:
824
+
With a little [help from the internet](https://upmostly.com/typescript/how-to-use-axios-in-your-typescript-apps), we find a clever trick:
825
825
826
826
```js
827
827
useEffect(() => {
@@ -845,11 +845,11 @@ We can now set the data in the state *notes* to get the code working:
845
845
}, [])
846
846
```
847
847
848
-
So just like with *useState*, we gave a type parameter to *axios.get* to instruct it on how the typing should be done. Just like *useState* also *axios.get* is a [generic function](https://www.typescriptlang.org/docs/handbook/2/generics.html#working-with-generic-type-variables). Unlike some generic functions, the type parameter of *axios.get* has a default value of *any* so, if the function is used without defining the type parameter, the type of the response data will be any.
848
+
So just like with *useState*, we gave a type parameter to *axios.get* to instruct it on how the typing should be done. Just like *useState*, *axios.get* is also a [generic function](https://www.typescriptlang.org/docs/handbook/2/generics.html#working-with-generic-type-variables). Unlike some generic functions, the type parameter of *axios.get* has a default value of *any* so, if the function is used without defining the type parameter, the type of the response data will be any.
849
849
850
-
The code works, compiler and Eslint are happy and remain quiet. However, giving a type parameter to *axios.get* is a potentially dangerous thing to do. The <i>response body can contain data in an arbitrary form</i>, and when giving a type parameter we are essentially just telling to TypeScript compiler to trust us that the data has type *Note[]*.
850
+
The code works, compiler and Eslint are happy and remain quiet. However, giving a type parameter to *axios.get* is a potentially dangerous thing to do. The <i>response body can contain data in an arbitrary form</i>, and when giving a type parameter we are essentially just telling the TypeScript compiler to trust us that the data has type *Note[]*.
851
851
852
-
So our code is essentially as safe as it would be if a [type assertion](/en/part9/first_steps_with_type_script#type-assertion) would be used:
852
+
So our code is essentially as safe as it would be if a [type assertion](/en/part9/first_steps_with_type_script#type-assertion) would be used (not good):
853
853
854
854
```js
855
855
useEffect(() => {
@@ -862,7 +862,7 @@ So our code is essentially as safe as it would be if a [type assertion](/en/part
862
862
863
863
Since the TypeScript types do not even exist in runtime, our code does not give us any safety against situations where the request body contains data in the wrong form.
864
864
865
-
Giving a type parameter to *axios.get* might be ok if we are <i>absolutely sure</i> that the backend behaves correctly and returns always the data in the correct form. If we want to build a robust system we should prepare for surprises and parse the response data in the frontend, similarly to what we did [in the previous section](/en/part9/typing_an_express_app#proofing-requests) for the requests to the backend.
865
+
Giving a type parameter to *axios.get* might be ok if we are <i>absolutely sure</i> that the backend behaves correctly and always returns the data in the correct form. If we want to build a robust system we should prepare for surprises and parse the response data (similar to what we did [in the previous section](/en/part9/typing_an_express_app#proofing-requests) for the requests to the backend).
866
866
867
867
Let us now wrap up our app by implementing the new note addition:
868
868
@@ -979,7 +979,7 @@ interface CoursePartBase {
979
979
}
980
980
```
981
981
982
-
We actually could have had the same effect by using a [type alias](https://www.typescriptlang.org/docs/handbook/2/everyday-types.html#type-aliases)
982
+
We actually could have achieved the same effect by using a [type alias](https://www.typescriptlang.org/docs/handbook/2/everyday-types.html#type-aliases)
0 commit comments