首先一个常识就是,在浏览器执行JS脚本过程中,当出现脚本错误,并且你没有手动进行异常捕捉时,他会在浏览器下面出现黄色的叹号,这是正常的,这也不是最重要的,最重要的是,出错行以下的所有JS代码将中停执行,这是我们不希望看到的,所以说,对于自己写的,拿不准的脚本还是加上异常捕捉比较好。

try:  语句测试代码块的错误,一般把可能会出错的代码放到这里

catch: 只有try里面的代码块发生错误时,才会执行这里的代码,参数err记录着try里面代码的错误信息

finally: 无论有无异常里面代码都会执行

使用场景为容易出错的,容易产生兼容问题的代码段加上try..catch。合处理那些我们无法控制的错误,如I/O操作,后端java读取I/O操作比较多比如读数据库,所以用try catch比较多。前端可以用在上传图片或async await同步调接口。

:ECMA-262第3版引入了try catch语句,作为JavaScript中处理异常的一种标准方式。但是在前端js代码中很少看到try catch语句,并不是所以代码都需要加try catch来作得不偿失的“保险”。

try catch缺点:

  1.try catch耗性能

  2.try catch捕获不到异步错误

  3.try catch可能会导致报错点更模糊

顺序:

try里面的代码报错的时候,catch里面的代码才会执行,finally里面的代码永远会执行

catch和finally里面,正常的代码会从上到下顺序执行

如果只是catch里面代码出错,则报catch里面的错误

如果catch和finally都出错则会报finally里面的错误

例子1

<script>
var a = "hello";
try{
alert(a);        //如果是不存在的变量,则抛出异常,将直接跳到catch里面执行(throw定义异常也不会被抛出)
       throw "不存在";    //定义抛出异常
alert("I am try"); //只要上面的语句出现错误或者throw语句这句将不会被执行
}catch(err){
      //如果try中发现错误,则执行catch中的语句,如果没有错误,则跳过catch
alert(err) //接收设置的throw错误异常,如果没有则抛出根据情况默认错误
alert("错误弹出"); //被执行
}finally{
alert("无论如何都会执行");
} // var b="world";
// if(b){
// document.write(b);
// }else{
// alert("error");
// }
</script>

err具有下面一些主要属性:

  • description: 错误描述 (仅IE可用).
  • fileName: 出错的文件名 (仅Mozilla可用).
  • lineNumber: 出错的行数 (仅Mozilla可用).
  • message: 错误信息 (在IE下同description)
  • name: 错误类型.
  • number: 错误代码 (仅IE可用).
  • stack: 像Java中的Stack Trace一样的错误堆栈信息 (仅Mozilla可用).

js中try、catch、finally的执行规则的更多相关文章

  1. JS中 try...catch...finally (转)

    JS的try..catch..finally var array = null; try { document.write(array[0]); } catch(err) { document.wri ...

  2. Java中try catch finally的执行顺序问题

    finally 语句块是在 try 或者 catch 中的 return 语句之前执行的.更加一般的说法是,finally 语句块应该是在控制转移语句之前执行,控制转移语句除了 return 外,还有 ...

  3. JS中try catch的用法

    在js中也可以使用try/catch语法,把可能发生异常的代码使用try包裹起来,然后在catch中对异常进行处理,处理后就不会影响后面代码的执行. const a = null try { cons ...

  4. js中的匿名函数自执行

    随笔,java中因为有修饰符的存在,那就有private类的存在,js不一样,没有修饰词一说,因此为了防止全局变量的污染,js中就出现了匿名函数,直接上code,看到的人可以自己体会: (functi ...

  5. js中如何在一个函数里面执行另一个函数

    1.js中如何在函数a里面执行函数b function a(参数c){ b(); } function b(参数c){ } 方法2: <script type="text/javasc ...

  6. JS中this的4种绑定规则

    this ES6中的箭头函数采用的是词法作用域. 为什么要使用this:使API设计得更简洁且易于复用. this即不指向自身,也不指向函数的词法作用域. this的指向只取决于函数的调用方式 thi ...

  7. js中(try catch) 对代码的性能影响

    https://blog.csdn.net/shmnh/article/details/52445186 起因 要捕获 JavaScript 代码中的异常一般会采用 try catch,不过 try ...

  8. JS中try....catch

    1.事情还有得挽回,换条路走try { 执行某个逻辑} catch (e) { 出问题,换个逻辑执行} 2.体面的退出try { 正常流程} catch (e) { 弹个框告诉用户不好意思出了点问题 ...

  9. C#中try catch finally的执行顺序

    1.首先明确一点,就是不管怎样,finally一定会执行,即使程序有异常,并且在catch中thorw 了 ,finally还是会被执行. 2.当try和catch中有return时,finally仍 ...

  10. JS中的匿名函数自执行、函数声明与函数表达式

    先看一段jQuery源码中匿名函数自执行的例子: (function( window, undefined ) { // jquery code })(window); 另外一种常见的写法: +fun ...

随机推荐

  1. java 面试题 1-10

    1. Java 基础部分 基础部分的顺序:基本语法,类相关的语法,内部类的语法,继承相关的语法,异常的语法, 线程的语法,集合的语法,io 的语法,虚拟机方面的语法 1.一个".java&q ...

  2. 【Offer】[17] 【打印1到最大的n位数】

    题目描述 思路分析 测试用例 Java代码 代码链接 题目描述 输入数字n,按顺序打印出从1最大的n位十进制数.比如输入3,则打印出1.2.3一直到最大的3位数即999. 思路分析 要考虑到大数问题, ...

  3. Vue组件间通信方式

    一.Props传递数据 在父组件中使用子组件,本质通过v-bind绑定属性传入子组件,子组件通过props接收父组件传入的属性 <template> <div> 父组件:{{m ...

  4. 脱离脚手架来配置、学习 webpack4.x (一)基础搭建项目

    序 现在依旧记得第一次看到webpack3.x 版本配置时候的状态  刚开始看到这些真的是一脸懵.希望这篇文章能帮到刚开始入门的同学. webpack 是什么? webpack是一个模块化打包工具,w ...

  5. JDBC处理mysql大数据

    大数据也称之为LOB(Large Objects),LOB又分为:clob和blob,clob用于存储大文本,blob用于存储二进制数据,例如图像.声音.二进制文等. 在实际开发中,有时是需要用程序把 ...

  6. MongoDB的入门使用以及遇到的坑

    一:MonoDB的简单介绍 MongoDB是一个介于关系型数据库与非关系型数据库中间的数据库,是使用C++进行编写的,他的优点是在支持的查询格式特别的强大,可以进行存储比较复杂的数据类型,支持建立索引 ...

  7. .Net基础篇_学习笔记_第四天_加加减减

    using System.Linq; using System.Text; using System.Threading.Tasks; namespace 第四天_加加减减 { class Progr ...

  8. SpringBoot修改默认端口号 及 上下文

  9. 浮动后的 <li> 如何在 <ul> 中居中显示?

    百度了许久都没有满意的解决方案,现在终于搞定了. 其实,只要 ul 的父元素 css 样式设了 text-align: center; 然后 ul 设了 display: inline-block; ...

  10. 03 jvm的组成

    声明:本博客仅仅是一个初学者的学习记录.心得总结,其中肯定有许多错误,不具有参考价值,欢迎大佬指正,谢谢!想和我交流.一起学习.一起进步的朋友可以加我微信Liu__66666666 这是简单学习一遍之 ...