Coffeescript, Typescript and Javascript

Question

Among Javascript studies, I found in some places many people suggesting the use of Coffeescript or Typescript to accelerate the development process.

If I understand correctly, both are like a "metalanguage", a "makeup" that "improves" the syntax convolution of Javascript and then rewrites its code in JS.

Is this understanding right? How do Coffeescript and Typescript work? What are they really? What is your relationship with Javascript and how they can be used in web development instead of Javascript?

Answer 1

Ecmascript

This language that everyone calls Javascript actually is the Ecmascript. Her best known implementation is known as Javascript, so everyone uses this name. It is the first implementation, made by Netscape, which actually precedes Ecmascript, which is standardization by ECMA of the language that came later. The default was created after other vendors created their own implementations. The name did not remain the same because Javascript was a Netscape brand.

Javascript

This is the universal language that is available in the major browsers available on the market. It is the only language that can run in all these browsers, so any other language you want to run in a browser must generate a Javascript source code to make execution possible. Javascript has become what is called target language (target) for compilers who want the final code to run in a browser. This may change with the introduction of the Webassembly.

But Javascript, as it was well written in the question, has some problems. As its name suggests, it was created to be a language of script and not to make great systems. As the evolution of web this happened to be a necessity.

Many alternatives have emerged but no supplier of browsers wanted to put another language in it (who put did not succeed, because this new language, desirable in my opinion, would have to be universal too).

Compilation for Javascript

Then came the languages that are just layers on top of Javascript. Each aiming to solve a specific problem.

A compiler basically takes a set of texts understandable by humans trained with some rules, processes it and generates a set of information that is more understandable to a computational environment, often a processor, but not necessarily.

These languages are compiled through a compiler specific generating Javascript code that any browser can understand without any intervention. In fact the browser does not even know that there was a previous layer.

Usually these languages (not just the two above) do not need and do not provide libraries to perform extra tasks. The most they have are some codes Runtime, only something that is necessary to achieve the goals outlined by the language itself. They take advantage of everything that the browser offers. They don’t need special support to be able to perform or perform better. All this remains the responsibility of Javascript.

So there’s no big secret. The main thing is to have a compiler, and this is different from other languages that require more than a simple compilation to be useful.

Coffeescript

A language that aims to make the code more succinct, and draws inspiration from Python. Also "fix" some Javascript problems, some JS itself has fixed in newer versions. Improvements:

• repaired comparison operators, new entrants and aliases of other;
• variable declaration and scope;
• everything is expression;
• understanding of ties;
• parameter default and variable amount;
• facilities for handling array;
• interpolation of string;
• various imperative constructions;
• classes;
• among others.

We can say that Coffeescript is a language quite different from Javascript.

It had a growing community, improved tools but has a limited adoption.

Typescript

A language that proposes better organization of existing Javascript code. Every Javascript program is a valid Typescript program. The language has only added a few new elements, some of which can already be used but which will be in future versions of Ecmascript. Improvements:

• optionally static typing;
• classes (there is already something in JS), interfaces and mixins;
• modules;
• enumeration;
• Generics;
• optional and value parameters default;
• tuples;
• Union types;
• alias of types;
• among others.

One of the great advantages of the language is to allow a better verification of the code and the construction of better tools. In fact Microsoft is investing a lot in these tools. And not just her. Although it is a technology created by MS it can be used without any problem by those who do not use Microsoft technologies. Of course, one of the great advantages of the language is having the support of the IDE and in this Visual Studio E Visual Studio Code is right ahead.

Typescript has great compatibility with the main ones frameworks market even with static typing where there was no.

To see the language in action and try to understand better how the conversion is done, joke here.

An example of how a code is before and after compilation:

class Hello {
    quem: string;
    constructor (mensagem: string) {
        this.quem = mensagem;
    }
    Diga() {
        return "Olá, " + this.quem;
    }
}  

Compiled:

var Hello= (function () {
    function Hello(mensagem) {
        this.quem= mensagem;
    }
    Hello.prototype.Diga = function () {
        return "Olá, " + this.quem;
    };
    return Hello;
})();

I put in the Github for future reference.

Disadvantages

• These languages add an extra step to each change in the code. You need to compile from source language to Javascript which is the target language, without it there is no way to run.
• The process of debug is more complicated. Although they have already minimized the problems, creating increasingly suitable tools and code maps for debugging.
• They may be lagging behind with the improvements that Javascript may have).
• They do not solve one of the main problems of Javascript which is the incompatibility between browsers. Okay, it may not be exactly a language problem, but it affects who uses it.

Read more.

I couldn’t keep up with all the evolution of TS and JS, they are much more advanced, consider that when reading. Coffescript essentially died.

Answer 2

Exactly. Coffeescript and Typescript are both languages that are converted into Javascript by a (so-called) "compiler".

While Javascript is the scripting language that can be effectively interpreted and executed by web browsers, Coffeescript and Typescript are not immediately executable. No use, for example, put Coffeescript between tags <script> and </script> and wait for the browser to run! :)

Since the code developed in these languages needs to go through a "compilation" process until it turns into JS, generally more robust Ids are used that automate this step.

---

TIP

Since you are learning JS, here’s my tip: follow the pure JS! Avoid jQuery and other frameworks now... Javascript is a very simple language, but at the same time very powerful. When you’re manjando more, I strongly recommend studying Angular; you’ll probably never need anything else but JS + Angular!