TypeScript and the Road to 1.0
blogs.msdn.com
blogs.msdn.com
The language itself seems like a winner as well. Its conservative design makes it the perennial dark horse of the compiled-to-JS language family, but that's also what makes it most attractive to me. It's a thin-enough skin over the underlying language that you get the familiar Javascript syntax (as per Dart) while also retaining the ability to understand the generated code (as per Coffeescript). It's also got well-defined corporate backing, which in a professional environment gives me more peace of mind than recommending Coffeescript (does jashkenas get paid to do this?), Clojurescript, or Elm (I'm somewhat concerned about Dart here as well, at least until Google starts using it in production). These properties mean that I'd happily recommend TypeScript for client-side enterprise software development (but only once the compiler hits 1.0, of course).
With that said, as ES6 evolves and becomes more widely supported there will be aspects of the TypeScript compiler that will no longer be needed (e.g. classes, modules, fat arrow functions, etc.).
I think that is a valid statement only within the context of the next ECMA release. In other words, that's not to say that whichever successive version after ES6 can't include it, or any version thereafter.
> Structural function types describe functions and methods. The type
> function (int, string): boolean
> describes a Function object that takes two arguments, one int and the other string, and which returns a boolean
Given that a great many other concepts from ES4 are finding their ways into ES6, it is not implausible that this one may also reappear into a more consensual specification someday.
[1]: http://wiki.ecmascript.org/doku.php?id=strawman:guards [2]: http://wiki.ecmascript.org/doku.php?id=strawman:trademarks
I really hope I can do something like
for (
ra <- asycn_opA(),
rb <- async_opB(ra),
_ <- asycn_opC(ra, rb)
spawn(function*() {
var ra = yield async_opA();
var rb = yield async_opB(ra);
yield async_opC(ra, rb);
});
Q.async(function*() {
var ra = yield opA();
var rb = yield opB(ra);
yield opC(ra, rb);
})().done();
Here's your example rewritten in the 'monads' library (I probably need a better name):
monads(function() { var ra = opA.defer(); var rb = opB.defer(); var result = opC(ra(), rb()); });
It is good to see people try different things though, so congrats on release.
In practice this has meant that code that doesn't change much but is called frequently is fully typed, while code that's under more active development is less typed, unless it's tricky.
I've only just started playing with the noImplicitAny setting, where the compiler complains loudly about any identifier that it can't figure out a type for. Not sure what I think of it yet. I'd kinda like something that lets me do a targeted noImplicitAny, but it might be enough to just do it at the file level (i.e. these files should be fully typed, these files shouldn't).
From my experience with Dart, I'd say it can work really well. Basically, if you just put type annotations at the API boundaries, you already get most of the type related benefits you would get with something like Java or C#.
Inside your functions, you can generally omit types. For the tools, there is enough type information floating around to make sense of everything.
If you use a literal, the type is known. If you use some annotated function, the type of the return value will be known. If you assign any of these things to "var", the actual type will be remembered. This means you get sanity checks, call-tips, and auto-complete without having to annotate the types there.
Putting types at the API boundaries also acts as documentation. It's so much better than writing JSDoc comments. Plus, you get all the benefits right away. It's a very sweet deal.
You are probably going to end up using types a lot if you are using projects that already have type declaration files available (from the DefinitelyTyped project).
Well, there is a downside in that you're now having to choose between adding type annotations where you don't particularly want them or ignoring compiler errors (warnings?). The former puts types everywhere, the latter partially defeats the purpose of static typing and adds "sort out the errors I care about" as another work duty.
My understanding is that with typescript you can use .js/.ts files as a relatively coarse mechanism of segregating out your untyped code, but it isn't entirely roses.
That is just not the case. Types get inferred. If the inference isn't making it all the way through that means you have dynamic types, not a compilation error.
And yes, ignoring warnings is crazy. TypeScript has very few warnings, mostly just errors that can't be ignored.
False dichotomy.
You want both and you need both.
Why? Let the compiler do the testing for you.
I love the idea of optional typing being supported (whether in the base language or TypeScript/Closure/etc) but it's maddening to think of trying to have to add the type information manually to existing code, especially code with lots of good test coverage, knowing that the JavaScript runtime seems to have to figure it out anyway (at least based on talks about V8 from the past).
This kind of functionality seems even more important for projects like DefinitelyTyped, where people are trying to track the public API's for projects that sometimes have a lot of churn. Having runtimes export their runtime type information (which seems to have sufficient mapping to source based on existing debugger experiences in Chrome, IE10+, etc) and allowing the creation of tooling that can populate/check/etc the type information in source seems like a big potential win.
Anders asking the Chakra team for this to (massively, AFAICT) help TypeScript adoption among existing projects seems reasonable, but TypeScript type information seems to still be 'add it yourself' for now?
Am I just missing something that makes this far more complex/difficult/intractable than I realize?
However, I think if someone came up with a system to add optional typing through the use of string literals it would be awesome. That way we can have perfectly valid JavaScript with the benefits of certain JavaScript engines and type checkers. The string literal would be before a function declaration like:
"add(Number, Number) -> Number";
var add = function(x, y) { return x + y; };
The Closure Compiler has a whole type system that lives in doc comments:
https://developers.google.com/closure/compiler/docs/js-for-c...
and I believe there's a command line option for doing type checking. Alas, Closure Compiler is written in Java rather than JavaScript so you can't use it quite as seamlessly as TypeScript's compiler.
I also hope that they make a better module system.. currently it's pretty confusing and I don't really know how to differentiate between TypeScript and Node.js modules.
Reading through the marketing material from MS it seems like the entire value proposition is "statically typed languages make it easier to think about your program, also we added the class keyword so you don't feel lost"
I suppose if you believe those claims or are really interested in using MS development tools, TypeScript is for you.
IMO, ClojureScript is much more interesting and has a far greater value proposition for complex front-end development.
I believe EcmaScript 6 plans on adding the class keyword and TypeScript's implementation reflects the current draft of how classes in ES6 will work.
> ...statically typed languages make it easier to think about your program...
Out of curiosity, do you normally program using statically typed languages?
If not, I can see why you would be underwhelmed. Then again, I shouldn't be surprised by your reaction. This is Hacker News and TypeScript is by Microsoft.
I do not use statically typed languages and I have nothing against MSFT; I was solely commenting on TypeScript as a language.
TypeScript's best feature (imo) is its (optional) static-typing so if you don't like static-typing to begin with, then yeah, it doesn't have much else to offer you.
To each his own.
It does help Visual Studio and other tooling, but to say it is only "to sell Visual Studio, nothing more" is ridiculous.
This implies that you can't develop large scale apps without type checking, which obviously isn't true.
What's more likely is that Microsoft hires a lot of developers that know the "VS way" of coding, which is using intellisense and type checking, and they made a language that conformed to that. Which is the same thing as I originally said.
productively
You missed the most important word.
As someone who has spent quite some time on Javascript codebases its amazing how quickly things break down when you get developers of different levels working on the same codebase. Optional typing allows a whole batch of problems to be caught way before weird errors/exceptions client-side. Productivity goes way up when the tooling can check basic errors.
(Part of me still wishes Haskell was an option for web scripting but I can dream)
You're not the only one: http://www.di.unipi.it/didadoc/lfc/OtherPapers/Iteroperabili...
(n.b, this is from 1999)
Whether its Google Web Toolkit/Java/C#-to-Javascript generators, Closure templating, Haskell/Clojure/etc. mini-languages, TypeScript, etc. (Job Ad Requirements are one of the great ways to see all this stuff)
When you start working on big applications (e.g. I worked for 5 years on a huge electronic HR application covering everything from timesheets to recruitment to content management to CRM with multi-country, multi-language, multi-regulatory, multi-company, multi-site, multi-thousand users requirements) you realise JavaScript has serious shortcomings...although I still really like the language the tooling and knowledge advances have really, really helped.
The more likely conclusion is Microsoft is open-sourcing a tool the found useful internally when building large JavaScript apps.
Suit: People aren't using Visual Studio for JavaScript, why not?
VS PM: We can't do Intellisense properly, so people are using Sublime.
Suit: What can we do about that?
Anders: Let's create our own language that works better with VS.
I'll have you know I paid for my WebStorm license because of its TypeScript support =)
From what I understood, they both basically solve the same problems, one just does it in a Ruby-esque style while the other does it in a C#-esque style.
I've been using TypeScript in my startup the last 6 months.
They are definitely not the same. TypeScript is JavaScript + types, whereas CoffeeScript is a new language, a mashup of Ruby and JS. (For example, you can take any JS on the web, paste it in a TypeScript file, and it will compile. But you absolutely cannot do this in CoffeeScript.)
CoffeeScript tries to do clever things for you, which often results in inefficient code. For example, say you've got a function that ends with a for loop. CoffeeScript will actually convert that into an array allocation and return the result of the array. (Looping over 1000 elements at the end of a function? CS just allocated a new array which will be dynamically resized at runtime multiple times, allocated 1000 buckets for the elements.)
CoffeeScript also can't make up its mind about whether parens are necessary. Function with multiple params? Not necessary. Chained function, like jQuery? Necessary. Most of the time. Function with no params? Necessary, unless you use the 'do' syntax.
It's a mess.
TypeScript, on the other hand, is designed by respected, experienced language designer Anders Heijlsberg. His language wisdom and overall vision for the language shines through.
Bottom line: Both are better than vanilla JS, I'd say. But I work with CoffeeScript when I have to. I work with TypeScript because I choose to.
Simple, just return anything else, or nothing at all:
myFn = () ->
for el of array
# loop body
return
Well, in some cases they're optional, but it's predictable and hardly "can't make up its mind". I've never run into a problem with this. Implicit parens wrap to the end of a line or block expression, and it feels pretty natural:
f g h obj -> f(g(h(obj)))
f g, h, obj -> f(g, h, obj)
f().g().h obj -> f().g().h(obj)
I prefer to think of parens as sometimes optional.
Thanks for the thorough info though, I've only used TS a little and CS none at all, though from what I've seen I'd side with you in that CS tries to be too clever and/or is too foreign for my non-Ruby brain, whereas TS more closely melds with my skillset.
> For example, you can take any JS on the web, paste it in a TypeScript file, and it will compile.
This myth won't die.
False. Typescript will choke on most JavaScript files from the web. Because you will need to include definition files for any external library calls. If you use jQuery, for example, the compiler won't like your $('.class').doStuff() calls because it won't recognize it until you go find the jquery.d.ts file to include at the top of your file. Also, TypeScript will struggle with the dynamic-ness of JavaScript. To prove this to yourself, paste the contents of typeface.js into the play compiler at www.typescriptlang.org/Playground/ and you'll see all the red squigglies that you have to fix.
On the other hand, if you can do it in JavaScript, you can do it in CoffeeScript, because CS is NOT statically typed. You can use js2coffee to convert any valid JS on the web to coffeescript.
In my testing it takes me 25 times longer to take legacy code and convert it to TypeScript than to convert it to CoffeeScript. That's because "valid JavaScript is NOT valid TypeScript."
> CoffeeScript tries to do clever things for you, which often results in inefficient code.
I find that CoffeeScript's results are BETTER than the TypeScript code. For example, CoffeeScript automatically does array length caching in it's for loops, resulting in much faster loops. It also correctly converts == to === in comparisons, eliminating many nasty JavaScript bugs. TypeScript does neither. In my analysis, TypeScript generates poorer code than CoffeeScript.
> CoffeeScript also can't make up its mind about whether parens are necessary.
Use them all the time if you want, CS isn't dogmatic about it. EcmaScript 6 (and TypeScript too) will be moving toward optional parentheses too. It's a nice feature.
> TypeScript, on the other hand, is designed by respected, experienced language designer Anders Heijlsberg. His language wisdom and overall vision for the language shines through.
Anders has done a fine job of making TypeScript look like C#. It's one redeeming trait is that it helps the tooling for allowing refactoring and intellisense. I find it cumbersome and you have to put a lot of ceremony into your code just to get it working. It is roughly 35% more lines of code to do the same thing in TypeScript that you could do in CoffeeScript, and you are fighting the compiler more often. I think TypeScript would be an incredible burden for enterprise applications because of the need to include definition files. Think of the joys of upgrading your version of jQuery and having to find the jquery.d.ts file to go with it.
I recently presented a talk at a conference on the two languages and after evaluating both languages in depth, CoffeeScript was the clear winner. Both in the code it produces, but also the amount of effort to develop in it.
Just went to the playground and dropped a random jQuery sample in: http://www.typescriptlang.org/Playground/#src=%24(%20documen...
You get squiggles yes, but you also get valid javascript. So it looks like you can paste random javascript into TypeScript and get it to compile. I went and tried with the actual compiler (to make sure it's not some artifact of the playground website), and confirmed you get a proper .js file out (and 2 messages, about $ being undefined).
Quick google makes it sound like getting rid of the squiggles / messages is pretty easy: http://stackoverflow.com/a/12755602/80572
I'm not sold on TypeScript yet (or any of the transpiled javascript languages, honestly), but this:
> False. Typescript will choke on most JavaScript files from the web.
Seems to be the actual false statement in this thread.
I've used the typescript compiler on a randomly-chosen JS library (typeface.js http://typeface.neocracy.org/typeface-0.15.js ) and it had dozens of compiler errors for me to fix before it would compile. The playground is now accepting them for some odd reason. This seems to be recent behavior or perhaps the node.js version of the compiler behaves differently?
var s = 'hello';
s.toExponential();
In my experience so long as you don't have any syntax errors, tsc will give you back javascript. This is partly because the translation from typescript to javascript is incredibly straightforwards and ignores the types completely. Writing a nonvalidating, dumb but super fast ts -> js transpiler is about an afternoon's worth of work, especially if you bootstrapped from the typescript parser and tests.
"CoffeeScript is only syntactic sugar. It brings very little new to the table, but perhaps worse of all, it doesn't really fix all of JavaScript's WTF-issues while adding a few of its own. While it's an improvement over JavaScript, its advantages are sometimes outweighed by the extra hassle to compile and deploy it"
I work on a >300k line JS codebase, and our tooling means you can make a change and hit f5 and you always get the latest version of the code. No file watching latency, no run-an-external-tool latency. We /could/ do the auto-reload thing, except that I think that for large applications with lots of state, that's probably the wrong choice.
As far as I'm concerned visible 'builds' are the enemy to development. They take you out of your mental context, and in the worst case make even the tiniest changes painful. I've got nothing against pipelines of tasks, so long as the whole thing runs in milliseconds and is transparent to the developer.
Obviously, you can do more on an occasional basis, perhaps before check in, and certainly in CI, but we need to reduce friction, and unnecessary build steps in environments that don't need them is a whole heap of friction.
The application has been continuously developed for nearly 10 years now, and small parts of the current codebase are 5 years old. A little while ago, I was very pleased to find and remove some code that was weird in order to work in IE4, but these days I'm enjoying removing IE6 and IE7 specific code. IE8 is the last non es5 browser we have to support and it's painful. The whole application runs in the browser, and connects to services it needs via streaming connections.
Once you take into account the fact that it's not just a couple of pretty forms for a back end application, plus the fact that in the browser you have to write things that come as standard in many other environments, plus the fact that you used to have to write extra code to work on different browsers, plus the fact that the javascript ecosystem was not up to the task back then so lots of things that would be generic now had to be written in house, plus the fact that it's extremely well tested both with unit tests, acceptance tests and integration tests, then a large codebase is really not all that surprising.
Just my observation.
TS (or Dart) makes JS more toolable and thus more scalable. CS, on the other hand, just offers a keystroke reduction by dropping the "function" keyword, semicolons, and other punctuation.
TS and Dart also reduce the number of keystrokes though. They allow you to auto-complete pretty much everything.
Reducing boilerplate for loop code:
CS:
for el, index in arr
el.doThing(index)
JS:
for(var index=0; index < arr.length; index++) {
var el = arr[index];
el.doThing(index);
}
CS:
for own k, v of obj
console.log "#{k} is #{v}"
JS:
for(k in obj) {
if(!obj.hasOwnProperty(k))
continue;
console.log(k + " is " + obj[k]);
}
CS:
foobar = (foo = "default", bar = "shmefault") ->
# Go on...
JS:
function foobar(foo,bar) {
if(foo === null)
foo = "default"
if(bar === null)
bar = "shmefault";
// Go on...
}
CS:
str = "There are #{num} #{item}s available for $#{price} each"
JS:
str = "There are " + num + " " + item + "s available for $" + price + " each";
CS:
if obj?.prop?.exists?
console.log "obj.prop.exists"
JS:
if(typeof obj !== "undefined" && obj != null && obj.prop != null && obj.prop.exists != null)
console.log("obj.prop.exists")Reducing boilerplate for loop code:
var index = 0;
for (var el in arr) {
el.doThing(index++);
}
Better iteration over objects:
obj.forEach((k, v) => print("$k is $v"));
Default function params:
foobar([foo = "default", bar = "shmefault") {
// Go on...
}
str = "There are $num ${item}s available for \$$price each" a = [1,2,3];
a.prop = "oops";
for(el in a)
console.log(el);
// > 0
// > 1
// > 2
// > oopsBy the way, Dart also has optional named/positioned arguments, sane for-in loops, and string interpolation. It also offers proper lexical scoping (oh, yeah!) and even operator overloading.
CoffeeScript generates less code than Dart, it runs faster thus has its strength in scaling.
In fact, you can already do operator overloading in Javascript using valueOf and side effects. It's a bit tricky though. The Dart approach of operator overloading works more sanely.
If two languages compile to the same runtime (Javascript). Syntax is the only thing we can compare. Many so called "syntactic sugar" do fix design problems of Javascript, please don't ignore them.
There are cases where output from dart2js outperforms handwritten JS. Nowadays, the performance of the generated JS is generally pretty good.
> it runs faster thus has its strength in scaling
"Scaling" as in: more developers, more files, more lines of code. Bigger projects.
CS doesn't help with that one bit. It's just as difficult to handle as JS. This is why Google came up with stuff like the Closure Compiler, GWT, and now Dart.
> Syntax is the only thing we can compare.
There are also semantics and the whole environment. Syntax is a small fairly unimportant detail.
Right, and that's why we have modular design patterns that use the single responsibility principle, and AMDs like Require.js or CommonJS. It's testable, maintainable, can support a large codebase with multiple developers, and doesn't need static typing or other features from TS/Dart.
That stuff is terrible to use. There is quite a bit of boiler plate involved and there is lots of overhead in general.
Secondly, there are about 10 somewhat popular module formats and they aren't compatible which each other.
I rather do this stuff declaratively. If it's baked into the language, your tools will understand what's going on and there also won't be any compatibility issues. Naturally, it's also way more convenient to use. You just import something. Done.
> doesn't need static typing or other features from TS/Dart
You also don't need a seat belt or airbags. If you don't make any mistakes, you'll be fine.
However, from a pragmatic point of view, these static checks are very handy. If you rewrite some parts of your code, the analyzer will tell you if you screwed something obviously up. It catches all the stupid mistakes, which means you can fully focus on the logical ones.
With JavaScript/Python/etc you have to run the code and actually hit that particular branch to trigger some sort of error/exception which will eventually help you to identify the actual issue.
You should just give it a try. Try any language/IDE combination which offers good tooling. Tooling can remove a lot of friction. There really is a point to all of this.
You like your IDEs and static typing and tooling, and it works for you (and for many others). I like my CoffeeScript, my AMD/CJS modules, and testing, and it works for me (and for many others).
Your experiences and assertions are wildly different than mine. I've never found AMD modules a problem. I have found overwrought and verbose code to be a problem. File headers? Interfaces? Java-style OOP in my JS? No thanks.
I think we're both just stating subjective opinions without substantiation, so I'm done here.
No.
> Interfaces?
Implicit interfaces. It's kinda handy.
> Java-style OOP in my JS?
I'm not sure what qualifies as "Java-style" OOP. Is the stuff from ES7 also "Java-style"? How about the stuff from CS?
Well, you don't have to use classes. You can do everything with functions if you want.
> I think we're both just stating subjective opinions [...]
The difference is that I actually tried it.
I've used heavy IDEs before with Java, and I much prefer a simpler text editor like Vim or Sublime. I tried out TS a while back. All the examples I've seen were overweight, much like classical enterprise Java. Too much cruft.
Anyway, enjoy TS.
If your machine has 6+ GB of RAM, it doesn't really matter if some IDE uses like half a gig of that. I mean, that's why you bought all that RAM in the first place, isn't it? The point was to use it, right?
Same deal with all those beefy cores. Giving one of them a little bit of work won't hurt one bit.
The only actual downside is that start up takes quite a bit longer than 100msec. However, if you're using it all day, it doesn't really matter if it took 15s to start, does it?
I believe that one should automate as much as possible. Offloading as much brain-dead repetitive work as possible to machines is always a good idea.
So, check if I use the right kind of arguments. Check if that thing has that field or method. Tell me if there are any methods which start with "foo" and if so, tell me their exact names, arguments, and return values. Tell me if the change I just did broke something.
That's the nice thing about machines. They will happily do this stuff over and over again, a thousand times a second. They'll never get tried of it. They'll never complain.
One thing I really dislike about JS is having to check documentation. If you want to use some library/plugin/whatever, you always have to go to its website, navigate to the docs, and then navigate to the specific section. Just to look up the arguments or the names/types of that config object you have to pass to that function.
It's so much nicer and also way faster to do that kind of thing directly in the IDE.
> enjoy TS
I use Dart. And yes, I do enjoy it. It's very pleasant to use.
Most of the semantics or environment stuff are translated into function calls at last. Then the difference becomes the syntax again: how to use that function? Call it directly or translate a syntax?
I like coffee because it is practical scripting: Need code completion? Don't repeat yourself. Can't code without IDE? Make the language easier to use then you ain't gonna need it. Some people just can't believe a language can be that good without IDE, but remember: you interact with IDE through a language on keyboard/mouse too.
That's awesome that Dart includes those features, and I wish that I had lexical scoping in CS. But closures are a pretty easy workaround.
> TS and Dart also reduce the number of keystrokes though. They allow you to auto-complete pretty much everything.
That sounds like an IDE/editor feature, not a language feature. Setting up macros/snippets/etc in an IDE/editor will save keystrokes for most any language.
Being toolable is a language feature. You can't do these things with JS or CS, because your tools don't have a clue what's going on. You can only do some guessing.
CS is a better JS, but doesn't enforce any design decisions like static typing, or OOP (with interfaces apparently?). I like CS, because I like JS, and I like that it doesn't try to shoehorn in concepts foreign to JS.
It's possible to build scalable systems in JS/CS without what TS/Dart offers. You might not be able to do so from your experience, but that doesn't mean it's not possible.
"Autocompletion" is… "automatic": you type the beginning of a method name and you get a contextual menu following your cursor showing a list of suggestions. Many editors have that feature, either built-in or via plugins, but it's definitely an area where IDEs shine. If the editor/IDE has a way to infer scope, you get good completion, if not, you get mediocre completion.
But "snippet expansion" or "templates" as they are called in some IDEs is very easy and doesn't require statical analysis or whatever.
All the fields and methods are known. If I write "someObject.", then I'll get a calltip which lists all fields/methods from this particular class and I can auto complete them. You can conveniently browse around like this to find the right method.
If I write "foo.bar" and "foo" as no "bar" field, I'll get a squiggly line (and of course I also wouldn't have been able to auto-complete "bar").
It's similar to writing C#, AS3, or Java with a good IDE. If you have never experience any of that, maybe you should give it a try.
> It's possible to build scalable systems in JS/CS without what TS/Dart offers.
Sure. It just requires more time and money.
You can, for example, also chop down a tree by using an axe instead of a chainsaw. There is always a more difficult more time consuming way to do something.
> Sure. It just requires more time and money.
Care to back that up? I'll wait over here. Oh, unless you meant that it would take more time and money for you. Then sure, I agree.
This stuff is only possible if you can analyze the code statically.
With JS, which is running in a browser, you don't know anything. You don't know what other kinds of scripts are running on that page. You don't know which globals these introduce or which built-ins they modify.
E.g.:
Math.round(5).length
For tools, this is a big problem.
In Dart, the analyzer knows about all these things. If the function is annotated, I'll get all the tooling and checks.
> Care to back that up?
No. You can't even imagine what good tooling is like. Naturally, you're blind to the friction which is caused by a lack of good tooling.