Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

TypeScript Presentation

2,240 views

Published on

Slide 1
TypeScript
* This presentation is to show TypeScript's major feature and the benefit that it brings to your JavaScript projects.
* Our main objective is just to spark interest especially to those not familiar with the tool.

Slide 2
- What is TypeScript
* go to next slide

Slide 3
- Is a superset of JavaScript
* it simply means an extension to JavaScript

- Use JavaScript code on TypeScript
* JS code naturally works on TypeScript
* Which also means your beloved JavaScript libraries such as JQuery, or your fancy interacive plugins would work as well.

- TypeScript compiles to plain old JavaScript
* TS code compiles to simple and clean JS.

Slide 4
- Screenshot of TS compiled to JS
* In this example, compiling a TS class code would result to a JS version, and a regular JavaScript function when compiled is basically untouched.


Slide 5
- TypeScript's Main Feature
* So what does TS provide us with? What does it actually do?

Slide 6
- Static Type Checking
* TypeScript allows us to enable type checking by defining data types to your for ex. variables, function parameters and return types.

Slide 7
- Screenshot of basic Static Type Checking
* In this example…
* What I've done here was to assign supposedly wrong values for what the variables or parameters were meant to hold

* As JavaScript is a dynamic and untyped language these expressions would either fail or be okay when you run it on your browser.
* In TypeScript by enabling static type checking these potential errors are caught earlier (see the red marks on the expressions) and wouldn't even allow you to compile unless these are resolved.

* In addition you can also type arrays and object literals

Slide 8
- Effects of Static Type Checking
* As TS code is statically type-checked a side effect of such...

- Allows IDEs to perform live error checks
- Exposes auto-completion and code hinting

Slide 9
- Screenshot of code hinting
* Say I was coding JQuery on regular JavaScript code there would be no natural way to help me identify its class properties, methods and parameters... except through reading the API documentation or a separate plugin.
* As a result of static type checking this allows IDE's to access these class members as code hints

* So if this was a 3rd party library how much more if you are just referencing your own JavaScript/TypeScript files within your project.

Slide 10
- A few of the other cool features
* That was only the basic feature of TypeScript
* A few of the other cool features are...


Slide 11
- End

Published in: Software
  • Hello! Who wants to chat with me? Nu photos with me here http://bit.ly/helenswee
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

TypeScript Presentation

  1. 1. TypeScript
  2. 2. What is TypeScript?
  3. 3. What is TypeScript?  Is a superset of JavaScript  JavaScript code runs on TypeScript  TypeScript compiles to plain old JS
  4. 4. TypeScript’s Main Feature
  5. 5. TypeScript’s Main Feature  Static Type Checking
  6. 6. Effects of Static Type Checking  Allows IDEs to perform live error checks  Exposes auto-completion and code hinting
  7. 7. A few of the other cool features  Support for Object Oriented Programming  Compile to a specific ECMAScript version  Integration with Gulp/Grunt  and much more: http://www.typescriptlang.org/docs/index.html
  8. 8. End

×