• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

TypeScript语言中的函数参数

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

形参和实参

形参的使用

函数定义的时候写的参数是形参。从字面意义上我们可以看出,形参就是形式上的参数。我们定义了形参也就规定了此函数的参数个数和参数类型,规范了函数。

// 形参的使用
function searchFriend(age:number):string{
    return `找到了${age}岁的小姐姐`
}
形参的使用

searchFriend 函数中定义了一个形参 age,类型为数值类型 number。

实参的使用

调用函数时传递的具体值就是实参。同样从字面理解,实参就是真实的参数,我们在使用的时候,具体真实传递过去的就是实参。

// 形参的使用
function searchFriend(age:number):string{
    return `找到了${age}岁的小姐姐`
}

// 实参
var age:number = 18
// 实参的使用
var result:string = searchFriend(age)

console.log(result) // 找到了18岁的小姐姐
实参的使用

var age 就是一个实参,是个具体数值 number 18,配合 searchFriend 函数使用而定义、传递的参数

注意

在函数调用的时候,我们需要按照形参的规则传递实参,有几个形参就要传递几个实参,并且每一个实参的类型要与对应的形参类型一致。

TypeScript语言中的函数参数

TypeScript的函数参数是比较灵活的,它不像那些早起出现的传统语言那么死板。在TypeScript语言中,函数的形参分为:可选形参、默认形参、剩余参数形参等。

1.有可选参数的函数

可选参数,就是我们定义形参的时候,可以定义一个可传可不传的参数。这种参数,在定义函数的时候通过?标注出来。

// 可选参数函数
function searchFriend(age:number,stature?:string):string{
    let yy:string = ''
    yy = `找到了${age}岁`
    if (stature!=undefined) {
        yy = yy + stature
    }
    return `${yy}的小姐姐`
}

var result:string = searchFriend(22)
console.log(result) // 找到了22岁的小姐姐

var result:string = searchFriend(22, '大长腿')
console.log(result) // 找到了22岁大长腿的小姐姐
可选参数函数

searchFriend 函数中 stature 就是一个可选参数,可以看到在传递实参时,此参数可传可不传。

2.有默认参数的函数

有默认参数就更好理解了,就是我们不传递实参的时候,函数自己会设置有一个默认值,而不是 undefined

// 默认参数函数
function searchFriend(age:number=18,stature:string='大眼睛'):string{
    let yy:string = ''
    yy = `找到了${age}岁`
    yy = yy + stature
    return `${yy}的小姐姐`
}

var result:string = searchFriend()
console.log(result) // 找到了18岁大眼睛的小姐姐
默认参数函数

searchFriend 函数中 age 和 stature 参数现在都设置有默认值,使用函数时 () 中未传入参数,也相当于已经传入实参 18,‘大眼睛’。

但是现在我还想要找到之前那个 22 岁的大长腿小姐姐怎么办?

此时只需再次传入实参即可替换

// 默认参数函数
function searchFriend(age:number=18,stature:string='大眼睛'):string{
    let yy:string = ''
    yy = `找到了${age}岁`
    yy = yy + stature
    return `${yy}的小姐姐`
}

var result:string = searchFriend()
console.log(result) // 找到了18岁大眼睛的小姐姐

var result:string = searchFriend(22, '大长腿')
console.log(result) // 找到了22岁大长腿的小姐姐
默认参数函数传入实参

3.未知数目参数的函数

有时候我们有这样的需求,我传递给函数的参数个数不确定。

// 未知数目参数函数
function searchFriend(...xuqiu:string[]):string{
    let yy:string = '找到了'
    for (let i = 0, len = xuqiu.length;i < len;i++) {
        yy = yy + xuqiu[i]
        if (i + 1 < xuqiu.length) {
            yy = yy + '、'
        }
    }
    
    yy = `${yy}的小姐姐`

    return yy
}

var result:string = searchFriend('22岁', '大眼睛', '瓜子脸', '大长腿')
console.log(result) // 找到了22岁、大眼睛、瓜子脸、大长腿的小姐姐
未知数目参数函数

把传入的参数定义为一个数组,使用了 es6 解构展开传入其中。

原文地址:http://jspang.com/post/typescript.html?tdsourcetag=s_pcqq_aiomsg


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
VueCli3TypeScript搭建工程发布时间:2022-07-18
下一篇:
TypeScript函数相关类型发布时间:2022-07-18
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap