Typescript Getting Started Guide (hyper-set of JavaScript)

Have you ever heard of TypeScript?

TypeScript is a superset of JavaScript, TypeScript combines type checking and static analysis with explicit interfaces. Typescript is Microsoft's Open source project, which was initiated by the parent of C # Anders Hejlsberg.

Why do you have TypeScript?

JavaScript is just a scripting language, not really designed to develop large Web applications, JavaScript does not provide concepts such as classes and modules, and for a real application development, TypeScript extends JavaScript and implements these features. TypeScript Key features include:

• TypeScript is a Microsoft-launched open source language that uses the Apache licensing protocol
• TypeScript is a superset of JavaScript.
• TypeScript added optional types, classes, and modules
• TypeScript can be compiled into a readable, standard JavaScript
• TypeScript supports the development of large-scale JavaScript applications that support all browsers, hosts and operating systems
• TypeScript is designed to develop large applications and ensure compiled JavaScript code compatibility
• TypeScript extends the syntax of JavaScript so that existing JavaScript code can be run directly with TypeScript without changing
• The TypeScript file extension is TS, and the TypeScript compiler compiles it into a JS file
• TypeScript syntax is the same as JScript. NET
• TypeScript is very easy to learn and easy to understand

Language Features

• Class
• Interface
• Module
• Type annotations
• Compile-Time type checking
• Arrow functions (Lambda expressions like C #)

The difference between JavaScript and TypeScript

TypeScript is a superset of JavaScript that extends the syntax of JavaScript so that existing JavaScript code can be used with TypeScript without any modifications TypeScript Provides compile-time static type checking through type annotations. TypeScript can process existing JavaScript code and compile only the TypeScript code in it.

Supported editors

Today, Visual Studio 2012 supports TypeScript module/syntax highlighting, but requires the installation of the TypeScript plugin. And like Sublime Text, the Vim and Emacs Editor supports syntax highlighting.

In the VS 2012 editor, features such as refactoring (refactor) and goto definition (go to define) are also available.

Note:typescipt does not rely on any IDE, and you can compile TypeScript into JavaScript in any application.

How to get

You can install TypeScript by using the following two methods:

• via the node. JS Package Manager (NPM)
• Through the MSI integrated with Visual Studio 2012. (Click here to download)

Note: Please close other applications to avoid some problems during installation.

The following is the interface that is installed through the MSI file:

If you just want to see TypeScript first, click here.

How to compile TypeScript

To use TypeScript in your application, you must compile the result of the compilation and compile the JS file, which you can do through the TypeScript compiler TSC.

If you use TypeScript in Visual Studio 2012, it will automatically compile the TS file into a JS file.

The TypeScript compiler template is installed in the following path:

C:\Program Files (x86) \microsoft sdks\typescript\0.8.0.0  

Or

To compile the TypeScript file, you can use the following command:

TSC Filename.ts

Once the compilation is successful, a JS file with the same name will be generated in the same directory, and you can modify the default output name by using the command parameters.

If you want TypeScript to be automatically compiled, you can learn about the next Sholo.TypeScript.Build, Web Essentials 2012.

TypeScript Project/File template

If you installed the plugin on Visual Studio 2012, you will see the following template:

Mvc–typescript Internet Application

TypeScript File

My first HTML app written in TypeScript

Now I'm starting to create a simple HTML app with TypeScript.

First create a new project through File--new-project:

Click the Ok button to create the following project template:

We will see that App.js relies on app.ts, the default App.ts file contains classes and constructors, and so on, such as:

The TypeScript file will be compiled into JavaScript (app.js), followed by the compiled JavaScript code:

Then we can reference JavaScript in the page

When you build or rebuild the project, you will see a prompt to recompile the TypeScript information:

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

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

You can also try it online: Playground

More reading Information

• TypeScript Microsoft Official website http://www.typescriptlang.org/
• TypeScript Online Play-http://www.typescriptlang.org/Playground/
• TypeScript Source Typescript.codeplex.com
• Anders hejlsberg:introducing TypeScript

Summarize

In this article we briefly describe how to use TypeScript and hope that you will like or feel helpful.

Typescript Getting Started Guide (hyper-set of JavaScript)