# function好難 ```javascript= let x = y(function z() { console.log('I am z') }) function y(fn) { fn() console.log('I am y') return fn } x() console.log(y) console.log(x) console.log(x === y) ``` Q: 輸出的內容? <hr> <details> <summary>answer</summary> ``` I am z I am y I am z [Function: y] [Function: z] false ``` ### 試著解釋過程: 在第 9 行以前,都是 function 的宣告,所以還不會印東西。第 9 行呼叫了 `x()`。那我們來看看 `x` 到底是什麼。要知道 `x` 是什麼,那要先知道 `y` 是什麼。 ```javascript= function y(fn) { //y 是個 function,接收一個參數。 fn() // 把接收的參數當作 function 並運行。 console.log('I am y') // 印出'I am y' return fn //把接收的參數回傳回去 } ``` 知道 `y` 在幹嘛後,就可以回頭看第 1 行,傳入 `y` 的參數:`z`。`z` 也是 function ,功能只是印出`'I am z'`。所以這裡的 `y` 只是把傳進來的參數回傳回去而已,也就是 `z`。接著照順序執行就可以知道答案了。 `x()` 之後,會呼叫 `y` 並傳入 `z`。所以這時候在跑 `y`。一開始就先跑傳進來的 `z`。所以第一行先印出 `'I am z'`。接著印`'I am y'`。之後把 `z` 給 return 回去。 ==`x` 會是 `y` return 的東西==,現在是 `z`。 知道 `x` 後,這時候才跑第 9 行的`x()`,所以印 `'I am z'`。第 9 行終於結束了。 剩 10~12 行的東西了。 * 第10行:`y` 沒有等於誰,所以就印出自己。 * 第11行:`x` 等於誰?上面講過等於 `z`,所以印出 `z`。 * 第12行:上面都印出來了,所以 false。 詳細可參考老師的文章[覺得 JavaScript function 很有趣的我是不是很奇怪](https://blog.huli.tw/2020/04/18/javascript-function-is-awesome/) </details>
×
Sign in
Email
Password
Forgot password
or
By clicking below, you agree to our
terms of service
.
Sign in via Facebook
Sign in via Twitter
Sign in via GitHub
Sign in via Dropbox
Sign in with Wallet
Wallet (
)
Connect another wallet
New to HackMD?
Sign up