对象之间区别

Object、object、{}之间的区别与理解

## 所有的原始类型都指向Object
let a:Object =  123
let a1:Object =  '123'
let a2:Object =  true
let a3:Object =  []
let a4:Object =  {}
let a5:Object =  () => {}

## 非原始类型
let a:object = 123  // 错误 原始类型
let a1:object = '123' // 错误 原始类型
let a2:object = false // 错误 原始类型
# 引用类型
let a3:object = {} // 正确
let a4:object = [] // 正确
let a5:object = () => {} // 正确

## {} // 字面量 new Object()
let a:{} = {name: 1} // 可以进行任意类型值的赋值，但是没有办法去修改的
a.age = 2 // 没有办法进行任意类型的值进行新增和修改

接口和对象类型

// 1.不能多属性，也不能少属性
// 2.重名的属性会重合
// 3.任意key
// 4.属性的可以有无
// 5.readonly 只读
interface Aaa {  // 注意首字母要大写
    name: string,
    [propName:string]:any, //任意key
    say?: number // 可以有无
    readonly  id: number,
    readonly  cb: () => {}
}

interface Aaa {  // 注意首字母要大写
    age: number   
}

let a:Aaa  = {
    name: '刘德华',
    age: 88,
    id: 111
}

// 6.接口继承
interface B {
    XXX: string
}

interface Aaa extends B {
    
}

let a:Aaa  = {
    name: '刘德华',
    age: 88,
    id: 111,
    XXX: '另算'
}

// 7.定义函数类型
interface Fn {
    (name: string): number[]
}

const fn:Fn = (name:string) => {
    return [1]
}

数组类型

// 1.定义数组 number[]、Array<number>
## 方式1
let arr:number[] = [1,2,3,4]
## 方式2
let arr:Array<number> = [1,2,3,4]

// 2.数组的普通类型 
// 定义对象数组
interface X {
    name: string
    age?: number
}

let arr:X[] = [ {name: "333", age: 77},{name: "胡萝卜"}]

// 定义二维数组
let arr:number[][] = [[1],[2],[3]]
## 二种写法
let arr:Array<Array<number>> = [[1],[2]]
let arr:any[] = [1,'string',true]
let arr:[number,string,boolean] = [1,'hh',true]

## 函数剩余参数定义类型
function a(...arg:any[]) {
    let a:IArguments = arguments
}

a(1,2,3)

interface  A {
    callee: Function
    length: number
    [index:number] : any
}

函数类型

// 1.定义函数参数以及返回值
function add(a:number,b:number):number(返回值定义) {
    return a+b
}
cnsole.log(add(1,1))
## 箭头函数
const add = (a:number,b:number):number => a+b

## 函数参数的默认值
function add(a:number = 1,b:number = 2, c?:number): number {
   return a + b
}
console.log(add())

## 传对象
interface User {
    name: string
    age: number
}
function add(user:User):User {
    return user
}
console.log({name: '刘德华', age: 23})

// 2.函数的this类型,在js中无法使用 第一个参数必须定义this的类型
interface Obj {
    name: number[],
    add: (this:Obj, num:number) => void
}

let obj:Obj = {
    user: [1,2,3],
    add(this:Obj) {
        this.user.push(num)
    }
}

// 3.函数重载
let user:number[] = [1,2,3]
function findNum(add:number[]):number[] // 如果传的是一个number类型的数组那就做添加
function findNum(id:number):number[] // 如果传入了id就是单个查询
function findNum():number[]  // 如果没传东西就是查询全部
function findNum(ids?: number | number[]):number[] {  // 
    if(typeof  ids == 'number') {
        return user.filter(v => v == ids )
    }
    else  if(Array.isArray(ids)) {
        user.push(...ids)
        return user
    } 
    else {
        return user
    }
}  //

联合类型 && 交叉类型 && 类型断言

// 1.联合类型
let phone: number | string = 3563737637


let fn = function (type: number | boolean):boolean {
    return !!type
}

// 交叉类型
interface People {
    name: string,
    age: number
}

interface Man {
    sex: number
}

const fn = (man: People & Man):void => {
    console.log(man)
}

fn({
    name: '李四',
    age: 14,
    sex: 1
})

// 类型断言
let  fn = function (num: number | string): void {
    console.log((num as string).length)
}

interface  A {
    run: string 
}

interface  B {
    build: string
}

let fn = (type: A | B):void {
    console.log(<A>type.run)
    console.log((tupe as A).run)
}

(window as any).abc = 123

// 类型断言不能滥用
const fn = (type: any):boolean => {
    retun type as boolean
}

内置对象