TS學(xué)習(xí)
1. 基礎(chǔ)類型:number、string、Boolean、null、undefined、Array、Tuple、void、Never、enum、Any、
(1)元組 Tuple:表示一個(gè)已知元素?cái)?shù)量和類型的數(shù)組,各個(gè)元素類型可以不同??梢詐ush,不能跨界訪問和取值。
2.類
(1)當(dāng)成員被標(biāo)記成 private時(shí),它就不能在聲明它的類的外部訪問
(2)構(gòu)造函數(shù)也可以被標(biāo)記成 protected。 這意味著這個(gè)類不能在包含它的類外被實(shí)例化,但是能被繼承。
(3)抽象類
? 抽象類做為其它派生類的基類使用。 它們一般不會直接被實(shí)例化。 不同于接口,抽象類可以包含成員的實(shí)現(xiàn)細(xì)節(jié)。 abstract關(guān)鍵字是用于定義抽象類和在抽象類內(nèi)部定義抽象方法。
3.枚舉
TypeScript支持?jǐn)?shù)字的和基于字符串的枚舉。
4.泛型
組件不僅能夠支持當(dāng)前的數(shù)據(jù)類型,同時(shí)也能支持未來的數(shù)據(jù)類型。
(1)泛型接口
定義公共接口和傳入?yún)?shù)的類型(參數(shù)的類型,編譯器自己判斷)
interface Identities<V, M> {
value: V,
message: M
}
function identity<T, U>(value: T, message: U): Identities<T, U> {
console.log("T:", value,":",typeof value);
console.log("U:", message,":",typeof message);
let identities: Identities<T, U> = {
value,
message
}
return identities
}
console.log(identity(true, "hello,world"))
(2)泛型類
泛型類可確保在整個(gè)類中一致地使用指定的數(shù)據(jù)類型.
interface Identities<T> {
value: T,
getIdentity: () => T
}
class IdentityClass<T> implements Identities<T> {
value: T
constructor(value: T) {
this.value = value
}
getIdentity(): T {
return this.value
}
}
let idClass = new IdentityClass<string>("aaa")
console.log(idClass.getIdentity()) //aaa
let idClass2 = new IdentityClass(68)
console.log(idClass.getIdentity()) //68, 編譯會根據(jù)傳入的值判斷其類型
5. 類型別名
類型別名就是給一種類型起個(gè)別的名字,之后只要使用這個(gè)類型的地方,都可以用這個(gè)名字作為類型代替。它只是起了一個(gè)名字,并不是創(chuàng)建了一個(gè)新類型。使用type關(guān)鍵字。
(1) 使用type關(guān)鍵字
type StringType = string
let s:StringType
s = "hello";
s = 123 //error
(2)類型別名可用于使用泛型
type PositionType<T> = { x: T, y: T }
let p1: PositionType<number> = {
x: 3,
y: 5
}
let p2: PositionType<string> = {
x: 'right',
y: 'top'
}
(3)使用類型別名時(shí)也可以在屬性中引用自己:
type Next<T> = {
val: T,
next?: Next<T> // 這里屬性引用類型別名自身
}
let list: Next<string> = {
val: 'first',
next: {
val: 'second',
next: {
val: 'third',
next: 'test' // 這里不符合類型別名規(guī)定,導(dǎo)致最外層 next 報(bào)錯
}
}
}
6.模塊 的導(dǎo)出和導(dǎo)入
(1)先聲明再導(dǎo)出
//導(dǎo)出: test1.ts
class Earth{
name: string = 'earth';
rotation(){
let oneday: string = 'A rotation takes 24 hours.';
console.log(oneday);
}
}
let human: string = 'Human being lives on Earth.';
//導(dǎo)入
import {Earth, human} from "./test1.ts"
let ourEarth: Earth = new Earth();
(2)在聲明時(shí)導(dǎo)出
//導(dǎo)出: test1.ts
export class Mars{
name: string = 'Mars';
status: string = 'China will explore Mars in the following several decades.';
}
export function exploring(){
console.log('Launching Changzheng-5 rocket.');
console.log('Add oil, 胖五.');
}
//導(dǎo)入
import {Mars, exploring} from './test1.ts'
(3) 默認(rèn)的導(dǎo)出導(dǎo)入
// Jupiter.ts
class Jupiter{
name: string = 'Jupiter';
feature: string = 'very very big.';
}
let jupiterStatus: string = 'Jupiter is absorbing material from the sun.';
export default {Jupiter, jupiterStatus};
//導(dǎo)入
import SpectacularJupiter from './Jupiter'; // 這里SpectacularJupiter相當(dāng)于Jupiter和jupiterStatus的集合體
let beautifulJupiter = new SpectacularJupiter.Jupiter();
console.log('NASA report: ' + beautifulJupiter.name + ' is ' + beautifulJupiter.feature);
console.log(SpectacularJupiter.jupiterStatus);
(4)常見的導(dǎo)出語句
// 普通導(dǎo)出
export {something1, something2, ..., somethingN};
export {something1 as rename1, something2 as rename2, ..., somethingN as renameN};
export let something = '100';
export function func(){/* some actions here */};
// 默認(rèn)導(dǎo)出
export default something;
export default {something1, something2, ..., somethingN};
export default let something = '100';
export default function func(){/* some actions here */};
// 重新導(dǎo)出
export {something1, something2, ..., somethingN} from 'modulename';
export {something1 as rename1, something2 as rename2, ..., somethingN as renameN} from 'modulename';
export * from 'modulename'; //可以作為中間ts
// 兼容CommonJS和AMD的導(dǎo)出
export = {something1, something2, ..., somethingN};
export = something;
(5)常見的導(dǎo)入語句
// 普通導(dǎo)入
import {something1, something2, ..., somethingN} from 'modulename';
import {something1 as rename1, something2 as rename2, ..., somethingN as renameN} from 'modulename';
// 默認(rèn)導(dǎo)入
import theNewModuleNameYouLike from 'modulename';
// 導(dǎo)入全部
import * as theNameYouLike from 'modulename';
// 兼容CommonJS和AMD的導(dǎo)入
import theNewModuleNameYouLike = require('modulename');