从C#到TypeScript - function

从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);

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏程序人生

谈谈数据结构

沃斯大神说过,程序 = 算法 + 数据结构。 程序君认为,等式的右边,数据结构的权重要大于算法。数据结构定义好,基本上,你所用的算法也就确定了,算法的时间复杂度...

3347
来自专栏Albert陈凯

2018-04-17 Java的Collection集合类3分钟搞掂Set集合前言

3分钟搞掂Set集合 前言 声明,本文用的是jdk1.8 现在这篇主要讲Set集合的三个子类: HashSet集合 A:底层数据结构是哈希表(是一个元素为链...

2867
来自专栏大数据学习笔记

Hadoop基础教程-第11章 Hive:SQL on Hadoop(11.4 数据类型和存储格式)(草稿)

第11章 Hive:SQL on Hadoop 11.4 数据类型和存储格式 11.4.1 数据类型 (1)基本类型 Hive 支持关系型数据中大多数基本数...

1729
来自专栏java一日一条

Web性能优化系列:10个JavaScript性能提升的技巧

Nicholas Zakas是一位 JS 大师,Yahoo! 首页的前端主程。他是《高性能 Javascript》的作者,这本书值得每个程序员去阅读。

522
来自专栏温安适的blog

Java8并行流写WordCount,并不简单

36010
来自专栏JadePeng的技术博客

MarkDown 常用语法教程

MarkDown 语法说明 [TOC] 标题 标题1 ====== 标题2 ----- ## 大标题 ### 小标题 #### 小标题 列表 无序列表 ...

2524
来自专栏醒者呆

Knowledge_SPA——精研查找算法

首先保证这一篇分析查找算法的文章,气质与大部分搜索引擎搜索到的文章不同,主要体现在代码上面,会更加高级,会结合到很多之前研究过的内容,例如设计模式,泛型等。这...

2565
来自专栏河湾欢儿的专栏

网页布局类型

1.定宽布局 2.响应式布局 流式布局(就像水一样,其实就是按照百分比布局 https://m.jd.com/ http://m.sohu.com/) ...

763
来自专栏黑白安全

Mysql索引类型Btree和Hash的区别以及使用场景

遇到单表数据量大的时候很多开发者都会想到给相对的字段建立索引来提高性能(mysql索引的使用),但很少会去关注索引的类型该如何选择,在mysql中支持有两种类型...

1433
来自专栏java一日一条

Java 枚举查找并不抛异常的实现

Java Enum是一个非常有用的功能,但很多人通常并不能充分利用,这是因为一些库不会优先择用该功能。通常我们也可以正确使用Java枚举功能,但在许多代码库中往...

673

扫码关注云+社区