目录:
- Typescript 学习笔记一:介绍、安装、编译
- Typescript 学习笔记二:数据类型
- Typescript 学习笔记三:函数
- Typescript 学习笔记四:回忆Es5 中的类
- Typescript 学习笔记五:类
- Typescript 学习笔记六:接口
- Typescript 学习笔记七:泛型
函数的定义
- ES5 函数定义:函数声明、匿名函数、传参
// 函数声明
function fn1 () {
return 123;
}
fn1(); // 调用
// 匿名函数
let fn2 = function () {
console.log(456);
}
fn2();
// 传参
function fn3 (name, age) {
return `姓名:${name},年龄:${age}`;
}
fn3('张三', 25);
- ts 函数定义:函数声明、匿名函数、传参
// 函数声明
function fn1 ():number { // number 是函数返回值类型,没有返回值为 void
return 123;
}
fn1();
// 匿名函数
let fn2 = function ():void {
console.log(456);
}
fn2();
// 传参
function fn3 (name:string, age:number):string {
return `姓名:${name},年龄:${age}`;
}
fn3('张三', 25);
可选参数
ES5 里面方法的实参和行参可以不一样,但是 ts 中必须一样,如果不一样就需要配置可选参数。
注意:可选参数必须配置到参数的最后面
function getInfo (name:string, age?:number):string { // age 为可选参数
if (age) {
return `姓名:${name},年龄:${age}`;
} else {
return `姓名:${name},年龄:保密`;
}
}
console.log(getInfo('张三', 23));
console.log(getInfo('李四'));
// 错误的写法
function getInfo (name?:string, age:number):string { // name 为可选参数
if (name) {
return `姓名:${name},年龄:${age}`;
} else {
return `姓名:不知道,年龄:${age}`;
}
}
console.log(getInfo('李四', 23));
默认参数
ES5 里面没法设置默认参数,ES6 和 ts 中都可以设置默认参数。
function getInfo (name:string, age:number=25):string { // age 默认为25
if (age) {
return `姓名:${name},年龄:${age}`;
} else {
return `姓名:${name},年龄:保密`;
}
}
console.log(getInfo('张三', 23)); // 姓名:张三,年龄:23
console.log(getInfo('李四')); // 姓名:李四,年龄:25
剩余参数
ES6 中的三点运算符
function sum (a:number, b:number, ...nums:number[]):number {
let sum = a + b;
nums.forEach((n) => {
sum += n;
});
return sum;
}
console.log(sum(1, 2, 3, 4, 5, 6)); // 21
函数重载
java 中方法的重载:重载指的是两个或者两个以上同名函数,但它们的参数不一样,这时会出现函数重载的情况。
Typescript 中的重载:通过为同一个函数提供多个函数类型定义来实现多种功能的目的。
ts 为了兼容 ES5 以及 ES6 重载的写法和 java 中有区别。
ES5 中出现同名方法,下面的会替换上面的方法。
function getInfo (name) {
}
function getInfo (name, age) {
}
ts 中的重载
// 单个参数,不同类型
function getInfo (name:string):string;
function getInfo (age:number):string;
function getInfo (str:any):any {
if (typeof str === 'string') {
return `姓名:${str}`;
} else {
return `年龄:${str}`;
}
}
getInfo('张三');
getInfo(25);
getInfo(true); // 错误的写法
// 多个参数,可选参数
function getInfo (name:string):string;
function getInfo (name:string, age:number):string;
function getInfo (name:string, age?:number):string {
if (age) {
return `姓名:${str},年龄:${str}`;
} else {
return `姓名:${str}`;
}
}
getInfo('张三');
getInfo(25); // 错误
getInfo('李四', 26);
箭头函数
同 ES6 中一样,修复 this 指向的问题,箭头函数里面的 this 指向上下文,即外层第一个不为箭头函数的 this。
Typescript 学习笔记三:函数的更多相关文章
-
python学习笔记三 函数(基础篇)
函数 内置函数 常用的内建函数: type() 列出指定对象的类型 help() 能够提供详细的帮助信息 dir() 将对象的所有特性列出 vars() 列出当前模块的所有变量 file, ...
-
Typescript 学习笔记七:泛型
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
-
Typescript 学习笔记六:接口
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
-
Typescript 学习笔记五:类
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
-
Typescript 学习笔记四:回忆ES5 中的类
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
-
Typescript 学习笔记二:数据类型
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
-
Typescript 学习笔记一:介绍、安装、编译
前言 整理了一下 Typescript 的学习笔记,方便后期遗忘某个知识点的时候,快速回忆. 为了避免凌乱,用 gitbook 结合 marketdown 整理的. github地址是:ts-gitb ...
-
ES6学习笔记<;三>; 生成器函数与yield
为什么要把这个内容拿出来单独做一篇学习笔记? 生成器函数比较重要,相对不是很容易理解,单独做一篇笔记详细聊一聊生成器函数. 标题为什么是生成器函数与yield? 生成器函数类似其他服务器端语音中的接口 ...
-
MYSQL学习笔记三:日期和时间函数
MYSQL学习笔记三:日期和时间函数 1. 获取当前日期的函数和获取当前时间的函数 /*获取当前日期的函数和获取当前时间的函数.将日期以'YYYY-MM-DD'或者'YYYYMMDD'格式返回 */ ...
随机推荐
-
Kubernetes系统架构简介--转
原文地址:http://www.infoq.com/cn/articles/Kubernetes-system-architecture-introduction?utm_campaign=infoq ...
-
【转】Android开发之Bitmap的内存优化详解
本文来源:转载自: http://mobile.51cto.com/abased-410796.htm 在Android应用里,最耗费内存的就是图片资源.而且在Android系统中,读取位图Bitma ...
-
UICollectionView设置item(cell)之间间距为0(紧挨在一起的效果)
UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init]; self.layout = layout ...
-
转:A10/A20 Bootloader加载过程分析
来自:http://blog.csdn.net/allen6268198/article/details/12905425 A10/A20 Bootloader加载过程分析 注:由于全志A10和A20 ...
-
[置顶] oracle 数据库表中转换成java代码
--数据库中字段java代码 select col.TABLE_NAME,replace(initcap(col.TABLE_NAME),'_', '') , 'private '||decode ...
-
【框架学习与探究之消息队列--EasyNetQ(1)】
前言 本文欢迎转载,实属原创,本文原始链接地址:http://www.cnblogs.com/DjlNet/p/7603554.html 废话 既然都是废话了,所以大家就可以跳过了,这里是博主有事没事 ...
-
Linux共享内存编程实例
/*共享内存允许两个或多个进程进程共享同一块内存(这块内存会映射到各个进程自己独立的地址空间) 从而使得这些进程可以相互通信. 在GNU/Linux中所有的进程都有唯一的虚拟地址空间,而共享内存应用编 ...
-
iOS transform属性的使用
1.transform属性 在iOS开发中,通过transform属性可以修改UIView对象的平移.缩放比例和旋转角度,常用的创建transform结构体方法分两大类 (1) 创建“基于控件初始位置 ...
-
ASP.Net Core 运行错误 Http Error 502.5 解决办法
Http Error 502.5 - Process Failure 如果你看到上面这张图片了的话,说明你在本地运行的时候报错了. 尤其好多都是我的群友,说下情况. 这个一般是本地的.NET Core ...
-
python读写csv时中文乱码问题解决办法
https://www.cnblogs.com/shengulong/p/7097869.html 参考1 参考2 参考3 CSV是英文Comma Separate Values(逗号分隔值)的缩写, ...