I wanted to write up a summary of this presentation that I've had the chance to present at two recent events: SharePoint Saturday Perth (09/03/2013) and Sydney SharePoint User Group (13/03/2013).
This is a blog post aiming to cover both the feedback I've received, as well as additional notes to the presentation that I may not have covered due to time constraints.
A new and improved version of this entire presentation will be shown at the Australian SharePoint Conference in Sydney, come to my session then!
- To cover why, oh why we need another scripting language. (~15mins).
- What is TypeScript
- TypeScript is free, open source and supported by Microsoft
- It is based on ECMA4 standards with ECMA6 proposals.
- Created by the father of C# - Anders Hejlsberg
- Untyped variables
- Object-extension based, not class-based inheritance.
- Key: although object inheritance is possible, it is too messy, so we learn to live without it.
- This means we are back in an age where we don't define contracts for our code, we don't describe the shape or capabilities of our object upfront, we expect it to all just work at runtime.
- Parameters - not taken seriously
- Key: they are sort of like guidelines.
- Caller can still do whatever they want. Callee has to be defensive and check everything.
- Multiple Files
- Last problem for today.
Let's look at TypeScript
- To ease audience into TypeScript (switch from thinking mode to demo mode ~1min break/reset)
- How do you install it?
- Grab it from http://typescriptlang.org this includes extensions for VS.NET 2012.
- You can do it with VS.NET 2010, but there are manual bits involved. Installer doesn't help you.
- First glance
- To show simple TypeScript language features (~15min)
- Function type checking
- Generated code
- Function optional parameters
- Defines the shape of an object. TypeScript works with Shapes.
- Definition files
- jQuery - jQuery methods are smarter with TypeScript.
- Wrong Url parameter
- Interfaces are open - so you can extend it
- Class-based inheritance
- Generated code.
- Export keyword
New Project - Pinteresp webpart Demo
- To show a Complex example of TypeScript and debugging. (~10min)
- Module with:
- 2 interfaces, 3 helper functions, 2 classes and a jQuery ready event handler.
- Create a PictureLibrary object. Call Load()
- This populates an Items() array with PictureItem objects.
- Call Render() to display to screen.
- Show how to write the Load method.
- Show SourceMap debugging.
Using TypeScript on your existing projects
- Discuss strategies to get TypeScript onto an existing project (~10 min)
- Get it to work first
- Copy everything from JS to TS
The errors that you will see are all related to the fact that TypeScript doesn't know what the objects you are referring to are.
- Fixing the initial errors
- Add References
- Improve your Definition files
- Specify optional parameters
- Some specific issues - the main support forum is http://stackoverflow.com/questions/tagged/typescript, and they are very responsive. I blog issues I come across along the way.
- Here are some things you've ALWAYS wanted to do to that nasty script file but were too afraid to break things.
- Move common functions into a shared Utilities module
- Write detailed jsdoc comments for the functions you use, and you expect your team to use
- Use rename to fix up the variable names - John's i, j, k, i1, i2 nastiness.
- Add more type information to your variable declarations to increase the strictness of your code
History of TypeScript
- Release 0.8 to public in 11/2012
- 0.8.1 added Source Map debugging
- 0.8.2 added jsdoc
- 0.8.3 added more debugging options
- The ideal conclusion I want to get to at this point, is that it should be pretty obvious TypeScript is good for your team and your code.
The Short Summary
Questions and Comments
- CoffeeScript / Dart comparison
- CoffeeScript is more mature, has more features.
- TypeScript has strong VS.NET integration.