typescript samples

Calling Web Services with TypeScript(and jQuery) by Peter Vogel – Visual Studio magazine, 10/02/2013 …May want to consider Angular 2’s Http instead.


 

Advertisements

DefinitelyTyped notes

TypeScript 2.0 and The Future of Declaration Files msdn (June, 2016)

Paraphrased from How to Import Intellisense files into vsCode (Visual Studio Code):

  • The tsd.d.ts file (which is created and updated after running tsd ‘installs’ at the command line) contains references to all of your .tsd files.
  • So, to access all of your project’s tsd files in any of the project’s .ts files, all you need to do is reference the following path at the top of the .ts file /// <reference path="typings/tsd.d.ts" />

typescript links

es6 notes

Exploring ES6: Upgrade to the next version of JavaScript – Book by Dr. Axel Rauschmayer


Destructuring – Dr. Axel Rauschmayer (Destructuring was introduced on TypeScript 1.5 and is discussed here.)


From the traceur wiki:

Traceur is a compiler that takes ECMAScript Edition 6 (ES6) (including classes, generators, destructuring and much more) and compiles it down to regular Javascript (ECMAScript Edition 5 [ES5]) that runs in your browser.


Per answer to my stackoverflow question (9.1.2015), Traceur is still needed by angular2 – even if one uses TypeScript to create ES5 code.


Pascal Precht on why a ES6 module loader still required with TypeScript 1.5

Whenever you transpile ES6+ code that uses ES6 modules to ES5, you have to decide for a module system that works in ES5. That can be CommonJS, AMD, SystemJS, UMD. …Even if TypeScript is going to be a superset of ES6 and implement ES6 modules, as soon as you transpile your code, you need to use a module system that the browser understands today. …Unfortunately, there’s no spec that defines how modules are loaded anymore. So yes, you’d still need to use something like SystemJS to load modules in ES5.”


let, const, and var

From JavaScript ES6 Variable Declarations with let and const – 3.17.2015

…I want to identify what some folks are considering the new standard for declaring variables in ES6. The basic idea here is that let should, in time, replace var as the default declaration keyword. In fact, according to some, var should simply not be used at all in new code. The const keyword should be used for any variable where the reference should never be changed, and let for anything else. …const follows the same new scoping rules as let!

  • var creates a variable scoped within its nearest parent function.
  • let scopes the variable to the nearest block, this includes for loops, if statements, and others.
  • const  represents a constant reference to a value (the same is true in most languages, in fact). In other words, the pointer that the variable name is using cannot change in memory, but the thing the variable points to might change.

ES6 Module Loader Polyfill README


The book Exploring es6 has a chapter on modules


Microsoft TypeScript wiki – Modules


so… should we use var, let, and const?

One can see immediately that var and let may be theoretically unnecessary, but in practice make the functions we write simpler, and therefore easier to read and write.

Whereas, const does not make functions simpler than let, but does provide a kind of annotation that saves us some effort when examining a function. It is not nearly as useful as immutable data, because the problem it solves is easy, not hard.

tsconfig.json notes

New module output as of TypeScript 1.5 (7.20.2015) – TypeScript has supported multiple module loaders since the early days. Because JavaScript is used in both the browser and on the server, TypeScript has supported compiling modules for either AMD or CommonJS.

We’re adding two new module output formats to help continue support more JavaScript practices: SystemJS and UMD. SystemJS will allow you to use ES6 modules closer to their native semantics without requiring an ES6-compatible browser engine. UMD gives you a way to output a single module that works in both AMD and CommonJS.


Microsoft has a tsconfig.json wiki From the wiki:

  • The presence of a tsconfig.json file in a directory indicates that the directory is the root of a TypeScript project.
  • If no “files” property is present in the tsconfig.json file, the compiler defaults to including all fiels in the containing directory and sub-directories. When a “files” property is specified, only those files are included.
  • The tsconfig.json file specifies the root files and the compiler options required to compile the project. Note that if/when input files are specified on the command line, tsconfig.json files are ignored.

emitDecoratorMetadata – Setting this flag to true in tsconfig.json or on the command line) “is necessary so the javascript output creates the metadata for the decorators” according to comment in http://stackoverflow.com/questions/30311514/injectables-in-angular2


After adding

    "experimentalDecorators": true,

to my 5 Minute QuickStart app’s tsconfig.json file and seeing it work correctly, I closed the folder. The next day I reopened it in VS Code and the the transpiler ignored the experimentalDecorators key/value pair – the MyAppComponent class had a red squiggly under it.

I removed and then re-added “experimentalDecorators”: true, back to the “compilerOptions” array of key/value pairs and the transpiler seemed to see it again as the build worked after that.


From the Microsoft wiki:

  • If no “files” property is present in a tsconfig.json, the compiler defaults to including all files in the containing directory and subdirectories.
  • When a “files” property is specified, only those files are included.