TypeScript adds types to JavaScript to improve scalability and avoid bugs. It supports features like classes, interfaces, generics and enums. Companies use TypeScript for its type safety and ability to write future JavaScript features now. The presentation introduces TypeScript basics like installation, types, functions and classes, and how it helps scale apps and catch errors earlier.

1. TypeScript: Scaling Up
JavaScript
Saray Chak, Web Developer

2. Agenda
- What is TypeScript?
- Installation
- Hello World
- Why TypeScript?
- Basic Type
- Function & Class
- Interface
- Generic
- Enum
- Who Use TypeScript?
- Conclusion
- Q&A
- References

3. What is TypeScript?
JavaScript Superset
Language building up on
JavaScript
Add new features &
advantages to JavaScript
Browser CAN’T execute it!

4. What is TypeScript?

5. What is TypeScript?
TypeScript (.ts)
TypeScript Compiler
Javascript (.js)

6. Installation
The following tools you need to setup to
start with TypeScript:
- Node js
- TypeScript compiler
- IDE (VsCode)
npm install -g typescript
tsc --v
Version 4.0.2

7. Hello World
compile the app.ts file
You will see the output as
Hello, World!

8. Why TypeScript?
There are three main reasons to use TypeScript:
- TypeScript adds a strongly-type system to help you avoid many
problems with dynamic types in JavaScript.
- TypeScript always point out the compilation errors at the time of
development.
- TypeScript implements the future features of JavaScript ES Next so
that you can use them today.
-
- Write code better with architecture.

9. Why TypeScript?

10. Why TypeScript?

11. Basic Type
TypeScript inherits the built-in types from JavaScript. TypeScript types is categorized into:
- Primitive type
- Objective Type

12. Basic Type
Object types:
- Function
- Arrays
- Classes
- Objects
- Tuples
- Enum

13. Function
TypeScript functions are the building blocks of readable, maintainable, and reusable code.

14. Function

15. Function: overloading

16. Function: overloading

17. Function: overloading
Overloading function

18. Class
ES5

19. Class
ES6

20. Class
TypeScript

21. Class: inheritances

22. Interface

23. Interface

24. Interface: extend one interface

25. Generic

26. Generic
Using the any type

27. Generic
TypeScript Generic comes to rescue

28. Generic: constraints

29. Generic: constraints

30. Generic: constraints

31. Generic: interface

32. Enum
Without enum With enum

33. Enum

34. Who use TypeScript?

35. Conclusion
- TypeScript simplifies JavaScript code making it easier to
read and understand.
- It gives us all the benefits of ES6, plus more productivity.
- Help us avoid painful bugs by type checking.
- Structural, rather than nominal

36. Any Questions?

37. References
- prototype inheritance
- ES6 allowed you to define a class
- https://www.typescripttutorial.net/
- https://www.typescriptlang.org/
- TypeScript type annotations