总目录

从C#到TypeScript - function

虽然TypeScript里有了类,但JavaScript的function也还在,这也是和C#的不同所在。

C#里函数不能脱离类工作,但TypeScript的function和JavaScript一样,可以单独工作。

函数类型

函数和C#一样可以有名字,也可以是匿名函数,匿名函数有两种写法:

function checkLogin(name: string, pwd: string): boolean{
return true;
} let checkLogin = (name: string, pwd: string) => {
return false;
} let checkLogin = function(name: string, pwd: string){
return true;
}

前面文章写变量声明时有写变量类型let str: string,但上面其实都没有把函数的类型真正写出来,比如最后一个let checkLogin里并没有标明返回的类型。

如果要把函数做为参数或返回值的话如果没有明确类型的话使用会很不方便,没有智能提示,重构也不方便。

函数的返回类型其实就是由参数+返回类型构成,下面代码的(name: string, pwd: string) => boolean就是checkLogin的返回类型。

let checkLogin: (name: string, pwd: string) => boolean = function(name: string, pwd: string){
return true;
}

返回类型里的参数名不需要与真正的参数名一致,只需要类型一致即可。

当然,大部分情况下是不用写这么复杂的返回类型的,前面文章有说过类型推论,TypeScript会根据上下文推论出返回值的类型。

函数参数

TypeScript的参数和JavaScript的参数不太一样,调用JavaScript函数的参数可以多或少都可以,但TypeScript里函数需要确保传入参数的个数和定义的一致。

同C#里的函数参数可以有默认值一样,TypeScript也支持,并且还支持可空参数。

默认值只需要在参数后面写上=某值就可以,默认值参数可以在任意位置,不过在必须参数前面时,想用默认值的话需要传undefined

可空参数和前面说的可空属性一样,参数名后加?号,可空参数必须是在最后面。

function checkLogin(name: string, pwd: string, isAdmin: boolean = false, email?: string){
console.info(isAdmin);
} checkLogin('brook'); // 编译不了
checkLogin('brook', '123456'); // false
checkLogin('brook', '123456', undefined); // false
checkLogin('brook', '123456', false); // false
checkLogin('brook', '123456', true, 'brook@email.com'); // true

剩余参数

JavaScript里的参数本身是个数组,可以是任意个数且都可以在函数体内用arguments来访问。

TypeScript同样可以通过剩余参数来支持,形式上类似于C#的param

剩余参数的格式是...restParam: string[]

function checkLogin(name: string, pwd: string, ...others: string[]){
console.info(others.join(' '));
} checkLogin('brook', '123456', 'brook@email.com', `12800`); // brook@email.com 12800

this

this在JavaScript里总是指向调用者,这点经常容易导致被坑,在ES6之前经常需要类似var self = this来把this保存下来。

ES6和TypeScript针对这点做了改进,使用箭头函数可以把创建函数时的this自动保存下来。

let permission = {
name: 'brook', checkLogin: function() {
return function() {
console.info(this.name === 'brook');
}
}
}; permission.checkLogin()(); // 出错, this为undefined let permission = {
name: 'brook', checkLogin: function() {
return () => {
console.info(this.name === 'brook');
}
}
}; permission.checkLogin()(); // 通过,因为用了箭头函数

不过上面的this还是有个缺点,得到的thisany类型,这样重构起来会不方便,这时可以用this参数来改进:

this参数只是一种定义,使用时是不需要传的。

interface Permission{
name: string;
checkLogin(this: Permission): ()=>void;
} let permission: Permission = {
name: 'brook', checkLogin: function(this: Permission) {
return () => {
console.info(this.name === 'brook'); //这里的this不是any,而是Permission
}
}
}; permission.checkLogin()();

这样也倒逼着定义好类型,发挥TypeScript强类型的优势。

泛型函数

同C#一样支持泛型函数,写法也差不多。

function deserialize<T>(content: string): T { }

function addItem<TKey, TValue>(key: TKey, value: TValue) { }

也支持泛型约束,C#用的是where T: object,而TypeScript用的是extends Object

function deserialize<T extends Object>(content: string): T { }

泛型函数类型比普通函数类型在前面多了个<T>,比如上面deserialize

let deserialize: <T>(content: string) => T;

但这样如果做为参数就略显复杂,可以用接口重构下:

function deserialize<T extends Object>(content: string): T { }

interface serializable<T> {
(content: string): T;
} function parse<T>(s: serializable<T>){ } parse(deserialize);

从C#到TypeScript - function的更多相关文章

  1. TypeScript Function(函数)

    在JavaScript中,函数是构成任何应用程序的基础块.通过函数,你得以实现建立抽象层.模仿类.信息隐藏和模块化.在TypeScript中,虽然已经存在类和模块化,但是函数依旧在如何去"处 ...

  2. [TypeScript] Function Overloads in Typescript

    It's common in Javascript for functions to accept different argument types and to also return differ ...

  3. [Typescript] Function defination

    Define a function type and params type: // The function init // Accept two params which are both typ ...

  4. TypeScript之接口类型

    Interfaces 作为TypeScript中的核心特色之一,能够让类型检查帮助我们知道一个对象应该有什么,相比我们在编写JavaScript的时候经常遇到函数需要传递参数,可能在编写的时候知道这个 ...

  5. TypeScript之基本数据类型

    前言 最近项目很急,所以没有什么时间回答关于Xamarin.Android方面的问题,也有一段时间没有更新.主要是手头很缺人,如果有谁有兴趣加入我们的话,可以私聊我,这样我就能继续造福社区了,同时还有 ...

  6. 基本数据类型TypeScript

    TypeScript 前言 最近项目很急,所以没有什么时间回答关于Xamarin.Android方面的问题,也有一段时间没有更新.主要是手头很缺人,如果有谁有兴趣加入我们的话,可以私聊我,这样我就能继 ...

  7. C# vs TypeScript - 高级类型

    总目录 从C#到TypeScript - 类型 从C#到TypeScript - 高级类型 从C#到TypeScript - 变量 从C#到TypeScript - 接口 从C#到TypeScript ...

  8. 从C#到TypeScript - 变量

    总目录 从C#到TypeScript - 类型 从C#到TypeScript - 高级类型 从C#到TypeScript - 变量 从C#到TypeScript - 接口 从C#到TypeScript ...

  9. 从C#到TypeScript - 接口

    总目录 从C#到TypeScript - 类型 从C#到TypeScript - 高级类型 从C#到TypeScript - 变量 从C#到TypeScript - 接口 从C#到TypeScript ...

随机推荐

  1. 调用图灵机器人API实现Android智能机器人

    非常感谢CSDN博客上的鸿洋哥,他贴出的源码是我所做的工作的基础,鸿洋哥博客链接http://blog.csdn.net/lmj623565791/article/details/38498353 下 ...

  2. iOS中UITextField 使用全面解析 分类: ios技术 2015-04-10 14:37 153人阅读 评论(0) 收藏

    //初始化textfield并设置位置及大小   UITextField *text = [[UITextField alloc]initWithFrame:CGRectMake(20, 20, 13 ...

  3. List学习笔记

    List 特点:1.有序.2.可重复. ArrayList: 底层是数组,数组是有下标的. 会自动扩容,底层默认初始化容量是10,扩大之后的容量预设是原来容量的一半(jdk 1.8).以前好像是原容量 ...

  4. js盒子模型

    1.js盒子模型 指的是通过js中提供的一系列的属性和方法,获取页面中元素的样式信息值 例: #box有很多自己的私有属性: HTMLDivElement.prototype->HTMLElem ...

  5. object 类 toString() 和 equals() 的覆写

    基本作用: objiect类是所有类的父类. 任何一个类定义的时候如果没有明确定义了父类的话,默认父类是Object类. class A extends Object{} 在整个java里面,类的继承 ...

  6. VS2010中出现无法嵌入互操作类型(转)

    针对word或excel操作时,出现VS2010中,无法嵌入互操作类型“……”,请改用适用的接口的解决方法问了度娘,解决方法如出一辙:选中项目中引入的dll,鼠标右键,选择属性,把“嵌入互操作类型”设 ...

  7. 关于js中window.location.href,location.href,parent.location.href,top.location.href用法

    "window.location.href"."location.href"是本页面跳转 "parent.location.href"是上一 ...

  8. 一点养老APP模式定制系统平台源码

    一点养老APP模式定制系统开发:136.1013.1824电/微:搭建一点养老APP模式定制系统平台.专注于为企业和商家客户提供基于腾讯微信公众平台系统程序和APP等开发服务,中国养老金融50人论坛2 ...

  9. --@angularJS--一个最简单的指令demo

    <!DOCTYPE HTML><html ng-app="app"><head>    <title>custom-directiv ...

  10. Eclipse 打开文件所在文件夹

    右击文件 > Show In > System Explorer