(original text: nakeman.cn/engineering…)

Now that you have a solid JavaScript foundation, start looking at TypeScript. After reading the comparison articles and book introductions, my first instinct is that TypeScript and JavaScript are like OOP and FP, or FLExbox and NP in CSS. They are not about who eats who, but about two specially designed tools that accomplish the same task. That is, TypeScript is not a replacement for JS, but is used to develop projects that are not suitable for JS development. The key to understanding here is how the programming language can be designed as a tool (a tool of a higher level than the programming paradigm), just as two different design ideas from the programming paradigm produce OOP and FP programming.

Programming languages as a tool have a type system attribute (typing) that affects how you program (analysis and expression of programming algorithms), and a tool attribute that affects how efficiently and effectively you write programs (tasks) including design, analysis, development, and maintenance.

I find this article (TypeScript vs JavaScript: A Fight for the Web) to be concise and easy to translate.

The key and interesting questions in this article are how TypeScript’s purported benefits are realized: compile-time error checking, large project organization (clutter prevention), robust application functionality, etc. Answering these questions requires understanding the nature of program construction, such as why type information is needed (is type information predictable?).

1) Error check at compile time: this is easier to explain; 2) Code organization, I can think of, first, IDE hints; Second, the coding style is easier to unify; 3) Functional robustness is at the expense of readability and ease of use, and the specific principles need to be analyzed again. = =

Table of Contents

  • TypeScript vs JavaScript: A Fight for the Web
    • JavaScript
    • TypeScript
    • JavaScript vs TypeScript
      • Type system properties and syntax
      • TypeScript type system design
      • Code readability and program function robustness
      • compatibility
    • How to choose?

TypeScript vs JavaScript: A Fight for the Web

by Ethan ScullyJan 15, 2020

JavaScript is one of the most popular programming languages on the planet, with 95% of websites developed using JavaScript as of 2018. However, some people, and of course the designers of TypeScript, argue that JavaScript is outdated and it’s time for a new language to replace JavaScript: TypeScript.

This article Outlines the differences between the two languages so that you can see their relationship (including the pros and cons of tool features) and have an objective reference to “language choice for project development” now or in the future.

JavaScript

JavaScript, which was born in 1995, is a modern program language with high level, multi-paradigm and just in time compiled. JS applications can be compiled and run on the browser, or compiled and run on the Node platform environment.

Another important feature of JavaScript is that it is a dynamically typed (or weakly typed) programming language. Dynamically typed means that you can never specify data types (em) at runtime.

EM: Why specify type information?

TypeScript

TypeScript is much older, having been around since 2012. TypeScript is not a new and unique language, but rather an open source addition to JavaScript called a superset. New features are added based on JavaScript utility features or features.

C and C++ are an example of a “superset” relationship. C++ is just C with classes. Similarly, TypeScript is just JavaScript with strong typing syntax, classes (with some other optimizations), and so on. In fact, TypeScript’s compiler simply converts TypeScript code into plain JavaScript code.

JavaScript vs TypeScript

So, which is better? What are the philosophical reasons for TypeScript’s evolution? So let’s compare that.

Type system properties and syntax

JavaScript is designed to be loose, easy to use, and free. Dynamic typing is an important part of this design, and dynamic typing means that you don’t have to focus on the type of data when you’re analyzing it, you focus on the logic of the algorithm. Because offloading part of the thinking load, it will be easier to program reasoning, the code is simple.

That sounds like an advantage! It doesn’t seem like a weakness. That’s an advantage when it’s just you and a smaller project. However, the negative cost of this “freedom” is even greater in complex projects developed by teams.

If everyone on a team develops in their own free style (regardless of type), the resulting code base will only become harder to read, develop, and maintain [EM]. The bigger the project, the messier the code. Let alone someone else’s code, or even your own code may forget the original intent of the algorithm after a while.

EM: JS is simple, free and easy to use, but difficult to read and maintain. What’s the contradiction? That is, where is the conflict between large projects and the arbitrariness of JS?

TypeScript type system design

This is the philosophical reason why TypeScript was designed and developed. TypeScript provides a robust type system:

  1. Supports common static types
  2. class
  3. Structural typing

Note: Structural typing The basic rule for TypeScript’s structural type system is that X is compatible with y if y has at least the same members as x. TypeScript uses structural typing. The idea behind structural typing is that two types are compatible if their members are compatible.

One of TypeScript’s greatest strengths is that it is fully compatible with JavaScript code. TypeScript is just a superset where the original JavaScript code is completely available and programmed in the same way, just with more features.

If you haven’t mastered or mastered JavaScript, the relationship between TypeScript and JavaScript can cause some confusion and hesitation in learning TypeScript. JavaScript has no type restrictions and is notoriously easy to learn and use, and beginners will not understand the significance of adding type restrictions to JavaScript now [em]. In fact, freedom and organization are in conflict. For beginners, freedom, convenience and simplicity are more necessary, but not necessarily for professional large-scale projects.

EM: The biggest reason, in fact, is a lack of understanding of the meaning of “language type system properties” — the meaning of tool features.

Code readability and program function robustness

TypeScript’s type system allows code to be more organized and features to be implemented more robust.but it comes at a cost. The cost is reduced code readability.

Robustness is the ability of a program to handle a problem. This capability refers to the degree to which a program can correctly solve problems in the face of invalid input or under certain external pressures.

The perception of code readability is subjective and varies from person to person, but most programmers agree that the cluttered code is, the less readable it is.

The addition of TypeScript’s type system means that we need to write extra lines of code to maintain “the type of the program.” For example, when we write a new function that requires a data variable, it takes time and code to declare its type as well as its name. It makes sense that “robustness of code functionality” requires the sacrifice of readability, which means more mental analysis.

compatibility

As you can see, TypeScript is almost like JavaScript, and the real difference is for those who need the “type system functionality” to read and analyze the code.

How to choose?

While TypeScript adds valuable utility features to JavaScript, it doesn’t mean that everyone and every project needs to migrate to TypeScript. If your project is small, or if only one person is working on it, TypeScript may not work and the mental investment may not be worth it.

On the other hand, if you have a large project and team, especially one with high maintenance and evolution, TypeScript should be the best choice.