typeScript函数篇
typeScript
的函数是在es6的函数特性的基础上加了一些后端的概念:泛型、参数类型声明、返回值类型声明、重载、装饰器等。其他的一些特性:箭头函数、生成器、async-await、promise等都是es6的加的特性。
函数类型
JavaScript的函数参数是可以任何类型的,typeScript中加了对参数提添加类型,函数本身添加返回值类型。
function greetNane(name: string): string {
return `hello ${name}`
}
还有一种函数声明的方式:
let greetNane: (name: string) => string = function (name: string): string {
return `hello ${name}`
}
typeScript中函数调用时传的参数类型和数量和函数声明时候不匹配会报错。
可选参数和默认参数
可选参数:typeScript中设置函数中一个参数可传也可不传的。
let greetNane: (name: string, age?: number) => string = function (name: string, age?: number): string {
return `hello ${name}`
}
默认参数:和es6的默认参数写一样,也可以在参数后面加类型。
let greetNane: (name: string, age: number = 0) => string = function (name: string, age: number = 0): string {
return `hello ${name} ${age}`
}
let greetNane: (name: string, age = 0) => string = function (name: string, age = 0): string {
return `hello ${name} ${age}`
}
剩余参数
typeScript剩余参数和es6的写法差不多,也是后面加个参数的类型。
let greetNane: (name: string, ...arrs: string[]) => string = function (name: string, ...arrs: string[]): string {
return `hello ${name} ${age}`
}
...的用法和es6的一样。
注:因为现在主流浏览器都没有完全支持es6,所有在实际项目中es6和typescript都是最后转换成es5的写法。剩余参数的转换成es5是遍历arguments参数将参数放到arrs数组中。
var arrs=[];
for (var _i = 0, coumt = arguments.length; i < coumt; i++) {
arrs[_i]=arguments[_i];
}
如果你认为这个可能对应用程序带来性能问题,应考虑不使用剩余参数只使用数组作为参数。
重载
函数重载或方法重载是名称相同并且参数数量类型不同创建多个方法的能力。
typeScript中通过声明函数标签,最后在一个标签实现函数的。
function greetNane(name:string) :string;
function greetNane(name:number) :number;
function greetNane(name:boolean) :boolean;
function greetNane(name:(string|number|boolean)):any{
return name;
}
泛型
作用域,this,箭头函数就不说了,直接说泛型,泛型来创建可重用的组件,一个组件可以支持多种类型的数据。
function greetNane<T>(name:T):T{
return name
}
greetNane<string>('name')
greetNane('name')
函数根据参数的类型来返回对应类型的值。
参考书籍文档:
- 《Learning TypeScript》
- TypeScript中文网
typeScript函数篇的更多相关文章
- 《前端之路》- TypeScript(二) 函数篇
目录 一.定义函数方法 二.定义函数传参 三.可选传参 四.默认传参 五.传递剩余参数 六.函数重载 七.箭头函数 八.总结 一.定义函数方法 在 es5 中定时函数的方法有 命名函数和函数表达式(匿 ...
- TypeScript入门三:TypeScript函数类型
TypeScript函数类型 TypeScript函数的参数 TypeScript函数的this与箭头函数 TypeScript函数重载 一.TypeScript函数类型 在上一篇博客中已经对声明Ty ...
- PHP函数篇详解十进制、二进制、八进制和十六进制转换函数说明
PHP函数篇详解十进制.二进制.八进制和十六进制转换函数说明 作者: 字体:[增加 减小] 类型:转载 中文字符编码研究系列第一期,PHP函数篇详解十进制.二进制.八进制和十六进制互相转换函数说明 ...
- Python函数篇(5)-装饰器及实例讲解
1.装饰器的概念 装饰器本质上就是一个函数,主要是为其他的函数添加附加的功能,装饰器的原则有以下两个: 装饰器不能修改被修饰函数的源代码 装饰器不能修改被修改函数的调用方式 装饰器可以简单的理 ...
- Python函数篇(7)-正则表达式
1.正则表达式 正则表达式为高级的文本模式匹配,抽取,与/或文本形式的搜索和替换功能提供了基础,简单的来说,正则表达式是由一些字符和特殊符号组成的字符串.Python通过标准库中的re模块来支持正 ...
- Scala进阶之路-Scala函数篇详解
Scala进阶之路-Scala函数篇详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.传值调用和传名调用 /* @author :yinzhengjie Blog:http: ...
- TypeScript 函数 (五)
传递给一个函数的参数个数必须与函数期望的参数个数一致. 参数类别: 必须参数 可选参数 :可选参数必须在参数后面. 默认参数 :当用户没有传递这个参数或传递的值是undefined时. 它们叫做有默认 ...
- C语言函数篇(二)函数参数基础设计
形参实现一种数据传入的接口 ,由 实参 拷贝给 形参. 拷贝!!!!!!!!!!! 例1: void func(int tmp){ //意图是实现传进来的参数 +1 tmp++; } int mian ...
- 30s源码刨析系列之函数篇
前言 由浅入深.逐个击破 30SecondsOfCode 中函数系列所有源码片段,带你领略源码之美. 本系列是对名库 30SecondsOfCode 的深入刨析. 本篇是其中的函数篇,可以在极短的时间 ...
随机推荐
- 浅谈WPF中的MVVM框架--MVVMFoundation
先科普一下:什么是WPF,请看下图 微软对于WPF技术的构想是很宏大的,可惜普及率不高,不过如果你要做Windows客户端开发的话WPF技术还是值得一学的. 什么是MVVM模式 简单来说它是一种高级的 ...
- 【转载】C#代码开发过程中如何快速比较两个文件夹中的文件的异同
在日常的使用电脑的过程中,有时候我们需要比较两个文件夹,查找出两个文件夹中不同的文件以及文件中不同的内容信息,进行内容的校对以及合并等操作.其实使用Beyond Compare软件即可轻松比较,Bey ...
- (11)Microsoft office Word 2013版本操作入门_word中表格操作
制作一个如下表格: 1. 插入一个4x4的表格或者手动绘制一个4x4表格. 1.1插入一个4x4表格或者绘制表格的按钮如下图所示 绘制表格,自己手动画比较复杂的表格 1.2对插入的表格: 点击表格的 ...
- 设计模式之 SOA面向服务的体系
SOA英文直译是,面向服务的体系结构. SOA是一种设计方法,其中包含多个服务,而服务之间通过配合最终会提供一系列功能.一个服务通常以独立的形式存在于操作系统进程中. 想要看到更多玮哥的学习笔记.考试 ...
- vue 获取页面详情后 切换页面时 如何监听用户是否修改过信息
可以用 beforeRouteLeave 和 updated 来判断.export default { name: 'supplier', components:{cmtWrap,cmtContent ...
- js事件冒泡机制
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 后端开发者的Vue学习之路(三)
目录 上节内容回顾 组件 什么是组件 组件注册 全局注册组件 局部注册组件 使用细节 组件注册的命名规范: 组件中只有一个根元素 组件也是一个实例 组件在某些元素中渲染出错 组件间的数据传递 父子组件 ...
- 【20190407】JavaScript-indexOf方法解析
在JavaScript中,字符串类型String和数组类型Array都有indexOf()方法,虽然他们的作用都是返回传入元素在指定字符串或数组中的位置,但他们之间还是存在着一点点不同. Str.in ...
- JHipster技术栈定制 - JHipster Registry消息总线配置
本文说明了如何定制化JHipster-Registry,增加消息总线功能. 实现的效果就是修改配置中心的文件后,通过消息队列主动推送给微服务而无需重启微服务,实现配置内容热加载. 1 整体规划 1.1 ...
- Linux Mysql数据库安全配置
Linux Mysql数据库安全配置 目录: 1.修改mysql管理员账号root的密码(2种方法) 2.修改mysql管理员账号root 3.mysql管理员root账号密码遗忘解决办法(2种方法 ...