Getting started with typescript 1

Source: Internet
Author: User

Have you heard of typescript?

Typescript is a javascript superset developed by Microsoft. It is compatible with JavaScript and can load and run JavaScript code. Compared with JavaScript, typescript adds comments so that the compiler can understand the supported objects and functions. The compiler removes comments without increasing the overhead. It also adds a complete class structure, it is a traditional object-oriented language.

Why is there typescript?

Javascript is just a scripting language, not designed for developing large Web applications. JavaScript does not provide classes and modules, and typescript extends JavaScript to implement these features. The main features of typescript include:

  • Typescript is an open-source language released by Microsoft. It uses the Apache authorization protocol.
  • Typescript is a javascript superset.
  • Typescript adds optional types, classes, and modules.
  • Typescript can be translated into readable, standard Javascript
  • Typescript supports the development of large-scale JavaScript applications
  • Typescript is designed to develop large-scale applications and ensure the compatibility of compiled JavaScript code.
  • Typescript extends the Javascript syntax, so the existing JavaScript code can be directly run with typescript without changing
  • The typescript file extension is ts, while the typescript compiler will compile and translate the file into JS files.
  • The typescript syntax is the same as that of JScript. net.
  • Typescript is easy to learn and understand
Syntax features
  • Class classes
  • Interface Interfaces
  • Module modules
  • Type annotation type annotations
  • Compile-time type check compile time type checking
  • Arrow function (similar to the lambda expression of C)
Differences between JavaScript typescript
Typescript is a javascript superset that extends the Javascript syntax. Therefore, the existing JavaScript code can work with typescript without any modification. Typescript provides a static type check during compilation through type annotations. Typescript can process existing JavaScript code and compile only the typescript code. The Editor supports Visual Studio 2012 and supports typescript module/syntax highlighting. You need to install the typescript plug-in. Similar to sublime
The text, Vim, and emacs editor supports syntax highlighting. The vs 2012 editor also provides refactoring and go to definition functions.

 

Note: typescript does not rely on any IDE. You can compile typescript into Javascript in any application.

How to obtain

You can install typescript in the following two ways:

  • Use node. js Package Manager (NPM)
  • MSI. (Click
    Here to download)

Note: You need to close other applications to avoid installation problems.

The following is the interface for installing an MSI file:

If you just want to see typescript first, click
Here.

How to compile typescript

To use typescript in an application, you must compile it first. The compiling result is to generate a JS file. You can use the typescript compiler TSC to complete this process.

If you use typescript in Visual Studio 2012, it automatically compiles ts files into JS files.

The typescript compiler template is installed in the following path:

C:\Program Files (x86)\Microsoft SDKs\TypeScript\0.8.0.0

Or:

C:\Program Files\Microsoft SDKs\TypeScript\0.8.0.0

To compile a typescript file, run the following command:

tsc filename.ts

Once compiled, a JS file with the same name will be generated in the same directory. You can also modify the default output name by using command parameters.

If you want typescript to be automatically compiled, you can understand sholo. Typescript. Build, web
Essentials 2012.

Typescript Project/file template

Once you install the plug-in on Visual Studio 2012, you will obtain the following template:

HTML application with typescript

MVC-Typescript Internet Application

Typescript File

The first HTML application written in typescript

Now I start to use typescript to create a simple HTML application.

First, create a project through file-> New-Project:




Enter necessary information and click OK. After creation, the Project template is as follows:

We will see that app. js depends on App. Ts. The default app. Ts file contains classes and constructor functions, such:

The typescript file will be compiled into JavaScript (App. JS). The following is the compiled JavaScript code:

Then we can reference Javascript in the page

When you build or re-build a project, you will see the message indicating whether to re-compile typescript:

If .?? The following content in the proj file will be automatically compiled:

When you run this application, the current date and time are displayed on the page.

You can also play playground online.

More reading materials

  • Typescript Microsoft official website http://www.typescriptlang.org/
  • Typescript online-http://www.typescriptlang.org/Playground/
  • Typescript source code: typescript.codeplex.com
  • Anders
    Hejlsberg: introducing typescript

Summary

This article briefly introduces how to use typescript. I hope you like it or feel it is helpful to you.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.