编程都是需要函数的,因为有了函数就能复用很多东西了。不仅仅能够复用代码,还能保持代码的简洁性和提高编程的逻辑性。

在原生的JavaScript中,函数的定义有三种,

function foo() {} // 直接声明
var foo = function() {} // 将函数赋值给变量
var Foo = {
a : function() { }
} // 对象函数

那么在typescript当中,又是怎么样的呢?

1、第一种

function foo():string {
return 'hahaha'
}
var result = foo() // hahaha

这是普通的函数声明,直接返回hahaha

2、第二种,形参

function foo(a:number):string {
return '这个数字是' + a
}
var result = foo(18) // 这个数字是18

foo():string,后面的变量告诉该函数返回的是什么值,如果是string则返回的是string类型,如果是:number则返回的是number类型,如果不写,则默认为void类型。

在函数当中,在大括号里写的变量代表的是形参。

正如上诉代码

function foo(a:number):string () {

}
// a:number 代表的是形参 var result = foo(18) // 18代表的是实参,实际传入的参数

凡是有一定的JavaScript基础我们都知道,函数体写了几个形参,就必须传入几个参数,多一个少一个都不行,但是,在typescript中,可以选择性的传实参,这点是比较灵活。

有可选参数的函数,采用?标注

function person(age:number, name?:string) {

    let a:string = ''
a = "find" + age + 'years old' if(name != undefined) {
a = a + '' +name
} return a + 'person'
} var result = person(18); // find 18 years old
var result1 = person(18, 'does');
// find 18 does years old console.log(result);
console.log(result1);

由上诉的例子可以知道,name作为可选参数,是可传可不传的。体现typescript的灵活性。

返回指定类型的函数

同样的,我们也可以给函数增加一个默认的返回参数。

同样复用上面的代码。

function person(age:number, name?:string):string {

    let a:string = ''
a = "find" + age + 'years old' if(name != undefined) {
a = a + '' +name
} return a + 'person'
} var result = person(18); // find 18 years old
var result1 = person(18, 'does');
// find 18 does years old console.log(result);
console.log(result1);

在大括号后面增加:string,默认返回的是string类型的参数

不限参数个数的函数

简单的理解就是,出去逛街的时候,你可以会买一个商品,也可能会买多个商品。所以此时的函数是不确定性的。比如写一个shopping函数

function shopping(...type:string[]):string {

    let a:string = "我买到了"
for(let i = 0; i < type.length; i++) {
a = a + type[i]
if(i<type.length) {
a = a + ','
}
}
a = a + "商品"
return a
} // 传参数的时候就可以多个传值了
var result:string = shopping("包","衣服","裤子")
console.log(result)

Typescript函数的更多相关文章

  1. TypeScript 函数 (五)

    传递给一个函数的参数个数必须与函数期望的参数个数一致. 参数类别: 必须参数 可选参数 :可选参数必须在参数后面. 默认参数 :当用户没有传递这个参数或传递的值是undefined时. 它们叫做有默认 ...

  2. TypeScript入门三:TypeScript函数类型

    TypeScript函数类型 TypeScript函数的参数 TypeScript函数的this与箭头函数 TypeScript函数重载 一.TypeScript函数类型 在上一篇博客中已经对声明Ty ...

  3. typeScript函数篇

    typeScript的函数是在es6的函数特性的基础上加了一些后端的概念:泛型.参数类型声明.返回值类型声明.重载.装饰器等.其他的一些特性:箭头函数.生成器.async-await.promise等 ...

  4. typescript函数(笔记非干货)

    函数类型 Function Type 为函数定义类型 Define types for functions 我们可以给每个参数添加类型之后再为函数本身添加返回值类型. TypeScript能够根据返回 ...

  5. TypeScript 函数-函数类型

    //指定参数类型 function add(x:number,y:number){ console.log("x:"+x); // reutrn(x+y); } //指定函数类型 ...

  6. typescript函数类型接口

    /* 接口的作用:在面向对象的编程中,接口是一种规范的定义,它定义了行为和动作的规范,在程序设计里面,接口起到一种限制和规范的作用.接口定义了某一批类所需要遵守的规范,接口不关心这些类的内部状态数据, ...

  7. typescript 函数(定义、参数、重载)

    代码: // 本节内容 // 1.函数的定义 // 2.参数(可选参数/默认参数/剩余参数) // 3.方法的重载 // js // function add(x,y){ // return x+y ...

  8. TypeScript 函数-重载

    function attr(name:string):string; function attr(age:number):string; function attr(nameorage:any):an ...

  9. TypeScript 函数-Lambads 和 this 关键字的使用

    let people = { name:["a","b","c","d"], /* getName:function() ...

随机推荐

  1. excel展示

  2. Python入门学习网址

    Python入门学习网址:http://www.runoob.com/python/python-install.html

  3. codeforces 932E Team Work(组合数学、dp)

    codeforces 932E Team Work 题意 给定 \(n(1e9)\).\(k(5000)\).求 \(\Sigma_{x=1}^{n}C_n^xx^k\). 题解 解法一 官方题解 的 ...

  4. Linux中如何配置sudo用户

    Linux中的sudo文件在/etc/sudoers,但不建议直接修改此文件: 可以在/etc/sudoers.d文件夹中新建文件,文件名随意,在文件中添加内容如下: 用户名 ALL=(ALL) AL ...

  5. 使用JAVA进行排序

    利用JAVA完成排序 当我们在进行数据库进行查询的时候,当需要按某个字段来进行排序的时候,可以使用SQL语句来完成排序,可以升序,也可以降序.JAVA中的Collections类也可以完成这种操作,S ...

  6. BZOJ 1192 鬼谷子的钱袋 找规律

    题目链接: https://www.lydsy.com/JudgeOnline/problem.php?id=1192 题目大意: 鬼谷子非常聪明,正因为这样,他非常繁忙,经常有各诸侯车的特派员前来向 ...

  7. calayer 的特殊属性整理

    calayer: An object that manages image-based content and allows you to perform animations on that con ...

  8. 【[APIO2010]巡逻】

    \(APIO\)的题就是非常难啊 首先看到\(k=1\)的情况,显然我们只需要找到一条直径把这条直径的两端连起来就好了 因为我们连这一条新边的实质是使得这一条链上的边不需要重复经过了,我们想让走的边尽 ...

  9. 《metasploit渗透测试魔鬼训练营》学习笔记第六章--客户端渗透

    四.客户端攻击      客户端攻击与服务端攻击有个显著不同的标识,就是攻击者向用户主机发送的恶意数据不会直接导致用户系统中的服务进程溢出,而是需要结合一些社会工程学技巧,诱使客户端用户去访问这些恶意 ...

  10. vue-scroll 底部无数据时,底部出现大片的空白

    vue-scroll放在vue的项目中,实现下拉刷新的效果,但是发现,不能上拉的bug,上拉了之后,底部出现了一大段的空白,参照GitHub的问题,算是暂时解决了. 不能上拉的原因是:滑动标签里边的内 ...