try/catch/finally

最近再看一个vue项目源码时看到其中很多地方用到了try和catch,很多地方都有用到但不知道其作用是什么,今天经过查阅整理如下:

try可以理解为代码的执行检测模块。再try中放置的代码一般会经过检测是否有异常错误。如果有会经过catch进行捕获。而finally呢?

这个东西他不管有没有报错他都会执行。

demo如下:

<p>请输入 5 和 10 之间的一个数:</p>
 
<input id="demo" type="text">
<button type="button" onclick="myFunction()">检测输入</button>
<p id="message"></p>
 
<script>
function myFunction() {
    var message, x;
    message = document.getElementById("message");
    message.innerHTML = "";
    x = document.getElementById("demo").value;
    try { 
        if(x == "")  throw "为空";
        if(isNaN(x)) throw "不是一个数字";
        if(x > 10)   throw "太大了";
        if(x < 5)    throw "太小了";
    }
    catch(err) {
        message.innerHTML = "输入的值 " + err;
    }
}
</script>

配合throw输出可以合理的打印出错误信息

posted @ 2018-09-07 09:01  狗尾草的博客  阅读(356)  评论(0编辑  收藏  举报