美文网首页
四、函数

四、函数

作者: zdxhxh | 来源:发表于2020-02-19 10:01 被阅读0次

函数

函数是 JavaScript 应用程序的基础,它帮助你实现抽象层,模拟类,信息隐藏和模块。在 TypeScript 里,虽然已经支持类,命名空间和模块,但函数仍然是主要的定义行为的地方。TypeScript 为 JavaScript 函数添加了额外的功能,让我们可以更容易地使用。

示例

// 声明式函数
function add(x,y) { 
  return x + y 
}
// 函数表达式
let c = function(x,y) { 
  return x + y 
}

1. 为函数定义类型

function add(x : number,y:number) { 
  return x + y 
}

书写完整函数类型

let myAdd : (x : number,y : number)=>number = 
function (x : number,y:number) { 
  return x + y 
}

函数类型包含两部分:参数类型和返回值类型。 当写出完整函数类型的时候,这两部分都是需要的

注意 : 只要书写的函数,函数参数匹配函数类型,不用在乎函数类型的形参名字。

2. 推动类型

如果赋值语句一边指定了类型但另一边没有类型的话,TypeScript编译器会自动识别出类型。

这叫做“按上下文归类”,是类型推论的一种。它帮助我们更好地为程序指定类型。

3. 可选参数与默认参数

TypeScript里的每一个参数都是必须的,编译器会检查开发者是否为每个参数都传入了值,编译器会假设只有这些参数会被传入函数,入参个数必须与形参个数一致。

function processConfig(data : any,header : AxiosRequestHeader) { 
  // ....
}

processConfig(data) // Error 参数过少
processConfig(data,header,method) // Error 参数过多
processConfig(data,header)  // OK

在TypeScritp中,可以为?使一个参数可选的,通常可选参数放在形参位置的末尾。

function processConfig(data : any,header ?: AxiosRequestHeader) { 
  // ....
}

也可以通过设置参数的初始化值,与可选参数不同,它可以不指定类型,且可以不妨到形参位置末尾。

function processConfig(data ={ code : 200,msg : 'xxx'},header ?: AxiosRequestHeader) { 
  // ....
}

4. 剩余参数

有时候,你想要操作多个参数实现多态,在Javascript里,你可以通过Array.prototype.slice.call(arguments) 来访问传入参数。

在ES6里,可以通过function(..args),访问args传入参数

在TypeScript中也一样。

function buildName(...args : string[]) { 

}

5. this

我们可以显式为函数里面定义一个this参数

function f(this : void ) { 
  // 确保this在此独立函数中可用
}

又例如 :

class A { 
  name : string 
}
// 函数现在显式指定其被调用方必须是 deck 类型
let a : A = { 
  name : '叼捏奶'
  sayMyName (this : A) { 
    console.log(this.a)
  }
}

可以定义在回调函数中

interface UIElement {
  addClickListener (onclick: (this: void, e: Event) => void): void
}

6. 重载

Javascript是个动态语言,加入TypeScript后,可以提供给他重载的特性。但并不是说传入的参数不同就能调用不同的重载函数,而仅仅是为躲过编译器的检查而已

// 下面两个是重载列表
function pickCard(x: {suit: string; card: number }[]): number
function pickCard(x: number): {suit: string; card: number }
// 这个是实现
function pickCard(x): any {
  if (Array.isArray(x)) {
    let pickedCard = Math.floor(Math.random() * x.length)
    return pickedCard
  } else if (typeof x === 'number') {
    let pickedSuit = Math.floor(x / 13)
    return { suit: suits[pickedSuit], card: x % 13 }
  }
}

相关文章

  • 四、函数

    函数 函数是 JavaScript 应用程序的基础,它帮助你实现抽象层,模拟类,信息隐藏和模块。在 TypeScr...

  • 四,函数

    四、函数的使用 函数的基本使用[图片上传失败...(image-b2c144-1555236216120)] 函数...

  • 函数 四

    三元表达式 列表生成式 迭代器 生成器 函数的递归调用与二分法

  • SQL常用单行方法

    一、字符函数 二、数字函数 三、日期函数 四、其他函数 五、流程控制函数 六、分组函数

  • 函数

    函数的分类,分别有四种函数、递归函数、匿名函数。 四种函数函数根据有没有参数,有没有返回值,可以相互组合,一共有4...

  • excel四舍五入函数视频-excel中INT函数视频和exce

    excel四舍五入函数视频 excel中INT函数视频 excel的row函数视频 excel四舍五入函数视频-e...

  • MYSQL基础函数

    一、数学函数 二、字符串函数 三、日期时间函数 四、系统信息函数 五、加密函数

  • 四、SQL函数④(其他函数)

    类型转换 隐式转换:数据库系统自动将字符串类型转换为整数类型显式转换:使用类型转换函数转换。使用类型转换函数不仅可...

  • Python小白学习进行时---函数(三)(2018-06-23

    一、函数变量 二、匿名函数 三、递归函数 四、函数的调用过程 五、使用函数模块 一、函数变量 1、函数名就是函数类...

  • swift基础语法(函数)

    一、函数的基本使用 二、函数的使用注意 --- 参数名 三、函数的使用注意 --- 函数类型 四、函数嵌套

网友评论

      本文标题:四、函数

      本文链接:https://www.haomeiwen.com/subject/fviofhtx.html