TypeScript strongly typed Javascript–rafy Web frame selection

Today I saw a message that AngularJs version 2.0 will build on TypeScript. A discussion with colleagues about TypeScript was conducted. This article records some of the personal ideas.

The ideal JavaScript development model

In fact, as early as the TypeScript release, I began to focus on the language. Because at the beginning of 2012, I needed to write a Web-side automatic Interface generation framework for RAFY/OEA platform selection: Rafy.js. And this client framework needs to be based on some popular JS libraries to develop, then the focus of selection is to choose which basic framework.

At the time, I expected to find a development model that could write large JavaScript framework programs. Ideally, this development pattern requires:

• supports object-oriented design . Undoubtedly, the object-oriented design method is still the most important design method at present.. NET, Java, C + +, and so on are object-oriented languages. Encapsulation, inheritance, polymorphism, greatly improve the reusability of the program, maintainability, flexibility. Therefore, supporting object-oriented is a necessary condition for large-scale framework development.
• supports fast refactoring. I think refactoring is a very important capability that advanced developers must have. There is no constant perfect design, only the continuous improvement of the design. The dependencies and invocation relationships in the framework are often complex, although external interfaces are kept as stable and compatible as possible, but the interfaces inside the framework change frequently. And in the framework of tens of thousands of lines, non-repeating code, if there is no support for refactoring, it is difficult to imagine how to maintain so much code.
• compile-time error checking, package management, efficient code hints ... When it comes to maintainability of code, maybe we're talking about the design of the program itself. However, the improvement of development tools can greatly improve the development efficiency of developers, as well as the maintenance cost of program code. So the above-mentioned functions of improving development efficiency are also necessary for the development of large-scale programs.

These requirements, for the strong type of. NET, Java Development, is actually the most basic. However, it is not easy for weak types of dynamic language JavaScript. Weak type, dynamic characteristics, it is difficult to determine the specific type of a variable if it is not run, so it is difficult to provide code hints, refactoring and so on. I've been plagued by these problems since the first day I developed JavaScript, and I hope to have the technology to solve them someday.

Rafy.js's basic frame selection

When I was writing the Rafy Web front-end framework, I chose several options to solve the above problems. One of them is typescript!. After my trial, I found that the strong type of JavaScript can really solve these problems. But helpless is, at that time TypeScript is just a newborn baby, version number 0.8, even the first official version is not released, really dare not to use on the real project, due to the project's time requirements, so have to give up the language.

In addition, I also examined several JS frameworks, and finally selected ExtJS 4. One is because I want to do is singlepageapplication Web interface framework, and ExtJS 4 with a large number of interface controls, very convenient to use, second, ExtJS 4 provides the client's entity model, which can be better combined with the Rafy service-side entity. More importantly, ExtJS 4 brings a new object-oriented type system that solves the infrastructure problem of object-oriented design. Although other frameworks such as prototype.js support some object-oriented design more or less, the EXTJS4 type system is undoubtedly the most comprehensive: namespace, encapsulation, inheritance, interface, static, Singleton, type reference management. So, Rafy.js is ultimately built on the basis of EXTJS4.

Here is the framework class that was developed when Rafy.js was completed:

Note that in order to better address the above issues in the development process. We have to artificially add a Javascript class Library development specification. The contents of this document are in fact agreed to some encapsulation, inheritance, polymorphic writing conventions (ExtJS given the object-oriented type system is also imperfect), as well as some code specifications. These problems, in fact, can be solved from the perspective of language, tools, but we have to manually contract, manual inspection!

Although EXTJS4 generally solves the problem of object-oriented design. But because of the difficulty of refactoring, writing inefficient, resulting in the first version of Rafy.js only wrote thousands of lines, it has been felt that maintenance is very laborious.

TypeScript

The above says so much, nothing more than to express: strong type is very important, refactoring is very important, tools are important. And these are the main goals of the TypeScript language design: "As we look to the 2.0 release, we ' re focusing on both goals in addition to our main goal of BR  Inging Good tooling to JavaScript development. The first is to align with ES6 ... "

Let's start by explaining the advantages of TypeScript (strongly typed JavaScript):

• Better development tools: Support refactoring, code completion, code navigation, compile checking (Static code analysis: Displaying warnings and errors), package management ...
• Better language Features: type designation, generics, object-oriented support.
• Compatible with native JavaScript.

This is what I want, but also the development of large-scale JS project tool.

However, TypeScript is not suitable for all developers, all projects, and the following are TypeScript adaptation scenarios:

• Adapt to larger, complex projects. such as singlepageapplication, large JS frame, the front-end game.
• Need to support object-oriented design, high reusability, modular development of JS code.

Here is a scenario that TypeScript does not fit in:

Some simple code that does not require OOD, high flexibility, and high dynamics is not suitable for selecting TypeScript. For example, the general WEB application or the front-end development of the site, this page-level logic is often written on the page, that is, simple, and do not need OOD, and then, the development of the JQuery framework, the goal of this framework is flexible, convenient, dynamic, not object-oriented, so it is not suitable, so JQuery The framework should not be rewritten with TypeScript.

Currently, TypeScript has released the 1.4 version. To open the Extension manager for Visual Studio 2013, you can install:

The next plan

Next, I'll use TypeScript to rewrite the rafy.js. Before I formally change the rafy.js, I will try to change the Web game "Javascript tank game" which I have done before.

Please look forward to it.

Related articles:

"TypeScript MSDN Blog"

"TypeScript official Website"

"TypeScript Online Trial"

Which of the Dart, Coffeescript, TypeScript, and JavaScript is best for specialized learning? 》

Why is typescript the answer to any thing? 》

Introduction to type (hyper-set of JavaScript)-translation

TypeScript strongly typed Javascript–rafy Web frame selection