Typescript for C# Programmers — Jesse Liberty [w/ subs]



00:00:00 – mmm
00:00:18 – so good morning i am what's between you
00:00:22 – and lunch and I will keep that in mind
00:00:27 – through this entire discussion let me
00:00:29 – let me keep my watch we go to lunch at
00:00:33 – what time
00:00:34 – 230 240 240 that will stop before that
00:00:41 – you can be first online so as you know
00:00:46 – today we are talking about type script
00:00:49 – and specifically type script targeted at
00:00:53 – C sharp developers and c-sharp
00:00:58 – developers have a different perspective
00:00:59 – on type script and JavaScript developers
00:01:02 – do so I assume you're all types trip
00:01:07 – develop a c-sharp developers and not
00:01:10 – type of developers but if you already
00:01:12 – know typescript feel free to yell at me
00:01:15 – when I get it wrong okay tape script
00:01:21 – comes about because of this man this is
00:01:25 – andrew's helzberg he is a microsoft
00:01:28 – fellow when he was at Borland he created
00:01:31 – Delphi and turbo pascal and Microsoft
00:01:35 – has been responsible to c sharp and the
00:01:38 – type script see sharpen type scripts
00:01:41 – have a lot in common because of this man
00:01:45 – key features when we think about the key
00:01:50 – features of type script
00:01:53 – these are going to be very familiar to
00:01:54 – you because they are in many ways the
00:01:56 – key features of C sharp so we have
00:02:00 – static typing we have support for
00:02:02 – classes constructors and properties and
00:02:06 – especially methods it supports
00:02:09 – interfaces it supports derivation class
00:02:13 – derivation what acutely calls arrow
00:02:17 – functions which are sort of a poor man's
00:02:19 – lambda function and encapsulation other
00:02:26 – key features that are available through
00:02:28 – type script you are that is open source
00:02:31 – that it runs on any platform there is
00:02:36 – really surprisingly good tooling for it
00:02:39 – and it is supported by intelligence and
00:02:43 – syntax checking depending on which I de
00:02:46 – you use the important thing to keep in
00:02:50 – mind is that type script is javascript
00:02:53 – in fact it's a type superset of
00:02:59 – JavaScript oh good no room
00:03:02 – excellent we filled the room ok thank
00:03:05 – you for coming and goodbye
00:03:08 – if you have a space next to you please
00:03:11 – raise your hand one
00:03:13 – ok and a couple up here for us the most
00:03:19 – important aspect is that type script can
00:03:22 – be treated as a first-class language
00:03:24 – JavaScript programmers think of type
00:03:27 – script as being javascript as being a
00:03:31 – special I'm god I'm all set thank you
00:03:34 – okay I've got to thank you special
00:03:38 – typescript is a is it different
00:03:45 – JavaScript programmer it's just
00:03:46 – JavaScript with with typing but to c
00:03:49 – sharp programmer you can treat this as a
00:03:51 – first-class language for a long time
00:03:53 – without knowing any jobs how many of you
00:03:56 – know
00:03:57 – no javascript so you all know JavaScript
00:04:00 – how many of you do know JavaScript ok so
00:04:06 – you're going to come to this from and
00:04:08 – how many of you know C sharp okay good i
00:04:12 – was getting worried their type script is
00:04:16 – a natural pretty sharp programmers and
00:04:18 – of course it's a natural for JavaScript
00:04:20 – programmer so for those of you who know
00:04:22 – both this will be very easy but for
00:04:25 – those of you who only knows sharp it
00:04:28 – will also be easy because it's not a
00:04:30 – problem there are a few risks that C
00:04:32 – sharp programmers have typescript syntax
00:04:36 – is very very similar to c sharp but
00:04:39 – there are some differences that you have
00:04:41 – to watch out for thank you don't leave
00:04:44 – with those trying to steal my water so
00:04:52 – you need to watch out for a couple
00:04:53 – things like the double equal sign the
00:04:54 – triple equal we're going to talk about
00:04:56 – this classes and interfaces between type
00:04:59 – script and c-sharp are very similar
00:05:02 – they're not identical so we'll talk
00:05:04 – about some of the differences teasing
00:05:07 – here is the typescript ultimately is a
00:05:09 – scripting language in fact ultimately it
00:05:11 – is JavaScript it's javascript that looks
00:05:14 – and feels a lot like C sharp so for this
00:05:18 – presentation all you need to know is C
00:05:20 – sharp
00:05:23 – quick question as to why we want to use
00:05:26 – typescript in the first place for web
00:05:30 – development where you might otherwise
00:05:32 – use JavaScript typescript has some huge
00:05:34 – advantages and the biggest one is type
00:05:37 – safety and I won't read this to you you
00:05:41 – can see for yourself that these are the
00:05:43 – features that make types too much easier
00:05:46 – to maintain than JavaScript if you are
00:05:52 – using visual studio then it's extremely
00:05:55 – easy because it just works visual studio
00:05:58 – has type script built-in on the other
00:06:02 – hand you can one type script on any
00:06:04 – platform using any browser and we're
00:06:09 – going to look at that because i have a
00:06:11 – mac here and it doesn't yet run visual
00:06:13 – studio and finally there's the
00:06:18 – playground that is provided by types
00:06:21 – trip lang
00:06:22 – so we'll take a quick look at that this
00:06:26 – is the playground on the left is type
00:06:29 – script on the right is JavaScript if
00:06:32 – your JavaScript programmer and you're
00:06:34 – interested you can look at the
00:06:36 – right-hand side but for us to see sharp
00:06:38 – programmers we can do a lot of work just
00:06:40 – looking at the left-hand side and
00:06:42 – ignoring the JavaScript just working
00:06:45 – with the type script
00:06:47 – the second possibility is visual studio
00:06:50 – which if you look on the left-hand side
00:06:52 – unless you can see at the back under
00:06:55 – other languages it says type script
00:06:57 – today we're going to be looking at vs
00:07:00 – code visual studio code and the
00:07:03 – advantage of Visual Studio code is that
00:07:05 – it's cross-platform now i should say
00:07:06 – that they just announced visual studio
00:07:09 – for the mac so that's another option
00:07:12 – that's coming but if you're working on
00:07:15 – the Mac what you're working on linux the
00:07:17 – ID of choice is probably going to be vs
00:07:20 – code for type script so how do you get
00:07:24 – set up the first thing you're going to
00:07:26 – do is download and install vs code now
00:07:30 – this is much easier than it sounds
00:07:32 – see if we got this setup right no we
00:07:35 – don't we changed everything just before
00:07:39 – you came in because it was working too
00:07:41 – well i'm not going to show you the the
00:07:46 – the site because because i'm not so
00:07:56 – you're going to download and install
00:07:58 – visual studio code then you're going to
00:07:59 – download and install node from node from
00:08:03 – know Jas that org and again it's a very
00:08:06 – simple installation and we're barely
00:08:07 – going to use node but we'll use it a
00:08:09 – little bit
00:08:11 – next you're going to run visual studio
00:08:13 – codes of the terminal and the one thing
00:08:17 – that you do need to get is a TS config
00:08:21 – typescript configuration that JSON file
00:08:24 – and I made a short link for it for you
00:08:27 – to be able to get it so that's probably
00:08:31 – the one URL you want to remember or
00:08:34 – write down or you can just search the
00:08:36 – the through you can google it with being
00:08:40 – and find it very quickly what you're
00:08:46 – going to do once you have that is go to
00:08:48 – the directory and open a command palette
00:08:51 – the most important key combination for
00:08:55 – true vs code is command shift p
00:08:58 – once you go there commander of P you can
00:09:01 – get to anything and we're going to type
00:09:03 – in configure tasked runner and then
00:09:06 – we're going to use that TS config that
00:09:09 – we just got we can take a quick look at
00:09:12 – this
00:09:13 – let's go here this is a directly that is
00:09:20 – empty and all that is in it is TS
00:09:23 – configured json so this is the file we
00:09:27 – would have just downloaded if i go into
00:09:30 – vs code to make that nice and big
00:09:36 – I can say command shift
00:09:41 – p I know this is a little small and i
00:09:45 – can type configure and one of my choices
00:09:50 – the third one is task configure task
00:09:52 – winner now i have a list of tasks
00:09:55 – winners and one of them is TS config
00:09:58 – that JSON when i click on that I'm
00:10:00 – completely set up that's all I needed to
00:10:02 – do now if you like to take control of
00:10:06 – your IDE one of the things you can do is
00:10:09 – against a shift command P and type in
00:10:12 – user and one of your choices is open
00:10:16 – user settings on the left are the
00:10:19 – standard settings on the right are your
00:10:22 – settings so i set my font size to 32 and
00:10:27 – one thing that's very helpful is to set
00:10:29 – autosave so that your tell your work is
00:10:34 – saved automatically although you don't
00:10:36 – want that to happen every instance so i
00:10:38 – set the delay for one second
00:10:40 – so every second is going to say whatever
00:10:43 – I've done so those are some options you
00:10:46 – can do with with the getting started
00:10:49 – with vs code
00:10:51 – ok we are actually not going to work in
00:10:53 – that directory we are going to change
00:10:56 – directories if i can get this to work to
00:11:02 – code
00:11:03 – ok good let's go back to the show which
00:11:09 – is already in progress the user some of
00:11:13 – the user preferences you can set
00:11:18 – one of the important things that you
00:11:20 – want to set our your excludes because
00:11:24 – you're not going to want to see your
00:11:25 – javascript files and you're not going to
00:11:27 – want to see other things that don't
00:11:29 – relate to the work you're doing so this
00:11:31 – user preference is available on the web
00:11:34 – and it's a great thing to set up for
00:11:36 – your your visual studio code
00:11:40 – ok
00:11:44 – hello world this is the only Codding I'm
00:11:49 – going to do everything else is in slides
00:11:51 – but i'm going to do this one
00:12:00 – i'm ready i'm going to open up Visual
00:12:07 – Studio code if i can type ok and let's
00:12:12 – make that nice and big I think the font
00:12:14 – is set to be nice and big
00:12:16 – we're going to create a new file which
00:12:23 – we will call hwd TS that dot TS is very
00:12:28 – important because it tells Visual Studio
00:12:31 – code that you are working in a type
00:12:34 – script file and down in the lower right
00:12:37 – I'm sure it's too small to see it says
00:12:38 – type script so we're going to say export
00:12:42 – now the reason I'm not going to explain
00:12:44 – anything is I want you to guess what
00:12:48 – this is doing
00:12:49 – not out loud please too many people but
00:12:52 – just watch for one minute
00:12:54 – hello world thank you
00:12:58 – you thirsty and inside that we're going
00:13:03 – to say say thank you very much
00:13:06 – hello
00:13:09 – and inside that we're going to say
00:13:12 – console.log lips hello world these
00:13:15 – parentheses say hello doesn't mean
00:13:19 – console.log alo Moscow ok i'm guessing
00:13:32 – that you have an idea of what this is
00:13:35 – going to do that you have a sense of
00:13:38 – what this might be and i can say let HW
00:13:43 – equal hello world
00:13:48 – notice I'm getting intelligence and I
00:13:52 – should have said what new is right
00:13:56 – new hello world and now i'm going to say
00:14:01 – HW dot say hello and notice intelligence
00:14:05 – wants to help me which is great because
00:14:08 – otherwise I forget how to do it
00:14:10 – ok looking at this if you're a c-sharp
00:14:16 – programmer you can guess what this does
00:14:18 – much of the syntax is the same and
00:14:22 – that's why I show this to you is that
00:14:24 – when you look at a typescript program
00:14:27 – you can often not always guess every
00:14:31 – aspect of it and i'm going to show you
00:14:32 – the parts that you might not guess first
00:14:35 – of all to build this what's actually
00:14:39 – happening is I'm transpiring it that is
00:14:42 – compiling it into a different language
00:14:45 – I'm transpiring it into JavaScript and
00:14:48 – watch how long it takes a shift command
00:14:50 – and i'm going to press the B you ready
00:14:52 – did you see it that's how fast it is
00:14:55 – now I can go over to my terminal and i
00:15:00 – can say node and what we call it hello
00:15:04 – world
00:15:07 – what I call it I call that hwa HW hello
00:15:15 – Moscow yay what this what this did was
00:15:22 – it took my type script and it turned it
00:15:26 – into JavaScript and gave it to note and
00:15:29 – if i take a directory
00:15:30 – well as a lot in here but if i take a
00:15:32 – directory of HW star notice that i have
00:15:37 – HW DTS but i also have HW tjs and that's
00:15:43 – the JavaScript that got transpile ok I'm
00:15:47 – going too slow i can tell ppl yawning
00:15:50 – and falling asleep
00:15:51 – this is exciting stuff classes and
00:15:57 – properties and methods typescript things
00:16:02 – about modules modules are very much like
00:16:04 – namespaces namespaces or modules contain
00:16:09 – classes classes contain big surprise
00:16:14 – constructors properties fields and
00:16:17 – methods just as you would expect and
00:16:20 – classes can implement interfaces let's
00:16:27 – talk about the types and type script
00:16:29 – many of them are going to be obvious to
00:16:32 – boolean with a capital B is just like a
00:16:36 – bull takes true or false numbers a
00:16:39 – little interesting you don't declare an
00:16:41 – integer or a long or decimal or a double
00:16:43 – you just declare a number and then type
00:16:46 – trip takes care of it for you
00:16:49 – string is exactly the same enews are
00:16:52 – exactly the same a razor used more in
00:16:56 – typescript than they are in c-sharp
00:16:58 – although generics are now introduced
00:17:02 – into type scripts of that may change
00:17:03 – avoid does what you would expect
00:17:11 – here's a new one any-any says this
00:17:15 – variable can have any type
00:17:18 – what's the point of type script to have
00:17:21 – strong typing any says the heck with
00:17:24 – strong typing it totally undermine
00:17:27 – strong typing if you use any i will
00:17:31 – personally come to your office and slap
00:17:33 – you silly
00:17:34 – I'm defined is very much like no and
00:17:41 – you'll see we use undefined now far the
00:17:45 – VAR keyword is scoped to the function
00:17:49 – and if there's no function its scope low
00:17:52 – globally which is the worst idea after
00:17:56 – any so we use let let like any good
00:18:01 – variable is scope to the block constants
00:18:05 – are also spoke to the block
00:18:07 – you'll see that i use let everywhere
00:18:11 – except when I forget news far but i
00:18:14 – should be using let okay if I say let
00:18:19 – age there's nothing for the compiler to
00:18:23 – infer the type so that's a type any slap
00:18:28 – slap slap
00:18:29 – if however I say let h equal 21 now the
00:18:33 – compiler can infer that the type is
00:18:36 – number i can explicitly declare that the
00:18:39 – type is number with this strange syntax
00:18:43 – each the variable followed by a colon
00:18:46 – followed by the type so this is the
00:18:49 – exact same thing as saying int age but
00:18:55 – what I'm saying is let age that is
00:18:57 – create a variable age whose type is
00:18:59 – number
00:19:01 – i can combine those as you would expect
00:19:04 – all right
00:19:06 – the arithmetic operators i'm going to
00:19:08 – move along i want you to miss lunch and
00:19:11 – 240 so we said 1440 i can go slower
00:19:17 – yeah the arithmetic operators are the
00:19:19 – same except the equal sign one equal
00:19:24 – sign is assignment just as it is in
00:19:26 – c-sharp two equal signs means the values
00:19:30 – are equal but not necessarily the types
00:19:33 – three equal signs says the values and
00:19:37 – the types of equal so here's an example
00:19:38 – makes it very clear if we say let a
00:19:41 – equals 10
00:19:43 – that's assignment now we say equals 10
00:19:47 – on the left-hand side
00:19:49 – ok no surprise they equal equal 10
00:19:51 – that's just like C sharp but look at the
00:19:54 – right-hand side
00:19:56 – ke equal equal the string 10 that's true
00:19:59 – when you use two equal signs because the
00:20:01 – values are equal even though the types
00:20:03 – are not if you want to avoid this
00:20:06 – insanity then you use three equal signs
00:20:09 – now a equal equal equal 10 that's true
00:20:14 – but if you use the string it's false
00:20:16 – because with three equal signs you need
00:20:19 – to have the same value and the same type
00:20:22 – ok flow control if and if-else are the
00:20:29 – same as in c-sharp as is the ternary
00:20:31 – operator switch switch is the same thing
00:20:35 – as C sharp six N*** sharp 7 C sharp 7
00:20:40 – introduces new functionality for switch
00:20:42 – that is not in the script if you leave
00:20:47 – you lose your spot
00:20:48 – just so you know you never did if you do
00:20:53 – a presentation you'd never comment on
00:20:54 – people who leave never i do I make fun
00:20:58 – of them
00:20:59 – while and while do work the same way and
00:21:04 – for works but for each does not what we
00:21:07 – have instead is for in so if I created
00:21:10 – dictionary and what the syntax says is
00:21:14 – I'm creating a variable my dictionary
00:21:16 – and I'm initializing it with a has the
00:21:19 – value value 1 and so forth
00:21:22 – now i want to iterate over my dictionary
00:21:25 – instead of saying for each key in
00:21:28 – diction blah blah
00:21:30 – instead I say for and now i make my
00:21:34 – variable key in my dictionary that's for
00:21:39 – in and now you see says console.log
00:21:42 – instead of saying console.writeline we
00:21:44 – use console.log so I know that's a huge
00:21:47 – difference
00:21:48 – so you know steak on equals my
00:21:52 – dictionary of key and the results are
00:21:56 – just what you would expect functions
00:22:02 – I got to say something just an aside i
00:22:04 – love my Apple watch but it turns off if
00:22:09 – you don't push the button so I'm trying
00:22:12 – to keep track of the time and it keeps
00:22:13 – going black
00:22:14 – so we may be here a few hours functions
00:22:18 – optional and default parameters these
00:22:21 – work pretty much as you might expect
00:22:23 – optional parameters use a question mark
00:22:25 – and they must come after all of the
00:22:29 – required parameters so let's take a look
00:22:33 – at that very quickly we will go to here
00:22:38 – and we will open up optional parameters
00:22:43 – ok what we have here is a function whose
00:22:47 – name is add the first parameter number
00:22:51 – one is of type number the second
00:22:54 – parameters of type number the third
00:22:56 – parameter if you look closely says
00:22:58 – number three ? that's an optional
00:23:01 – parameter now online six I say let total
00:23:06 – creates a variable equal number one in
00:23:08 – them to nothing special but I number
00:23:11 – three I don't know if it's there
00:23:13 – so I say if it's not undefined then add
00:23:16 – it
00:23:17 – it's not exactly the same as sharp and
00:23:20 – easy enough to figure out and then i can
00:23:23 – come down and try it with three numbers
00:23:25 – i can come down and fight with two
00:23:26 – numbers that's optional parameters
00:23:29 – let's look at default parameters quickly
00:23:32 – okay this is a little cleaner it's very
00:23:40 – dry up here I don't know what it's like
00:23:42 – down there if i say add number one is a
00:23:47 – number 92 is a number number three is a
00:23:49 – number but I can initialize it to value
00:23:51 – zero and now i can just let total equal
00:23:54 – to the sum because the zero won't affect
00:23:57 – anything so this is familiar from C
00:24:00 – sharp okay we're going to get to
00:24:04 – interesting differences i promise you
00:24:05 – right now as a matter of fact rest
00:24:09 – parameters are just like programs but
00:24:11 – the syntax is quite different you
00:24:14 – proceed your rest parameters with three
00:24:17 – dots and you follow them with brackets
00:24:20 – because as you know params are actually
00:24:22 – an array so rest parameters are an array
00:24:25 – so let's look at that if i go to rest
00:24:29 – programs
00:24:31 – okay here my first two parameters are
00:24:34 – normal number one in them too but my
00:24:37 – third parameter is I don't know how many
00:24:40 – things are going to be in there i don't
00:24:42 – know how many values so I say dot don't
00:24:45 – answer white then I say number which is
00:24:49 – I'm sorry yes numbers which is the name
00:24:52 – of the parameter of type number square
00:24:56 – bracket square bracket which essentially
00:24:58 – says numbers is an array of number now I
00:25:03 – can iterate through my numbers and pull
00:25:09 – out each value one after another and
00:25:12 – it's an array so i can check its length
00:25:14 – so the for loop works so this is very
00:25:17 – much like programs except the signatures
00:25:19 – a little bit different and you're going
00:25:22 – to see this through most of what i have
00:25:23 – to present
00:25:24 – this boy that's familiar a little
00:25:26 – different except function overloading
00:25:29 – function overloading is so ugly that
00:25:33 – when i'm home i make it sit in the
00:25:35 – corner because it's just it's hideous
00:25:38 – here's how it works if two functions
00:25:42 – have the same name but a different
00:25:43 – number of parameters or a different type
00:25:45 – of parameter then you create what's
00:25:48 – called an implementation signature i
00:25:51 – will show you the demo please don't
00:25:53 – throw tomatoes you can throw other
00:25:57 – things money is good rubles I'll take
00:26:02 – rubles here we are
00:26:06 – when I say what am i doing I'm doing a
00:26:09 – overloading here we go
00:26:12 – ok my first functions name is person and
00:26:16 – its parameter is a string and the whole
00:26:19 – function returns a string so you're
00:26:21 – comfortable that first line that it says
00:26:24 – name is a string that's my parameter and
00:26:27 – then the function is a string that is it
00:26:29 – returns a string my second function
00:26:32 – takes a number my third function takes a
00:26:36 – pool
00:26:37 – here it's called boolean however here
00:26:42 – comes the goofy i have to declare a
00:26:45 – function also called person i have to
00:26:49 – pass in some kind of parameter here i'm
00:26:51 – calling it value and tell it what it's
00:26:53 – possible types are so for this one it
00:26:56 – could be a string it could be a number
00:26:58 – could be a boolean and then I switch on
00:27:01 – the type of that value and so i can get
00:27:05 – values out of each of the overloaded
00:27:08 – functions by switching on the type of
00:27:11 – the value that was declared here so i
00:27:15 – say switch on string switch on numbers
00:27:17 – which on boolean and then down here i'm
00:27:21 – just going to run it by saying console
00:27:23 – you know passing the name a string
00:27:25 – excuse me pass in a number pass in a
00:27:28 – boolean and it's going to know which is
00:27:31 – which because of this switch on the type
00:27:33 – not elegant but it works okay thats
00:27:41 – function overloading arrow functions
00:27:44 – not a great name arrow functions they
00:27:47 – are essentially lambda functions they
00:27:50 – are used a short forms of functions
00:27:54 – let's take a quick look at that i called
00:28:00 – that lambda even though it's a narrow
00:28:01 – function
00:28:02 – ok on top on line one
00:28:05 – i have a function called multiply it and
00:28:08 – I pass into numbers and he returns a
00:28:11 – number so we say its type his number and
00:28:15 – all i'm doing is multiplying the two
00:28:16 – with an arrow function I can make this
00:28:19 – simpler I say multiply it in this case
00:28:23 – on column multiplier lambda i pass in my
00:28:26 – two values and then the arrow and now i
00:28:29 – don't need the keyword return i just
00:28:32 – have the statement of what i want to
00:28:34 – return the other thing that you might
00:28:37 – use arrow function for his to declare
00:28:39 – function that you're going to implement
00:28:43 – later
00:28:44 – and this is useful under very special
00:28:47 – circumstances where you want to declare
00:28:49 – a function and then you're going to
00:28:51 – dynamically create that function but
00:28:53 – mostly it's used as a shorthand for
00:28:56 – functions please
00:29:05 – yes exactly
00:29:08 – I'm supposed to repeat your question
00:29:13 – everybody heard the question
00:29:15 – ok object oriented type skip this is the
00:29:21 – place where JavaScript programmers fall
00:29:24 – off the edge of the earth c-sharp
00:29:26 – programmers have no problem because
00:29:28 – we're used to object-oriented
00:29:30 – programming we used two classes so
00:29:32 – there's no surprises here first of all
00:29:37 – we have object literals so here I've
00:29:41 – declared of a variable rectangle I don't
00:29:43 – know why it doesn't say let equals the
00:29:46 – height is 20 the width is 10 and then
00:29:48 – even inside an object literal I can have
00:29:51 – a method i can declare explicitly that
00:29:56 – this is an object literal but i don't
00:29:59 – have to but now comes the fun part
00:30:02 – classes first of all my favorite
00:30:04 – features that class is a public by
00:30:06 – default who decided in c-sharp that they
00:30:08 – should be private by default
00:30:10 – how often do you want to put 0 camera
00:30:13 – how I how happened
00:30:18 – do you want your class to be private so
00:30:20 – they're public by default in type of
00:30:22 – which is great
00:30:23 – he's making me so nervous I could cry
00:30:28 – one thing that you should know about
00:30:30 – classes in typescript is that when you
00:30:33 – refer to a field or a property you must
00:30:36 – use this keyword even if there's no
00:30:40 – ambiguity this keyword is required in
00:30:43 – classes and this is the coolest feature
00:30:48 – of type this is what makes type for me
00:30:51 – construct your parameters can
00:30:54 – automatically we turn into properties or
00:30:57 – fields and i will show you this Intex
00:30:59 – for doing this because it is very cool
00:31:01 – let's take a look at a demo because
00:31:04 – you'll just love this
00:31:06 – ok here's the traditional way to do it
00:31:12 – and it works this works fine in type
00:31:14 – script you declare a class person one to
00:31:19 – declare some properties and fields
00:31:22 – public public popular 15 minutes talking
00:31:25 – really fast
00:31:26 – everybody understand if I talk really
00:31:27 – fast ok so I've declared these three
00:31:32 – variables properties and fields and then
00:31:36 – in my constructor i pass in parameters
00:31:39 – that I then assign so this is the way we
00:31:42 – always did in c-sharp except you have to
00:31:44 – use this keyword so even though last
00:31:47 – name and last name that there you would
00:31:50 – have used the this keyword but look over
00:31:53 – here where I have last name and FN no
00:31:55 – ambiguity but i still need that this
00:31:57 – keyword but that's not the cool part
00:32:00 – the cool part is try to keep this in
00:32:02 – mind I can instead declare the class
00:32:06 – like this the keyword constructor is
00:32:10 – used instead of the name of the class
00:32:12 – but if i put public or private in front
00:32:17 – of the parameters then these parameters
00:32:20 – are passed in but they also become
00:32:23 – properties and fields so notice i am
00:32:26 – declaring properties of fields they're
00:32:28 – declared in the constructor and then I
00:32:31 – can refer to them this stuff first name
00:32:34 – where the heck did first name come from
00:32:36 – well it came from passing it in as a
00:32:38 – parameter so if i have the keyword
00:32:40 – public suddenly first name is not only
00:32:43 – parameter it's also a property now I
00:32:46 – will tell you that developers come in
00:32:48 – two flavors one flavor says wow this is
00:32:52 – the coolest thing I've ever seen the
00:32:54 – other flavor says wow this sucks because
00:32:58 – I don't know what you've got and I can't
00:32:59 – find anything because they're hidden
00:33:01 – inside the constructor i'm in camp one
00:33:06 – you're welcome to be in either camp but
00:33:08 – if you want to be my friend you'll be in
00:33:09 – camp to ok i bet 15 minutes is going
00:33:15 – inheritance works just like in c-sharp
00:33:19 – except instead of using the colon you
00:33:23 – use the keyword extends that's the only
00:33:26 – difference
00:33:27 – oh one other difference the base class
00:33:29 – is called super now this is worth a
00:33:33 – quick look
00:33:35 – because is one difference here that's
00:33:37 – really worth understanding so we're
00:33:39 – going to go to where my going
00:33:42 – inheritance
00:33:45 – I made that really tiny so you couldn't
00:33:46 – see it as a joke everybody laughs good
00:33:54 – there's a story about a man a comedian
00:33:57 – who went to I think it's Japan and they
00:34:01 – said to him don't make any jokes and he
00:34:03 – said it'll be alright and he went out
00:34:05 – any made jokes and everybody left later
00:34:09 – he found out that the translator said he
00:34:10 – just made a joke please left here i have
00:34:17 – the class person notice that I'm using
00:34:20 – the the syntax where these become fields
00:34:23 – and properties
00:34:26 – here I'm extending person i'm also
00:34:31 – adding a new field grade which has the
00:34:36 – keyword private none of these now have
00:34:39 – public or private because they would
00:34:41 – declare it as fields in the base class
00:34:43 – and so you don't want to declare them as
00:34:46 – fields of properties here because that
00:34:48 – would hide the ones in the base class
00:34:49 – but what you do want to do is call up in
00:34:54 – the constructor to the base class which
00:34:56 – we use super for and pass in those four
00:34:59 – parameters and then it will make them
00:35:02 – make them into properties and feels it
00:35:04 – pretty clear on that because it's a
00:35:05 – little confusing
00:35:07 – okay you're way ahead of me good mr. 15
00:35:12 – minutes how much I have left
00:35:13 – 1010 good because i only have about two
00:35:17 – minutes worth of material left
00:35:18 – interfaces interfaces are the same
00:35:21 – except they use the keyword implements
00:35:23 – instead of the colon and they work just
00:35:27 – the same so i'm not going to bother with
00:35:28 – them
00:35:30 – okay that is a basic introduction to
00:35:34 – type trip which you notice there was
00:35:37 – very little surprising you had to get
00:35:41 – used to the way you declare a variable
00:35:42 – because it's now that the name followed
00:35:45 – by the colon followed by the type you
00:35:48 – have to get used to the fact that when
00:35:49 – you pass in parameters to a constructor
00:35:52 – festival that you use the keyword
00:35:53 – constructor but more importantly that
00:35:55 – they can become properties in fields so
00:35:57 – where do you go from here there's some
00:35:59 – advanced topics that there's no chance
00:36:01 – of my covering because of how much time
00:36:03 – we have but you should know what they
00:36:04 – are you want to spend a little more time
00:36:07 – understanding modules mostly they act as
00:36:09 – namespaces but they're a JavaScript
00:36:11 – construct worth understanding
00:36:14 – secondly asynchronous programming we
00:36:16 – didn't even touch on asynchronous
00:36:18 – programming it is surprisingly similar
00:36:19 – to c sharp scaling and performance
00:36:24 – once you have an enterprise-level
00:36:27 – application then there's no free ride
00:36:30 – then you do have to learn JavaScript and
00:36:33 – understand
00:36:34 – what the typescript is putting out so
00:36:37 – that you can create efficiency in the in
00:36:40 – the type script now that's when we get
00:36:43 – back to that playground where you have
00:36:44 – typed on one side and JavaScript on the
00:36:46 – other because they that's a good way to
00:36:49 – learn your javascript and B that's a
00:36:51 – really good way to see am i getting
00:36:53 – efficient javascript out of my type of
00:36:55 – which generally you are but when you
00:36:57 – have a large performing dependent
00:37:00 – enterprise application then you're going
00:37:04 – to want to know more about JavaScript or
00:37:05 – you can do what I do which is you can
00:37:07 – say yo Joe come over here because Joe's
00:37:10 – an expert and then I don't have to learn
00:37:12 – it
00:37:12 – testing we haven't talked about testing
00:37:17 – but it is exactly the same unit test you
00:37:19 – will do unit tests right every day all
00:37:22 – the time right right you test
00:37:23 – yeah you lie to me ok and testing is
00:37:27 – very much the same
00:37:29 – there are a number of applications that
00:37:33 – can make your life easier that make it
00:37:35 – easier to compile have continuous
00:37:37 – integration so on
00:37:39 – it's worth checking out dope and grunt
00:37:41 – there's a bunch of others but I like
00:37:43 – these names kopen grunt I think they're
00:37:45 – funny
00:37:47 – there are a number of resources first of
00:37:50 – all there are online courses he says as
00:37:52 – a plural side author secondly there are
00:37:55 – books and articles all over the place
00:37:57 – about this there's stackoverflow
00:37:59 – everybody's favorite source unless
00:38:03 – you're using google which is you know
00:38:04 – programming by google has become a big
00:38:06 – feature there are blogs including mine
00:38:11 – and his twitter i'm at my twitter handle
00:38:16 – is accessing Liberty my blog is jesse
00:38:20 – Liberty calm so it's easy to remember
00:38:23 – unless you forget my name in which case
00:38:25 – it's not easy to remember questions no
00:38:30 – questions any questions there's a
00:38:32 – question yes sir in the back
00:38:34 – John wait for the minus i give you Mike
00:38:39 – I don't know sorry
00:38:42 – thank you for your session thank you the
00:38:45 – question regarding visual studio called
00:38:48 – um die so that you are using the web
00:38:52 – better phone not mine okay because i was
00:38:58 – ready to put my hands up probably will
00:39:01 – should trick question regarding
00:39:04 – extensions maybe you can name some most
00:39:08 – useful for the type script yes and the
00:39:12 – second one any weaknesses of typescript
00:39:15 – we should know starting changing our
00:39:21 – JavaScript into type script
00:39:23 – yes ok the first question was about
00:39:26 – either good extensions Visual Studio
00:39:30 – code has phenomenal extensions in there
00:39:33 – being added to all the time there is a
00:39:36 – c-sharp seven extension now the top type
00:39:41 – script if you're using Visual Studio
00:39:42 – code it will keep you up-to-date on type
00:39:44 – script in fact it's it's you know no
00:39:47 – j*** it's like it'll make you crazy
00:39:50 – because it to every couple days are
00:39:51 – coming says there's an update there's an
00:39:53 – update there's an update but it's very
00:39:54 – quick the updates so so that's the only
00:39:58 – extension that i use i allow it to you
00:40:01 – know once you put in TS configured know
00:40:03 – you're using typescript in it little
00:40:05 – updates automatically your second
00:40:08 – question was out downsides of type
00:40:11 – script i think that you know from the
00:40:13 – people i talked to who are using
00:40:15 – typescript in the enterprise that's
00:40:17 – where the downside comes in terms of
00:40:19 – profiling and efficiency it is there
00:40:25 – should be in theory no overhead four
00:40:28 – types trip because everything you do in
00:40:29 – types of it compiles down to JavaScript
00:40:32 – but the JavaScript that compiles down to
00:40:34 – may not be perfect may not be the most
00:40:36 – part you know efficient javascript so
00:40:39 – that's probably the biggest downside is
00:40:41 – that when you get to a large application
00:40:43 – there was another question around
00:40:46 – yes sir thank you for your presentation
00:40:51 – thank you i got a question about sin
00:40:55 – taxes as you can see the constructor of
00:40:58 – the person and separate from the other
00:41:02 – functions and is there a way to a lot of
00:41:08 – the Constructors because they are
00:41:10 – rewarding is pretty ugly and a very
00:41:14 – Utley and so yes so we but sometimes we
00:41:18 – have to get several instructors yet
00:41:21 – either way to let some best practices to
00:41:26 – implement overloading of the Catholic
00:41:30 – great question i don't have a great
00:41:32 – answer but I'm sorry but if you are if
00:41:36 – you sent me an email
00:41:38 – Jesse Liberty @ gmail.com then i will
00:41:41 – get that interview because as soon as
00:41:43 – you say it's like of course that's very
00:41:45 – important i don't know you'd be
00:41:47 – surprised how much I don't know
00:41:49 – thank you any other questions there be
00:41:53 – no other questions any questions I don't
00:41:57 – see enhance just a minute please way he
00:42:01 – wants you to bring on the mic don't have
00:42:06 – anything I don't think you I just a bit
00:42:08 – is it possible to use that script and
00:42:11 – the production code for the real system
00:42:14 – absolutely it's just a justice toy no
00:42:17 – absolutely can be used in a real system
00:42:20 – is being used in real systems angular
00:42:22 – was written entirely in type angular 2
00:42:26 – is written entirely in type script thank
00:42:28 – you so much thank you
00:42:30 – over here we have another question
00:42:33 – thank you for your presentation and the
00:42:36 – question is about the public-private but
00:42:39 – does type escape has a protected
00:42:42 – no oh it has has something that was
00:42:47 – limited to the module but i can't think
00:42:49 – offhand what it's called but I
00:42:51 – understand what you're saying about her
00:42:53 – derived class
00:42:54 – yes yeah it again I gotta do something I
00:42:56 – think the answer is no let me do a
00:42:58 – little research but i think the answer's
00:43:00 – no okay I'm and so how could be the
00:43:04 – classes so the private has a proud
00:43:09 – before
00:43:10 – yes you could know it doesn't by default
00:43:12 – the public by default but you can make a
00:43:14 – private yeah thank you well thank you
00:43:21 – all very much I appreciate it and I'll
00:43:24 – be outside to talk


Video Url:
http://youtu.be/bdvEcvWwHgI

Comments

comments