Starting to learn Typescript, care to join me?
Wednesday, August 24, 2016 9:16 PM
I’m starting to learn Typescript. You interested in learning too? Come learn with me!
I’m learning Typescript now and one thing I’ve learned is blogging about specific things, helps me learn. So if you’re interested in learning Typescript, or just want to see what cool things TS can do, check back regularly with my blog.
Some initial brain farts I’ve learned lately.
- current version of TypeScript at this time is 1.8
- having Typescript 1.6 and 1.8 on your dev box is NOT conducive to maintaining your sanity
- ie. it’ll drive you ABSOLUTELY BANANAS chasing ghosts of errors, simply put, if you’re just staring out with TS and getting errors, check Control Panel for both TS vers and remove the older one
- Start here for downloading TS
- you are probably going to be downloading a few tools, don’t be overwhelmed
- well, ok you might be but that’s ok, just go with the flow and do your best
- that means data access is done differently as well, you’re not on the same computer as the database, you’re on the client
- you might….most likely have to learn html5\css and or some other engine like React or Angular
- not to mention other new “packaging” tools like gulp
- gulp seems to be the web’s version of Javas\JSPs Ant tools
- Ant would use XML for directive definitions while gulp using json
- what I mean by that is, doing console.log(“Test this value =” + myVariableNameImInterestedIn); seems to be the norm again
- (script src="HelloWorld.js")(/script)
- speical note: yes, the round brackets are NOT valid html script tags, but that’s a problem with THIS DNN blog engine, if I put in the right angle brackets, I screw up the rest of the blog contents, so just mentally replace in your mind the round brackets with angle brackets, thank you, much appreciated
- casing matters
- This one you’ll have to come back for, I’m still learning about this one, it’s not always C#’s mixed case for public methods, sometimes they are pascal case
- So far, the rule I have is, if you’re going to NEW something up, it’s CamelCasing, if not then you use pascalCasing
- SOMETIMES you have to F6 (ie compile) to get the JS to generate, but sometimes you don’t
- hhhhmmmm THAT sounds like a cludge to me, does it sound like a HACK to you? YUP!
- Stay tuned, I’ll try to identify when you HAVE to and when you don’t have to compile\F6 before F5 (running) your site\pages
- that seems to be the norm and to be honest, taking me a bit of time to get used to
- things like date manipulation, string manipulation, logging or json and oauth file processing requiring 3rd party libraries cause there’s very little native language support is a bit ODD IMHO
- TS export keyword seems to be very analogous to C#’s public keyword
- TS relies very heavily in type inference, you have to get used to that
- I’m still getting used to it, takes a bit to let go of thre strongly typed language features
- Hey, I remember all those early VB weak references causing problems!
- you can have a comment help you with intellisense (odd concept coming from C#)
- ///<reference path =”jquery.ds.ts”/>
- seems VERY much like we’re BACK to the C header file days with having type definition files
- there are TWO types of missing values, a null and an undefined
- there is a ! and a !!
- there’s a TRIPLE equals operator, YUP, one of these === (includes type validation in the equals operation)
- TS very much feels, to me at least, like the young-bloods of coding who didn’t like being handcuffed with compilers\strongly typed languages got to have a language of their own
- you CAN have a semblance of strong typing, but you COULD just omit those types and just “wing it”
- threading done outside of the language
- JQuery or ajax calls
- I’m seeing rumors of async coming in TS 2.1 but it’s not part of the language yet
- casting is done with angle brackets
- (angleBracket)number(angleBrackets) Settings.DBTimeout;
- more examples later, but it’s using them requires angle brackets, less than and greater than (my blog engine doesn’t like me putting them in here)
- console.log goes to the browsers F12 = Developer Tools Console window and NOT Visual Studio’s Output window
- just another nuance any new TS dev is going to have to get used to IMHO
- iify = Immediately-Invoked Function Expressions created in JS
- you can actually see the generated js files in VS if you hit the Show All Files button in the Solution Explorer menu bar
- you’ll see two files in fact an exact same name js file, and an exact same name js.map file
- this is to help with debugging an mapping JS to TS
And that’s where I’ll leave you today. I’m not quite sure where the journey will me, you, us tomorrow, but I’m sure it will be interesting. I hope you check back then. Take care, and until next time, it’s time to grab a coffee and get coding!
TypeScript: Get TypeScript
Microsoft: Visual Studio Code (Microsoft’s free editor, very similar to Visual Studio)