周金荣 發表於 2022-1-22 20:34:00

TypeScript的函数(方法)

<p align="center"><strong>TypeScript的函数(方法)</strong></p>
<p><strong>一、函数的定义</strong></p>
<p><strong>&nbsp;&nbsp;&nbsp;<span style="font-family: 微软雅黑">1、声明式</span></strong></p>
<p>function&nbsp;getInfo(name: string, age: number) : string&nbsp;{</p>
<p>&nbsp; &nbsp; return&nbsp;`I am ${name}&nbsp;and I am ${age}&nbsp;years old`</p>
<p>}</p>
<p>ts在传参时都会规定参数的类型,还有它返回值的类型也会在函数执行之前都已经规定好,如果传参的类型和返回值的类型不符合,ts编译会报错。</p>
<p><strong>2、匿名函数</strong></p>
<p>const&nbsp;getInfo&nbsp;= function(name: string, age: number):string&nbsp;{</p>
<p>&nbsp; &nbsp; return&nbsp;`I am ${name}&nbsp;and I am ${age}&nbsp;years old`</p>
<p>}</p>
<p><strong>二、函数中的参数</strong></p>
<p><strong>&nbsp;&nbsp;&nbsp;&nbsp;</strong><strong>1、</strong><strong><span style="font-family: 微软雅黑">默认参数</span>(</strong><strong>传入值会覆盖默认参数,不传值也行</strong><strong>)</strong></p>
<p>function&nbsp;getinfo(name:string,age:number=20):string{</p>
<p>&nbsp; &nbsp; return&nbsp;`${name}---${age}`</p>
<p>}</p>
<p>console.log(getinfo("张三"));//打印出:张三 20</p>
<p>console.log(getinfo("张三",30));//打印出:张三 30</p>
<p class="p"><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="font-family: 微软雅黑">2、</span></strong><strong>可选参数(</strong><strong>可以传可选的值也可以不用传,但是可选的参数必须放在参数列表的最后</strong><strong>)</strong></p>
<p>function&nbsp;getinfo1(name:string,age?:number):string{</p>
<p>&nbsp; &nbsp; if(age){</p>
<p>&nbsp; &nbsp; &nbsp; &nbsp; return&nbsp;`${name}---${age}`&nbsp;&nbsp;</p>
<p>&nbsp; &nbsp; }else{</p>
<p>&nbsp; &nbsp; &nbsp; &nbsp; return&nbsp;`${name}---年龄保密`</p>
<p>&nbsp; &nbsp; }</p>
<p>}</p>
<p>console.log(getinfo1("张三"));//打印出:张三 年龄保密</p>
<p>console.log(getinfo1("张三",30));//打印出:张三 30</p>
<p class="p"><strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</strong><strong>3、剩余参数:</strong><strong><span style="font-family: 微软雅黑">利用</span>es6的三点运算符(</strong><strong>相当于把参数赋值给一个数组,然后用循环遍历这个数组</strong><strong>)</strong></p>
<p>function&nbsp;sum1(...result:number[]):number{</p>
<p>&nbsp; &nbsp; var&nbsp;sum=0;</p>
<p>&nbsp; &nbsp; for(let&nbsp;i=0;i&lt;result.length;i++){</p>
<p>&nbsp; &nbsp; &nbsp; &nbsp; sum+=result;</p>
<p>&nbsp; &nbsp; }</p>
<p>&nbsp; &nbsp; return&nbsp;sum;</p>
<p>}</p>
<p>console.log(sum1(1,2,3,4,5));//15</p>
<p>console.log(sum1(1,2,3,4,5,6));//21</p>
<p class="p"><strong>&nbsp;&nbsp;&nbsp;&nbsp;</strong><strong>或者(</strong><strong><span style="font-family: 微软雅黑">把传进来的第一个参数赋值给</span>a,后面的放进数组</strong><strong>)</strong></p>
<p>function&nbsp;sum1(a:number,...result:number[]):number{</p>
<p>&nbsp; &nbsp; var&nbsp;sum=a;</p>
<p>&nbsp; &nbsp; for(let&nbsp;i=0;i&lt;result.length;i++){</p>
<p>&nbsp; &nbsp; &nbsp; &nbsp; sum+=result;</p>
<p>&nbsp; &nbsp; }</p>
<p>&nbsp; &nbsp; return&nbsp;sum;</p>
<p>}</p>
<p>console.log(sum1(1,2,3,4,5));//15</p>
<p>console.log(sum1(1,2,3,4,5,6));//21</p>
<p><strong>三、</strong><strong>函数</strong><strong>的返回值</strong></p>
<p><strong>1、没有返回值的函数</strong></p>
<p>function&nbsp;getInfo(name:string, age:number):void{</p>
<p>&nbsp; &nbsp; console.log(`hello${name}`)</p>
<p>}</p>
<p><span style="font-family: 微软雅黑">当函数不需要</span>return返回数据时,这个函数的返回类型就为void(空)</p>
<p><strong>2、推断类型(ts自动识别类型(按上下文归类))</strong></p>
<p>function&nbsp;add(x: number, y: number) {</p>
<p>&nbsp; &nbsp; return&nbsp;x&nbsp;+ y</p>
<p>}</p>
<p>ts会自动识别出返回类型为number</p>
<p><strong>四、函数的调用</strong></p>
<p>&nbsp;&nbsp;&nbsp;&nbsp;<span style="font-family: 微软雅黑">ts的函数调用和普通的函数没有区别,可以在函数名后面加括号调用,也可以用call,apply,bind来调用</span></p>
<p><strong>1、</strong><strong>call() 和 apply() 是预定义的函数方法。 两个方法可用于调用函数,两个方法的第一个参数必须是对象本身。</strong></p>
<p>function&nbsp;myFunction(a, b) {</p>
<p>&nbsp; &nbsp; return&nbsp;a&nbsp;* b;</p>
<p>}</p>
<p>&nbsp;let&nbsp;obj&nbsp;= myFunction.call(obj, 10, 2); &nbsp; &nbsp; // 返回 20</p>
<p>&nbsp;</p>
<p>&nbsp;console.log(obj)</p>
<p><strong>&nbsp;</strong></p>
<p>function&nbsp;myFunction(a, b) {</p>
<p>&nbsp; &nbsp; return&nbsp;a&nbsp;* b;</p>
<p>}</p>
<p>myArray&nbsp;= ;</p>
<p>myObject&nbsp;= myFunction.apply(myObject, myArray); &nbsp;// 返回 20</p>
<p><span style="font-family: 微软雅黑">两个方法都使用了对象本身作为第一个参数。</span> 两者的区别在于第二个参数: apply传入的是一个参数数组,也就是将多个参数组合成为一个数组传入,而call则作为call的参数传入(从第二个参数开始)。</p>
<p><span style="font-family: 微软雅黑">&nbsp;</span></p><br><br>
来源:https://www.cnblogs.com/lone5wolf/p/15834981.html
頁: [1]
查看完整版本: TypeScript的函数(方法)