TypeScript学习笔记

let isDone: boolean = false

let age: number = 20

let binaryNumber: number = 0b1111
binaryNumber.toString

let fristName: string = 'shanyao'
fristName.charCodeAt

let message: string = `hello, ${fristName}, age is ${age}`

let u: undefined = undefined

let n: null = null

let num:number = undefined

//代表任何类型 会丧失具体的类型作用
let notSure: any = 4
notSure = 'maybe it is a string'
notSure = true
notSure.myname
notSure.myname()

//联合类型
let numberOrString: number | string = 234
numberOrString = 'abc'

//数组
let arrOfNumbers: number[] = [1, 2, 3, 4]
arrOfNumbers.push(5)

//类数组
function tets() {
  console.log(arguments);
  arguments.length
  arguments[2]
  // 会报错
  // arguments.forEach
  
  let htmlCollection: Node
}

//元组
let user: [string, number] = ['shanyao', 1]

//Interface接口
// 对对象的形状(shape)进行描述
// 对类(class)进行抽象
// Duck Typing (鸭子类型)

interface Person {
  readonly name: string;
  age: number;
  dateBirth: string;
}

let shanyao: Person = {
  name: 'shanyao',
  age: 20,
  dateBirth: '2020-04-20'
}

//泛型 
function echo<T>(arg: T): T {
  return arg
}
const str: string = 'str'
const result1: string = echo(str)

function swap<T, U>(tuple: [T, U]): [U, T] {
  return [tuple[1], tuple[0]]
}
const result2 = swap(['string', 123])
// result2[1].codePointAt

//约束泛型
function echoWithArr<T>(arg: T[]): T[] {
  console.log(arg.length);
  return arg
}
const arrs = echoWithArr([1, 2, 3])

//必须含有length的属性
interface IWithLength {
  length: number
}
function echoWithLength<T extends IWithLength>(arg: T): T {
  console.log(arg.length)
  return arg
}
const str1 = echoWithLength('str1')
const obj = echoWithLength({length: 10, width: 20})
const arr2 = echoWithLength([1, 2, 3])
// const number2 = echoWithLength(123)


class Queue<T> {
  private data = []
  push(item: T){
    return this.data.push(item)
  }
  pop(): T{
    return this.data.shift()
  }
}
const queue = new Queue<number>()
queue.push(1)
console.log(queue.pop().toFixed())

const queue2 = new Queue<string>()
queue2.push('12')
console.log(queue.pop.length);

interface KeyPair<T, U> {
  key: T;
  value: U;
}
let kp1: KeyPair<number, string> = { key: 123, value: '1212'}
let kp2: KeyPair<string, number> = { key: '12', value: 12}

let arr:number[] = [1, 2, 3]
let arrTwo: Array<number> = [1, 2, 3]


interface IPlus<T>{
  (a: T, b: T): T
}
function plus(a: number, b: number): number {
  return a + b
}
function connect(a:string, b:string) {
  return a + b
}
const a: IPlus<number> = plus
const b: IPlus<string> = connect


// type aliaces 类型别名
type PlusType = (x: number, y: number) => number
function sum(x: number, y:number) {
  return x + y
}
const sum2: PlusType = sum
type NameResolver = () => string
type NameOrResolver = string | NameResolver //等价于string | (x: number)=> string
function getName(n: NameOrResolver) {
  if(typeof n === 'string'){
    return n
  } else {
    return n()
  }
}

//type assertion 类型断言 类型断言不是类型装换  联合类型不能断言成别的类型
//input as String 等价于 <string>input
function getLength(input: string | number): number {
  // const str4 = input as String
  // if(str.length){
  //   return str.length
  // } else {
  //   const number = input as Number
  //   return number.toString().length
  // }
  if((<string>input).length) {
    return (<string>input).length
  }else{
    return input.toString().length
  }
}

//函数声明的写法
function add(x:number, y:number, z:number = 10): number {
  if (typeof z === 'number') {
    return x + y + z
  }else{
    return x + y
  }
}
let result = add(2, 3)


const add2 = function (x: number, y: number, z: number = 10): number {
  if (typeof z === 'number') {
    return x + y + z
  } else {
    return x + y
  }
}

const add3: (x: number, y: number, z?:number) => number = add2

//常量枚举 计算枚举
enum Direction {
  Up = 'UP',
  Down = 'DOWN',
  Left = 'LEFT',
  Right = 'RIGHT'
}

console.log(Direction.Up)
console.log(Direction[0])
const value = 'UP'
if (value === Direction.Up) {
  console.log('go up!');
}

// 类(class): 定义一切事物的抽象特点
// 对象(object): 类的实例
// 面向对象(OOP): 三大特性:封装, 继承, 
// 修饰符 public(公有的)  private(私有的) protected(保护继承 父子可以访问) readonly(只读属性)
class Animal {
  public name: string;
  //静态方法 static
  static categoies: string[] = ['mammal', 'bird']
  static isAnimal(a) {
    return a instanceof Animal
  }
  
  constructor(name: string) {
    this.name = name
  }
  run() {
    return `${this.name} is running`
  }
}

const snake = new Animal('lily')
console.log(snake.run());
console.log(Animal.categoies);
console.log(Animal.isAnimal(snake));


class Dog extends Animal {
  bark(){
    return `${this.name} is barking`
  }
}

const xiaobao = new Dog('xiaobao')
console.log(xiaobao.run());
console.log(xiaobao.bark());

class Cat extends Animal {
  constructor(name){
    super(name)
    console.log(this.name);
  }
  run() {
    return `Meow, ${super.run()}`
  }
}
const maomao = new Cat('maomao')
console.log(maomao.run());


//共有特性
interface Radio {
  switchRadio(): void
}
interface Battery {
  checkBatteryStatus();
}
interface RadioWithBattery extends Radio {
  checkBatteryStatus();
}
class Car implements Radio {
  switchRadio(){

  }
}

class Cellphone implements RadioWithBattery {
  switchRadio() {

  }
  checkBatteryStatus() {
    
  }
}

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,547评论 6 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,399评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,428评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,599评论 1 274
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,612评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,577评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,941评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,603评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,852评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,605评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,693评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,375评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,955评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,936评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,172评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 43,970评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,414评论 2 342

推荐阅读更多精彩内容