学习JS的心路历程-函式（一）

前几天有间单提到该如何声明函式及在Hositing中会发生什么事，但是函式的奥妙不仅于此。

身为一个使用JS的工程师，我们一定要熟悉函式到比恋人还熟！

这几天将会把函式逐一扒开跟各位一起探讨其中的奥妙。

函式是头等物件

这句话代表着函式与任何JS物件共存，也被当成一个物件。

函式可以被当成变量引用、用实值作声明，或是作为函式参数传递。

这个我们在前几天虽然有提到，但并没有说为什么函式可以这样作，今天就有说明到是因为头等物件所造成的，也让大家复习一下：

//实质建立

function myFun（）{}

//指派给变量、数组或其他物件属性

var myFun = function（）{}；

var myArr = []；

myArr.push（function（）{}）；

var myObj = {}；

myObj.funA = function（）{}；

//作为参数传递给其他函式

function myFun（val）{

val（）；

}

myFun（function（）{}）；

//作为函式的回传值

function myFun（）{

return function（）{}

}

//动态建立和指派属性

var myFun = function（）{}；

myFun.data =“Hola”；

回呼函式Callback function

头等物件的其中一样特性，可以作为参数传递给函式，而在某个时间点，可能会呼叫这个被传入的函式，这就是「回呼函式」的概念。

每当我们设置一个准备在之后呼叫的函式，不论是透过浏览器的事件处理阶段或是透过其他代码，这个行为就是在设置一个回呼函式。我们可以这样解释：这个被建立的函式，会在稍候某个适当的时机点，由其他代码「回呼」（call back）。

这会或还是有点难以理解，不过你或许已经使用过回呼函式只是你不知道而已，不论是最简单的按钮按下执行程序还是从服务器接收数据，这都是回呼函式！

我们来看一个最简单的示例：

var text = 'get Text'；

function unlessFun（callback）{

console.log（'In unlessFUn'）；

return callback（）；

}

function getText（）{

console.log（'In getTxt function'）；

return text；

}

unlessFun（getText）；

执行后会得到如下图：

或许你认为我直接在unlessFun里面印出text就好了啊，为什么要用回呼函式多此一举。

那也许接下来这个示例会让你体验到回呼函式的美好：

如果我们今天有一组数字[2,1,6,12,3,77,100,4]需要做比较大小，这时候可能很多人就会开始自己写个算法的函式，像是这样：

var arr = [2,1,6,12,3,77,100,4]；

function compare（val）{

for（let i = 0；i<val.lenght；i++）{

…

}

}

也许你花了好几天终于写出了这个算法，但是其实我们可以发现JS早就帮你写好了一个sort（）函式，

你可以拿来用，只需要写好回呼函式：

var arr = [2,1,6,12,3,77,100,4]；

arr.sort（function（a，b）{

return a - b；

}）；

console.log（arr）；//[1，2，3，4，6，12，77，100]

我们不需要考虑算法的底层细节，JS早就针对这些算法函式进行最佳化了，没有必要重复造轮子而且造出来的性能还不一定比较好，所以学好回呼函式并使用他们吧！

参考资料：

忍者Javascript开发技巧探讨