Day20-JavaScript(JS)与TypeScript(TS)的函式(Function) Part2

今天要来接续上一篇的函式(Function)，
上篇着重JavaScript(JS)，
本篇当然着重TypeScript(TS)啦，
我们继续看下去吧。

TypeScript(TS)的函式(Function)

TS的函式(Function)运作方式和JS有些不同，
通常会将函式(Function)定义在类别(Class)之中，
以方法(Method)的形式存在，
透过类别将程序码组织成容易重复使用的单位。

TS的函式型别与JS的匿名函式较为相近，
我们直接来看范例吧。

这是TS的程序码，

//宣告函式
let sayHi : Function = function(){
    console.log('Hi');
}

//呼叫函式
sayHello();  //'Hi'

范例中宣告sayHi为Function，
是不是和JS的匿名函式很相似呢?
其实真的只差在型别上的宣告而已，
这也是TS最为重要的一部分。

接着我们再更进一步的来看看这段TS程序码编译後的JS程序码吧，
结果如下，

"use strict";
//宣告函式
let sayHi = function (){
    console.log('Hi') ;
}

//呼叫函式
sayHi() ;  //'Hi'

其实就是匿名函式，给大家参考参考。

箭头函式(Arrow Function)

箭头函式(Arrow Function)又称为Lambdas，
是ES6(ECMAScript 6，正式名称ECMAScript 2015)版本新增到JS的新语法，
提供一个简单的语法来定义函式。

那麽我们将上面的TS函式范例用箭头函式来改写看看吧，
改写後如下，

//宣告函式
let sayHi : Function = () => {
    console.log('Hi');
}

//呼叫函式
sayHello();  //'Hi'

修改方式，
将()前的function移除，
将()後加上=>，
就完成了喔。

刚开始看肯定不习惯，
看起来很像一堆符号连在一起，
看久了其实也是会习惯的，
也更能简化程序码喔。

今日结语

希望这两天大家有对**函式(Function)**有更多一些了解，
函式在开发时无论是使用JS还是TS都是是非常重要的喔，
大家要好好理解好好加油才行。