TypeScript 语言中的函数参数

形参和实参

形参的使用

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

// 形参的使用
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 解构展开传入其中。