You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
TypeScript can do static type checking at compile time. Types are erased before emitting compiled Javascript, result in zero run-time overhead to program execution.
Scalability
It's pretty useful for large-scale system and makes code refactoring easier and under control. E.g.
// You have no idea what parameter the greet funciton accpets without peaking into the function implementation functiongreet(person){if(person.sex==='male'){return`Mr ${person.first}${person.second}`}elseif(person.sex==='female'){return`Mis ${person.first}${person.second}`}return`${person.first}${person.second}`}
IDE support - symbol based navigation + statement completion
Starter
In Typescript, types can be associated with variables through explicit type annotations, such as
let x: number;
or through implicit type inference, as in
letx=1;
Types and Values
Typescript is a superset of Javascript. What works in Javascript should also work in Typescript. The addon from Typescript, as its name indicates, is type. In Typescript, there are values and types. TypeScript erases all types information before emitting JavaScript while values are preserved as in Javascript.
What results in types:
A type alias declaration (type sn = number | string;)
An interface declaration (interface I { x: number[]; })
A class declaration (class C { })
An enum declaration (enum E { A, B, C })
An import declaration which refers to a type
What results in values:
let, const, and var declarations
A namespace or module declaration which contains a value
An enum declaration
A class declaration
An import declaration which refers to a value
A function declaration
Basic Types
Boolean
letisChecked: boolean=false;
Number
letnum: number=6;
String
letcolor: string="blue";
Array
letlist: number[]=[1,2,3];letlist: Array<number>=[1,2,3];// This doesnt work in JSX as `<` and `>` are used in element tag
Tuple
// Declare a tuple typeletx: [string,number];// Initialize itx=["hello",10];// OK// Initialize it incorrectlyx=[10,"hello"];// Error
It's useful when migrate from Javascript to Typescript.
Void
void is a little like the opposite of any: the absence of having any type at all. You may commonly see this as the return type of functions that do not return a value:
functionwarnUser(): void{console.log("This is my warning message");}
Object:
Note: object is not the same as Object.
object is a basic type that represents the non-primitive type, i.e. any thing that is not number, string, boolean, symbol, null, or undefined.
Object is a built-in interface as shown below. It is almost any type.
interface Object {
/** The initial value of Object.prototype.constructor is the standard built-in Object constructor. */
constructor: Function;
/** Returns a string representation of an object. */
toString(): string;
/** Returns a date converted to a string using the current locale. */
toLocaleString(): string;
/** Returns the primitive value of the specified object. */
valueOf(): Object;
/**
* Determines whether an object has a property with the specified name.
* @param v A property name.
*/
hasOwnProperty(v: PropertyKey): boolean;
/**
* Determines whether an object exists in another object's prototype chain.
* @param v Another object whose prototype chain is to be checked.
*/
isPrototypeOf(v: Object): boolean;
/**
* Determines whether a specified property is enumerable.
* @param v A property name.
*/
propertyIsEnumerable(v: PropertyKey): boolean;
}
function logWithBasicObject(obj: object) {
console.log(obj.hasOwnProperty);
}
logWithBasicObject({a: 'b'}); // OK
logWithBasicObject('ab'); // Error: Argument of type '"ab"' is not assignable to parameter of type 'object'
function logWithInterfaceObject(obj: Object) {
console.log(obj.hasOwnProperty);
}
logWithInterfaceObject({a: 'b'}); // OK
logWithInterfaceObject('ab'); // OK
Notice
If you want to follow the latest news/articles for the series of my blogs, Please 「Watch」to Subscribe.
The text was updated successfully, but these errors were encountered:
What is Typescript
Why Typescript
Static type system
TypeScript can do static type checking at compile time. Types are erased before emitting compiled Javascript, result in zero run-time overhead to program execution.
Scalability
It's pretty useful for large-scale system and makes code refactoring easier and under control. E.g.
compared to the Typescript version
IDE support - symbol based navigation + statement completion
Starter
In Typescript, types can be associated with variables through explicit type annotations, such as
or through implicit type inference, as in
Types and Values
Typescript is a superset of Javascript. What works in Javascript should also work in Typescript. The addon from Typescript, as its name indicates, is
type
. In Typescript, there arevalues
andtypes
. TypeScript erases alltypes
information before emitting JavaScript whilevalues
are preserved as in Javascript.What results in
types
:What results in
values
:Basic Types
It's useful when migrate from Javascript to Typescript.
void
is a little like the opposite ofany
: the absence of having any type at all. You may commonly see this as the return type of functions that do not return a value:object
is a basic type that represents the non-primitive type, i.e. any thing that is not number, string, boolean, symbol, null, or undefined.Object
is a built-in interface as shown below. It is almost any type.Check the demo for difference:
Notice
The text was updated successfully, but these errors were encountered: