try-catch-finally，被你忽略掉的執行順序

try-catch是捕捉異常的神器，不管是除錯還是防止軟體崩潰，都離不開它。今天筆者介紹一下加上finally後的執行順序

function test() {
  try {
    console.log(1);
  } finally {
    console.log(2);
  }
}

console.log(test()); // 1 2

嗯！按順序執行了。

---

我們在try中加入return語句

function test() {
  try {
    console.log(1);
    return 'from_try';
  } catch (e) {
    // TODO
  } finally {
    console.log(2);
  }
}

console.log(test()); // 1 2 from_try

等等，難道不應該是 1 > from_try > 2的順序嗎？
抱歉啊，是這樣的，在try和catch的程式碼塊中，如果碰到return語句，那麼在return之前，會先執行finally中的內容，所以2會比from_try優先輸出。

---

我們在finally中也加入return語句

function test() {
  try {
    console.log(1);
    return 'from_try';
  } catch (e) {
    // TODO
  } finally {
    console.log(2);
    return 'from_finally';
  }
}

console.log(test()); // 1 2 from_finally

買噶的，我的from_try怎麼不見了？
抱歉，按照上一條的規則，finally是會優先執行的，所以如果finally裡有return語句，那麼就真的return了。

---

現在筆者在try語句塊中故意報錯

function test() {
  try {
    console.log(1);
    throw new Error('throw');
  } catch (e) {
    console.log(e.message);
    return 'from_catch';
  } finally {
    console.log(2);
  }
}

console.log(test()); // 1 throw 2 from_catch

看來，try和catch的return都需要先經過finally。

結語

只是一個很小的細節。但也希望各位看官好好利用這種特性。