理解JS下的“异常传播”

简介: 理解JS下的“异常传播”

今天看了廖雪峰老师的一篇文章关于处理异常的,写的很不错,总结一下!

我们都知道JS里面的函数是非常重要的一部分,也是学习JS的精髓所在,那函数分为很多种,看你怎么分,可以分为有参函数和无参函数,按照返回值分为有返回值的函数和没有返回值的函数,那么在写函数的时候我们经常遇到一个问题就是异常的处理,之前在写Java的时候其实也是一样会遇到这样的问题,那么在java里面其实只要你觉得哪里可能会出问题的时候,你只需要将代码try-catch捕捉一下将异常处理就行了,在js里面呢其实也是一样的,例如下面的例子:

function test(s){
      try{
        $("#console").append("参数的长度是"+s.length);
      }catch(e){
        $("#console").append("异常里面参数的长度是"+e);
      }
    }
    test(null);

打印出来的是:

异常里面参数的长度是TypeError: Cannot read property 'length' of null

这句话也就是我们处理异常的时候写的,也是最常见的一种,这个函数叫做有参函数, 那么我们捕捉的是参数会不会有问题,如果有问题我们就将异常捕捉出来,这是很常规的一种写法,今天我们要说的是异常传播是什么意思呢?

其实我们在写js函数的时候很多的时候不会是一个函数,会有很多的函数接连的调用,那么任何一个函数出问题其实都是应该捕捉的,理论上是这样的是吧,但是这样写代码的话就很麻烦了,所以就出现了下面这样的代码:

 function  start(ele){
                    $("#console").append("start-fun"+"<br/>");
            try {
              second(ele);
            } catch (e) {
              $("#console").append("错误"+e+"<br/>");
            }
              $("#console").append("end-fun"+"<br/>");
      }
      function second(ele){
        $("#console").append("start-second"+"<br/>");
        three(ele);
        $("#console").append("end-second"+"<br/>");
      }
      function three(ele){
        $("#console").append("start-three"+"<br/>");
        $("#console").append("参数的长度是"+ele.length);
        $("#console").append("end-three"+"<br/>");
      }
      start(null); 

这里的函数是三个有参函数,一般我们遇到的时候要求说写上异常捕捉,我们会将每一个函数都写上,其实只要在一个合适的函数哪里写上就可以了,因为如果在一个函数内部发生了错误,它自身没有捕获,错误就会被抛到外层调用函数,如果外层函数也没有捕获,该错误会一直沿着函数调用链向上抛出,直到被JavaScript引擎捕获,代码终止执行。所以,我们不必在每一个函数内部捕获错误,只需要在合适的地方来个统一捕获,一网打尽

运行的结果是:

start-fun
start-second
start-three
错误TypeError: Cannot read property 'length' of null
end-fun

PS:不要纠结于我为什么不用console.log()来打印,我习惯了写到页面上!

所以以后遇到了就不用每一个都写上异常捕捉了,只需要写一个就行了。

谢谢阅读

相关文章
|
7月前
|
JavaScript 前端开发 数据库连接
js的异常程序处理机制
js的异常程序处理机制
43 0
|
7月前
|
JSON JavaScript 前端开发
抓住异常,解救你的代码世界:你应该了解的 JavaScript 异常类型
抓住异常,解救你的代码世界:你应该了解的 JavaScript 异常类型
|
4月前
|
存储 前端开发 JavaScript
javascript 异常问题之为自定义异常提供丰富的上下文信息如何实现
javascript 异常问题之为自定义异常提供丰富的上下文信息如何实现
|
4月前
|
JavaScript 前端开发 UED
探秘 JavaScript 错误背后的真相——揭开异常类型的神秘面纱,让你的代码从此无懈可击!
【8月更文挑战第23天】本文深入探讨了JavaScript中常见的异常类型,包括`ReferenceError`(未定义的引用)、`TypeError`(类型错误)、`SyntaxError`(语法错误)、`RangeError`(范围错误)、`EvalError`(评估错误)以及`URIError`(URI错误),并通过示例展示了如何有效地诊断与处理这些异常。此外,还介绍了如何自定义错误类以适应特定场景的需求。掌握这些异常处理技巧对于构建稳定可靠的Web应用程序至关重要。
43 0
|
4月前
|
设计模式 前端开发 JavaScript
javascript 异常问题之Promise的未处理异常如何捕获
javascript 异常问题之Promise的未处理异常如何捕获
|
4月前
|
监控 前端开发 JavaScript
javascript 异常问题之在JavaScript中,Promise的异常如何处理
javascript 异常问题之在JavaScript中,Promise的异常如何处理
|
4月前
|
前端开发 JavaScript
javascript 异常问题之Promise异常如何捕获
javascript 异常问题之Promise异常如何捕获
|
4月前
|
JavaScript 前端开发
javascript 异常问题之JavaScript中的异常有哪些类型,可以举例说明吗
javascript 异常问题之JavaScript中的异常有哪些类型,可以举例说明吗
|
5月前
|
JavaScript CDN
js 捕获异常
js 捕获异常
34 1
|
5月前
|
JavaScript
js 事件流、事件冒泡、事件捕获、阻止事件的传播
js 事件流、事件冒泡、事件捕获、阻止事件的传播
81 1