From today we are starting a series of publications of the adapted and supplemented translation " TypeScript
. "
Each value in, JavaScript
when performing any operations on it, behaves in a certain way. This may sound somewhat abstract, but as an example, let's try to perform some operations on a 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% !
