TypeScript 入門(二)- 函式
一、函式定義 1、先看一下ES5中定義函式 function fn(){ return ‘str’; } //匿名函式 var fn1 = function(){ } 2、在ts中定義函式 function fn():string{ return 'str'; } // 匿名函式 var fn1 = function():string{ }
二、函式的傳參 1、ts中函式的傳參 function show(name:string):string{ return '${name}' + 'test';// 模板字串 } // 匿名函式傳參 var fn1 = function(name:string):string{ return '${name}' + 'test';// 模板字串 } // 沒有返回值的方法 function fn():void{ } 2、可選引數 ES5 裡面方法的實參和傳參可以不一樣,但是ts 中必須一樣, 如果不一樣就需要配置可選引數 可選引數需要在引數後面加上? 可選引數必須在引數最後面 function sample1(str:string,str1?:string):string { return '${str}'; } sample1('222'); sample1('222','111');
3、預設引數 預設引數也屬於可選引數的一種 function sample2(str1:string,str2:string='str1'):void{ var str:string = str1 + str2; console.log(str); }
4、剩餘引數 function sum(...nums:number[]):void{ var total:number = 0; for(var index =0;index < nums.length;index++){ total += nums[index]; } console.log(total); } sum();
三、函式過載 ES5 中函式沒有過載 ts中的過載 function sample(str:string):string; function sample(str:number):number; function sample(str:any):any { if(typeof str == 'string'){ return str; } else if (typeof str == 'number') { return str + 10; } } 四、箭頭函式 function sample4(callback:Function):Function { return callback; } var fn1:Function = (str:string)=>{console.log(str)}; sample4(fn1);