Today we’re happy to announce TypeScript 1.4. With TypeScript 1.4, we’ve continued to build new features that help you work with more JavaScript patterns, create richer typings, and use new ES6 features.<\/p>\n
You can try these improvements out as part of Visual Studio 2015 CTP5<\/a>, Visual Studio 2013<\/a>, NPM<\/a>, and as source<\/a>.<\/p>\n JavaScript functions may take a number of possible argument types. Up to now, we’ve supported this using function overloads. Starting with TypeScript 1.4, we’ve generalized this capability and now allow you to specify that that a value is one of a number of different types using a union type:<\/p>\n Once you have a value of a union type, you can use a typeof and instanceof checks to use the value in a type-safe way. You’ll notice we use this in the above example and can treat x as a number type inside of the if-block.<\/p>\n Union types are a new kind of type and work any place you specify a type.<\/p>\n You can now define an alias for a type using the type keyword:<\/p>\n Type aliases are exactly the same as their original types; they are simply alternative names. You can use these aliases to better document your code and aid readability.<\/p>\n For heavy uses of enums, it’s helpful to have an even more restricted form that we know is safe to always inline. This helps with performance, code size, and with working with cases where the enum aliases themselves may not be exported. Starting with TypeScript 1.4, you’ll be able to make const enums.<\/p>\n When compiled, the const enum is removed, leaving ‘var c = 0 \/* Blue *\/’.<\/p>\n You can get also more information and examples about updates to the type system on our TypeScript 1.4 sneak peek blog post<\/a>.<\/p>\n In addition to the type system improvements, one of the main goals for the upcoming TypeScript 2.0 release is to fully support the ECMAScript 6 standard. With TypeScript 1.4, we take another step towards this goal. In this release, we’ve added a new ES6 output mode, support for let and const, and support for ES6 template strings.<\/p>\n In previous TypeScript releases, we included a ‘–target’ commandline option that allows you to choose between ES3 and ES5 output modes. We’ve added a new ‘ES6’ option to the targets commandline option:<\/p>\n This option will be required for ES6 features that cannot be output to ES3 or ES5, just as ES5-only features, such as getters and setters, have required the ES5 target option.<\/p>\n We’re in the process of updating the existing language features from ES6, such as lambdas and classes, to support ES6 mode by outputting their native forms. You may need to install an additional .d.ts file<\/a> for this to work.<\/p>\n The ES6 ‘let’ feature is similar to ‘var’, but it aims to simplify the mental model for the variable’s scope. With ‘let’, you can scope variables to blocks of code rather than whole functions. For example:<\/p>\n Notice how the two ‘let x’ statements do not conflict. This is because the one used in the loop is in a different scope than the one outside of the loop. If we re-wrote this using vars, all ‘x’ vars effectively combine into one, leading to rather confusing output.<\/p>\n TypeScript now supports using ‘let’ and ‘const’ in addition to ‘var’. These currently require the ES6 output mode, but we’re are investigating relaxing this restriction in future versions.<\/p>\n ECMAScript 6 has further improved on string interpolation in JavaScript by adding template strings. These special strings can freely mix in expressions, allowing a lighter syntax when pieces of a string depend on associated values:<\/p>\n With the 1.4 release, TypeScript now supports ES6 template strings and can also compile them down to ES3\/ES5 expressions.<\/p>\n We’re excited to bring new features into TypeScript, including more ECMAScript 6 features and our work on async\/await<\/a>. As always, we’d love to hear your feedback. You can get involved by trying out the release, sending us a bug<\/a>, playing with the source<\/a>, and sending us a pull request<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":" Today we’re happy to announce TypeScript 1.4. With TypeScript 1.4, we’ve continued to build new features that help you work with more JavaScript patterns, create richer typings, and use new ES6 features. You can try these improvements out as part of Visual Studio 2015 CTP5, Visual Studio 2013, NPM, and as source. Type System Improvements […]<\/p>\n","protected":false},"author":377,"featured_media":1797,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-1824","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-typescript"],"acf":[],"blog_post_summary":" Today we’re happy to announce TypeScript 1.4. With TypeScript 1.4, we’ve continued to build new features that help you work with more JavaScript patterns, create richer typings, and use new ES6 features. You can try these improvements out as part of Visual Studio 2015 CTP5, Visual Studio 2013, NPM, and as source. Type System Improvements […]<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/typescript\/wp-json\/wp\/v2\/posts\/1824","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/typescript\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/typescript\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/typescript\/wp-json\/wp\/v2\/users\/377"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/typescript\/wp-json\/wp\/v2\/comments?post=1824"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/typescript\/wp-json\/wp\/v2\/posts\/1824\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/typescript\/wp-json\/wp\/v2\/media\/1797"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/typescript\/wp-json\/wp\/v2\/media?parent=1824"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/typescript\/wp-json\/wp\/v2\/categories?post=1824"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/typescript\/wp-json\/wp\/v2\/tags?post=1824"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}Type System Improvements<\/h2>\n
Union Types<\/h2>\n
function<\/span> f<\/span>(x<\/span>: number<\/span> | number<\/span>[]) {\n if<\/span> (typeof<\/span> x ===<\/span> \"<\/span>number\"<\/span><\/span>) {\n return<\/span> x +<\/span> 10<\/span>;\n }\n else<\/span> {\n \/\/ return sum of numbers<\/span>\n }\n}<\/pre>\nType Aliases<\/h2>\n
type<\/span> PrimitiveArray =<\/span> Array<\/span><<\/span>string<\/span>|number<\/span>|boolean<\/span>><\/span>;\ntype<\/span> MyNumber =<\/span> number<\/span>;\ntype<\/span> NgScope =<\/span> ng.IScope;\ntype<\/span> Callback =<\/span> () =><\/span> void<\/span>;<\/pre>\nConst Enums<\/h2>\n
const <\/span>enum<\/span> Color { Blue, Green, Red };\nvar<\/span> c =<\/span> Color.Blue;<\/pre>\nAnd more…<\/h2>\n
ECMAScript 6 Support<\/h2>\n
ES6 output mode<\/h2>\n
> tsc --target ES6 myfile.js <\/code><\/pre>\nLet\/Const<\/h2>\n
function<\/span> f<\/span>() {\n let<\/span> total =<\/span> 0<\/span>;\n let<\/span> x =<\/span> 5<\/span>;\n for<\/span> (let x =<\/span> 1<\/span>; x <<\/span> 10<\/span>; x++<\/span>) {\n total +=<\/span> x;\n }\n console<\/span>.log<\/span>(x);\n}\n\nf(); \/\/ outputs 5<\/span><\/pre>\nfunction<\/span> f<\/span>() {\n var<\/span> total =<\/span> 0<\/span>;\n var<\/span> x =<\/span> 5<\/span>;\n for<\/span> (var<\/span> x =<\/span> 1<\/span>; x <<\/span> 10<\/span>; x++<\/span>) {\n total +=<\/span> x;\n }\n console<\/span>.log<\/span>(x);\n}\n\nf(); \/\/ outputs 10<\/span><\/pre>\nTemplate Strings<\/h2>\n
var<\/span> rectangle =<\/span> { height: 20<\/span>, width: 10<\/span> };\nvar<\/span> areaMessage =<\/span> `Rectangle area is <\/span>$<\/span>{rectangle.height<\/span> *<\/span> rectangle.width<\/span>}`<\/span>;<\/pre>\nLooking Ahead<\/h2>\n