TypeScript常用

ts数据类型
ts作为js的超集,必然还有js所有的数据类型:

  • Boolean
  • Number
  • String
  • Array
  • Function
  • Object
  • Symbol
  • undefined
  • null

Ts还新增一些数据类型:

  • void 当前方法没有返回值
  • any 这个数据的数据类型可以是任何的数据(和原来的js就完全一样了)
  • never 表示永远都不会发生值的类型
  • unknown 只能赋值给any和unknown类型的变量
  • tuple元组 多种元素的组合
  • 枚举类型 就是将一组可能出现的值, 一个一个列举出来, 定义在一个类型中,这个类型就是枚举类型 (枚举类型放常量 字符串 数字 (全大写))

类型断言:

<类型>值
值 as <类型>

类型缩小

我们可以通过类似 typeof x === "number"判断语句,来改变缩小比声明的时候更小的类型.
//typeof x === "number" ==> 类型保护(type guards)

交叉类型

type A = number|string|boolean;
//交叉类型(intersection Types)  合并
//交叉类型表示需要满足多个条件
//交叉类型使用的是&
type B = number & string
//表达的含义是number和string要同时满足
//但是不可能有一个值同时是number和string的, 所以B这个类型其实是一个never类型

Ts的接口interface

接口的声明

interface Person {
    name: string,
    age: number
}

interface的可选属性

interface Person {
    name: string,
    friend?: {
        name: string,
        age?: number,
        girlFriend?: {
            name: string
        }
    }
}

let obj: Person = {
    name: "哈哈",
    friend: {
        name: "xixi"
    }
}

console.log(obj.name)
console.log(obj.friend?.name)//如果friend存在就去读取里面的name,则返回undefind
console.log(obj.friend?.girlFriend?.name)

ts的只读属性 在name (属性)前面添加readonly 不能修改

interface和type之间有什么异同
1.interface可以重复声明 type不能重复声明
2.type定义的别名, 别名是不能重复
3.interface具有和合并的效果
ts中类的成员修饰符
1 public
修饰的是在任何地方可见 公有的属性或方法 默认编写的属性就是public的
2 private
修饰的是仅在同一类中可见 私有的属性或方法(不参与继承)
3 protected
修饰的是仅在类自身及子类中可见 受保护的属性或方法(不能读写)
4 readonly
修饰的是这个属性我们不希望外界可以任意的修改,只希望确定值之后直接使用(只能读)

Ts中的泛型

1.不确定用户传递什么类型的参数回来 那么也就不能确定返回值

2.在定义这个函数的时候, 我们不去决定这些参数的类型
而是让调用者以参数的形式告诉我们函数的参数应该是什么类型

//函数中在函数名的后面通过<形参>的形式,接受传递过来的类型
function fn<T=string>(arg:T):T{
     console.log(arg)
    return arg
}


//泛型函数调用
//1通过<类型> 的方式将类型传递给函数
fn<string>("1234")
//2通过类型推导,自动的推导出我们传入变量的类型
//  在这里会推导出他们是字面量类型, 当然字面量类型对我们的函数也是适用的
fn<number>(123)
//引用类型会推导出想要的效果
fn<number[]>([1,2,3])
fn({a:1})
fn([1,2,3])

补充
约定俗成的开发过程中一些常见名称
T: type的缩写, 类型
K/V: key和value的缩写, 键值对
E: element的缩写, 元素
O: object的缩写, 对象

你可能感兴趣的:(ts,typescript,javascript,前端)