A partir de hoy estamos iniciando una serie de publicaciones de la traducción adaptada y complementada " TypeScript
".
Cada valor en, JavaScript
al realizar cualquier operación en él, se comporta de cierta manera. Esto puede sonar algo abstracto, pero como ejemplo, intentemos realizar algunas operaciones en una variable message
:
// `toLowerCase` // message.toLowerCase() // `message` message()
toLowerCase
. message
.
, , message
— — , .
-
message
? -
toLowerCase
? - ,
toLowerCase
? - , ?
, , , , .
, message
:
const message = 'Hello World'
, , , message.toLowerCase()
, .
? JS
, , :
TypeError: message is not a function // : message —
, .
, , JS
, , (type) — . TypeError
— , 'Hello World'
.
, string
number
, (runtime) typeof
. , , . , :
function fn(x) { return x.flip() }
, , flip
, JS
. , fn
, JS
. .
— , fn
, . JS
— () — , , .
, .
TypeError
, , string
. (bugs) .
, . , , TS
. . TS
, , , .
const message = 'Hello!' message() // This expression is not callable. Type 'String' has no call signatures. . 'String'
TS
, ( ).
,
— , JS
, . ECMAScript
, - .
, , . , , . , undefined
:
const user = { name: 'John', age: 30 } user.location // undefined
TS
, , :
const user = { name: 'John', age: 30 } user.location // Property 'location' does not exist on type '{ name: string; age: number; }'. 'location' ...
«» (catch) , .. ( ) .
:
const announcement = «Hello World!»; // ? announcement.toLocaleLowercase(); announcement.toLocalLowerCase(); // , announcement.toLocaleLowerCase();
- ,
function flipCoin() { // `Math.random()` return Math.random < 0.5; // Operator '<' cannot be applied to types '() => number' and 'number'. '<' ... }
const value = Math.random() < 0.5 ? «a» : «b»; if (value !== «a») { // ... } else if (value === «b») { // This condition will always return 'false' since the types 'a' and 'b' have no overlap. 'false', 'a' 'b' // , }
,
TS
. ? . TS
, , ( ), . , TS
. , TS
, « » , , .. , , , ..
tsc
, TS
tsc
:
yarn global add tsc
#
npm i -g tsc
hello.ts
:
// console.log('Hello World!')
() JS
:
tsc hello.ts
. , , . . , hello.js
. hello.ts
, TS
. , , .
. hello.ts
:
function greet(person, date) { console.log(`Hello, ${person}! Today is ${date}.`) } greet('John')
tsc hello.ts
, :
Expected 2 arguments, but got 1. 2 , 1
TS
, greet
, .
, , , hello.js
. , TS
. JS-, , , TS
. , , TS
, --noEmitOnError
. hello.ts
:
tsc --noEmitOnError hello.ts
, hello.js
.
TS
, person
— string
, date
— Date
. toDateString()
date
:
function greet(person: string, date: Date) { console.log(`Hello, ${person}! Today is ${date.toDateString().}`) }
, , (type annotations) person
date
, greet
.
TS
, :
function greet(person: string, date: Date) { console.log(`Hello, ${person}! Today is ${date.toDateString()}.`); } greet('John', Date()); // Argument of type 'string' is not assignable to parameter of type 'Date'. 'string' 'Date'
Date()
. , Date
, new Date()
:
greet('John', new Date());
, TS
(infer) :
const msg = 'Hello!' // const msg: string
greet
JS
tsc
. :
«use strict»; function greet(person, date) { console.log(«Hello « + person + «! Today is « + date.toDateString() + «.»); } greet(«John», new Date());
:
person
date
.
« » — , ( ```) — (+).
, , JS
( ECMAScript
, ), , JS
, , TS
.
, (downleveling), , , JS-, ECMAScript 2015
(ES6
), , ECMAScript 3
(ES3
). ( ) ES6
, TS
ES3
, . , , --target
. , tsc --target es2015 hello.ts
.
, TS
, . --strict
"strict": true
tsconfig.json
. , , noImplicitAny
strictNullChecks
.
noImplicitAny
—TS
,any
. , . ,TS
.noImplicitAny
,any
strictNullChecks
—null
undefined
. , , .strictNullChecks
null
undefined
,
10% !
