Hi Pioneras!
¡¡¡HALLOWEEN IS COMING!!!
Want to know about me?
@melinamejia95
- Computer science student
-
Solutions analyst
Text
Hobbies
Dreams
https://www.nytimes.com/2017/09/23/technology/silicon-valley-men-backlash-gender-scandals.html
TypeScript
A Brief Story of TypeScript
Anders Hejlsberg
Lead architect of C# and core developer on TypeScript.
- 2010 – Anders and his team begin development
- 2012 – First public version released (TypeScript 0.8)
- 2013 – TypeScript 0.9 released, adding support for generics
- 2014 – TypeScript 1.0 released, including support baked into Visual Studio
- 2017 – TypeScript 2.1 released
What's new?
https://github.com/Microsoft/TypeScript/wiki/What's-new-in-TypeScript
¿What is TypeScript?
TypeScript is an extension (a “superset”) of the JavaScript language, made by Microsoft.
Superset: A group of commands or functions that exceed the capabilities of the original specification.
It differentiates itself from competitors like CoffeeScript and Dart in that plain JavaScript code can be intermixed with TypeScript.
But TypeScript has to be compiled into JavaScript before it can run in any JavaScript engine (with a web browser or in node.js).
Say what?!
This means you cannot embed TypeScript into a web page directly using <script> tags, but TypeScript (in .ts files) can get compiled into JavaScript (in .js files) for usage.
TypeScript and ECMAScript
TypeScript is aligned with the ECMAScript6 specification.
+
+
=
ES5
ES6
Aditional features
TS
Features of TypeScript
TypeScript starts with JavaScript and ends with JavaScript.
TypeScript supports other JS libraries.
TypeScript is portable.
Why use TypeScript?
-
Compilation
-
Strong Static Typing
-
TypeScript supports Object Oriented Programming
-
Community tools
Components
Language
The TS Compiler
The TS Language Service
Installing TypeScript
npm install -g typescript
For NPM users:
$ yarn add typescript
For Yarn users:
¿¡Where is the code!?
Types
Dynamic Types
let greeting = 'Hello Pioneras'
typeof greeting //String
let anything = 'Hi'
typeof anything //String
anything = true
typeof anything //Boolean
Static Types
let greet:string = 'Hi Pioneras'
greet = 43 //Error
let full_name: string = 'Pioneras'
let full_name: string = "Pioneras"
let greet: string = `Hi Pioneras!
You rock!`
let word: string = 'Only'
let days: number = 17
let halloween: string = ' days till Halloween!!'
let message: string = `${ word + " " + days }
${ halloween }`
//Only 17
//days till Halloween!!
let members: number = 487
let developer: boolean = true
let notSure: any = 4
notSure = 'it can be a string'
notSure = false
//objetos
let skills:Array<string> = ['leaders', 'developers', 'pioneers']
let ages:number[] = [21, 24, 18, 27]
//enumerables
enum tasks {
program, //program = 1
innovate,
toLead
}
let marian: any = { task: '', dev: true}
marian.task = tasks[2] //toLead
marian.task = tasks.toLead //2
function add(x, y) {
return x + y
}
add(5,6) //11
add('Hey ', 'you!') // Hey you!
//functions
function greeting () :void {
console.log('Hi' + this.full_name + ', you all are amazing!')
//Hi Pioneras, you all are amazing!
}
function thanks (name:string , lastName?:string) :string {
return 'Thank you' + name + 'for inspiring me'
}
function inConsole (nameFunction:any) {
console.log(nameFunction)
}
inConsole(thanks('Pioneras')) //Thank you Pioneras for inspiring me
inConsole('I can be whatever you want me to be') //I can be whatever you want me to be
function (x, y){
return x * y
}
//Arrow Functions
let add = (x, y) => x + y
let add = (x: number, y: number): number => x + y
//classes
class women {
name: string
strong: boolean
constructor(name_: string){
this.name = name_
}
program (language: string = ''){
console.log(`I'm ${this.name} and I'm teaching ${language}`)
}
}
class pioneer extends women{
constructor(name: string){
super(name)
}
program (language = 'TypeScript'){
console.log('Hi everyone!')
super.program(language)
}
}
let melina = new pioneer('Melina')
melina.program()
//Hi Everyone!
//I'm Melina and I'm teaching TypeScript
let camila: women = new pioneer('Camila')
camila.program('Ionic')
//Hi Everyone!
//I'm Camila and I'm teaching Ionic
//interfaces
interface Persona{
first_name:string
last_name: string
github?: string
}
let personaUno: Persona = {
first_name:'Melina',
last_name:'Mejía',
github: '@melinamejia95'
}
interface women{
name: string
dev: boolean
talent: string
boyfriend?: boolean
}
class pionera implements women{
name: string
dev: boolean
talent: string
constructor(name_: string, dev_: boolean, talent_: string) {
this.name = name_
this.dev = dev_
this.talent = talent_
}
programm(language: string) {
console.log(this.name + ' is learning' + language)
}
}
let melina = new pionera('Melina',true,'draw')
melina.programm('Angular') //Melina is learning Angular
interface women{
name: string
dev: boolean
talent: string
boyfriend?: boolean
}
class pionera implements women{ //class pionera incorrectly implements interface 'women'
name: string
dev: boolean
constructor(name_: string, dev_: boolean, talent_: string) {
this.name = name_
this.dev = dev_
this.talent = talent_
}
programm(language: string) {
console.log(this.name + ' is learning' + language)
}
}
let melina = new pionera('Melina',true,'draw')
melina.programm('Angular')
//shapes
class Pioneer{
community: string
her_name: string
developer: boolean
constructor(){
this.community = 'Pioneras'
this.developer = true
}
setCom(community: string) {
this.community = community
}
}
let women = new Pioneer()
women.her_name = 'Melina'
//Union
let girl:string|number
girl = 21
console.log('My age: ' + girl) //My age: 21
girl = 'Pioneer'
console.log('Role:' + girl) //Role: Pioneer
class Pioneer{
community: string
her_name: string
developer: boolean
constructor(){
this.community = 'Pioneras'
this.her_name = 'Mel'
this.developer = true
}
setCom(community: string) {
this.community = community
}
}
let her = new Pioneer()
her.her_name = 'Melina'
her.setCom('Pioneras Developers')
classes.ts
tsc classes.ts
var Pioneer = (function () {
function Pioneer() {
this.community = 'Pioneras';
this.her_name = 'Mel';
this.developer = true;
}
Pioneer.prototype.setCom = function (community) {
this.community = community;
};
return Pioneer;
}());
var her = new Pioneer();
her.her_name = 'Melina';
her.setCom('Pioneras Developers');
classes.js
TypeScript
By Melina Mejía Bedoya
TypeScript
- 1,103