typeScript中的函数

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了typeScript中的函数相关的知识,希望对你有一定的参考价值。

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

我们先来回忆一下JavaScript的函数,有匿名函数和有名字的函数,和JavaScript一样,TypeScript函数可以创建有名字的函数和匿名函数。 你可以随意选择适合应用程序的方式,不论是定义一系列API函数还是只使用一次的函数。

在JavaScript里,函数可以使用函数体外部的变量。 当函数这么做时,我们说它‘捕获’了这些变量。

以上是JavaScript定义函数的方法,接下来就是ts里面定义函数的方法

定义的是什么返回类型,返回类型必须和定义的一致,不然会报错,举个错误的例子:

我们再来看下怎么定义匿名函数:(和定义有名函数一样,根据定义的类型返回相应的类型)

有名函数的传参:

匿名函数传参:

这里再拓展说明一下,还有一种,是不会有返回值的方法:

es5里面的方法的实参和形参可以不一样,但是ts中必须一样,如果不一样就要配置可选参数。
那么上面这句话是什么意思呢,我们来举个例子:假如说,我们现在要传名字和年龄,那我如果不想传年龄过去,我们可以怎么写呢

es5里面没法设置默认参数,es6和ts中都可以设置默认参数。
这个默认参数和上面的可选参数类似,你称为默认可选参数都可以。

有时,你想同时操作多个参数,或者你并不知道会有多少参数传递进来。 在JavaScript里,你可以使用arguments来访问所有传入的参数。
在TypeScript里,你可以把所有参数收集到一个变量里。
首先,大家可以看下面的一个例子:

再比如说,下面的这种情况,一一对应关系,a = 1,b=2,那么result数组就是[3,4],所以我们最后得到的和是和上面的sum1函数一样的。

java中方法的重载,重载指的是两个或者两个以上同名函数,但它们的参数不一样,这是会出现函数重载的情况。
typeScript中的重载,通过为同一个函数提供多个函数类型定义来试下多种功能的目的。
ts为了兼容es5,以及es6重载的写法和java中有区别

我们还能最拓展一下,巩固记忆:

箭头函数里面的this,指向的是上下文

这个箭头函数,没什么要说的,就和之前的一样

本文的最后按照惯例来推荐歌曲了,周杰伦的《手写的从前》,希望你能对那个人说出,“我想我属于一个拥有你的未来,你是我未来的规划之一”,我们下一章再见。

Typescript中的函数定义语法混淆

【中文标题】Typescript中的函数定义语法混淆【英文标题】:function definition syntax confuse in Typescript 【发布时间】:2016-03-07 07:43:00 【问题描述】:

全部:

[UPDATE] 我想通了:SO 中的一篇文章解释了这一点: In TypeScript how do I declare an array of functions that accept a string and return a string? 事实证明:

形式的函数类型字面量

( 参数列表 ) => 返回类型

完全等价于对象类型字面量

( ParamList ) : ReturnType

所以,冒号: 带括号 箭头=>


我对 Typescript 很陌生,有一个例子让我对它的语法感到困惑:

var sayHello: (input: string) : string = function (s: string) 
    return "Hello " + s;

var stringUtils:  (input: string): string; [];
stringUtils.push(sayHello);

谁能帮忙解释一下这段代码的作用?尤其是第一部分的定义是做什么的?

var sayHello: (input: string) : string = function (s: string) 
    return "Hello " + s;

示例说 sayHello 是一个函数变量,但是当我运行它时,我得到了“=>”预期的错误,这是否意味着该语法属于旧 typescript 但现在不存在?

谢谢

【问题讨论】:

我实际上什至不确定这是有效的 TypeScript ......?当我将它粘贴在这里时,它似乎不起作用:typescriptlang.org/Playground @Katana314 谢谢,我这边都没有,所以基本上可能是错字? 这就是意图吗? var sayHello: (input: string) => string = function (s: string) return "Hello " + s; 。在深入解释之前得到确认会很好 @Katana314 不确定,但我想是的。这来自一本名为“Typescript Revealed”(Pub. 2013)的书,它使用这个例子来说明为什么我们需要接口 如果您正在阅读的书一直有语法错误,您应该找另一本书...? 【参考方案1】:

谁能帮忙解释一下这段代码的作用?特别是第一部分定义的作用 var sayHello: (input: string) : string = function (s: string)

应该是:

var sayHello: (input: string) => string = function (s: string) 

我们说sayHello 是一个接受字符串并返回字符串: (input: string) => string 的函数。然后我们把它赋值给这样一个函数= function (s: string)

【讨论】:

谢谢,我正在阅读您建议的 gitbook。让我困惑的一件事是接口的定义,我想知道如何定义一个带有字符串成员的接口和一个带有一个字符串参数的函数成员并返回字符串? 我从这篇文章中读到:blogs.msdn.com/b/typescript/archive/2013/01/24/… 在接口内指定函数时,不知道为什么这次可以使用冒号? (在基本部分:它使用接口 Greetable greet(message: string): void; ) @Kuan 区别在这里:***.com/questions/32043487/… 它只是一个属性简写

以上是关于typeScript中的函数的主要内容,如果未能解决你的问题,请参考以下文章

typeScript中的函数

TypeScript 中的函数重载

Typescript中的函数定义语法混淆

Javascript/TypeScript 中的 Azure 函数:如何做?

接口中的 TypeScript 可选函数

TypeScript-函数