Go to comments

JavaScript try..catch


一、try…catch

 try…catch  很有用，可能目前用的次数比较少，但以后用的次数可能会的比较多一些，在企业开发的时候尤其用的比较多


try 是尝试的意思

catch 是捕捉的意思

try…catch 就是为了防止报错的


举一个小例子，现在已知第三条代码出错

console.log('a');

console.log('b');

console.log(c); // Uncaught ReferenceError: c is not defined

console.log('d');


现在是已知第三行出错，假如我们写代码中间有一百行，这一百行代码写起来是非常不保准的，

因为我觉得这一百行代码有可能出错，有可能也不出错，但是无论出不出错，都不想让这一百行代码出错那一行，影响后续代码的执行，

因为但凡一行代码报错，肯定会影响后面代码的执行。


报错我们肯定会知道啊，有些时候的一些错误不是我们能把控的


 var data = null 

1. 比如变量 data 一开始值是 null，后来由于数据传输，后端会给变量 data 里面传递一些数据进来，传递完这些数据后，我们拿这些数据来用

2. 但是唯一我们不知道的是，后端什么时候传，传的成功还是没传成功，传的时候网速通不通畅都不知道

3. 所以这个时候直接用这个变量data，有可能就错了，因为不知道data里面有没有数据，

    我们根本就无从得知，因为编程是前后端拼到一起才算一个真正的程序，

    拼到一起，前段的问题可能疏导到后端去报错，后端的问题可能疏导到前端来报错。


这个时候一段代码确实是没有把握的，而确实我们能肯定代码在某种情况下一定会报错，在某种情况下一定不报错，但必须这么来写，

那这时候怎么来保证，在任何一种情况下，代码都能正常的运行呢？就得的用  try…catch 


如果不敢肯定这一堆代码里面有没有错误，就尽管把它放到 try 里面去就好了，

当 try 里面出错，不抛出错误，不终止后续代码的执行，try 外面的后续代码继续执行

try {
  console.log('a');
  console.log(b); // 1. 这行错误，不会执行这行，报错的代码依然报错，但是不抛出错误
  console.log("c"); // 2. 也不会执行错误后try里面的代码，而是直接把try里面的代码忽略，执行外面的代码
} catch (e) {

}

console.log('d'); // 3. 但是后续的代码还会能执行


// 执行结果
// a
// d

1. 如果把代码写在 try 里面，try里的代码会正常逐行执行和外面的没有什么太大区别，

2. 但是好处是，当 try 里面的代码报错（第二行报错），报错之后按照正常逻辑，后面的代码都不会再走了而且会停止执行，

    但是按照 try 的逻辑是，当 try 里面的代码报错，不抛出错误，不终止后续代码的执行

3. try 外面的后续代码继续执行，这是 try 的逻辑和用途


try的语法：

在try里面发生错误，不会执行错误后的try里面的代码，而是直接把try里面的代码忽略，然后执行外面的代码。


如果 try 里面的代码没有报错呢？没有报错正常执行

try{
  console.log('a');
  console.log('b');
  console.log("c");
}catch(e){

}

console.log('d');


// 执行结果:
// a
// b
// c
// d


 catch()  怎么用？

在catch里面加点代码

1. 如果 try 里面的代码不出错，catch 里面的代码是不会被执行的

try{
  console.log('a');
  console.log('b');
  console.log("c");
}catch(e){
  console.log(e); // 在catch里加代码
}

console.log('d');


// 执行结果：
// a
// b
// c
// d


2. 但是 try 里面的代码出错，这个 catch 作用就是把 try 里面的错误捕捉到

try{
  console.log('a');
  console.log(b); // 出错的代码
  console.log("c");
}catch(e){
  console.log(e.name + ' : ' + e.message); // ReferenceError : b is not 
}

console.log('d');


// 输出结果：
// a
// ReferenceError : b is not defined
// d


有一堆错误信息，errer是一个对象，

系统会把这些错误信息  errer.name 、 errer.maessage ，封装到一个对象里面，

封装到 error 对象里面，然后把 error 对象传到 e 里面， catch(e)  供我们去使用。


如果一旦报错了，

1. try 会停止它里面的代码，会直接跳到 catch 的代码里面去执行

2. 然后，可以执行我们想执行的任何东西，但是一般情况下我们都会打印 catch(e) 形参e里面的信息，

3. e是系统传过来的错误对象，里面包含了两种信息，一个是 e.name，一个是 e.maessage

try{
  console.log('a'); // 1.先执这行
  console.log(b); // 2.到这行报错
  console.log('c'); // 3.忽略执行
}catch(e){
console.log(e.name + ' : ' + e.message); // 4.然后之间跳到这执行，ReferenceError : b is not 
                                         //   执行完这一句，执行try...cathc外面的代码
}

console.log('d'); // 5.继续执行try外面的代码


// a
// ReferenceError : b is not defined
// d

 ReferenceError : b is not defined  这个是我们平时看过的错误信息


平时错误信息会抛到控制台上（红色的，前面加一个Uncaught没有捕捉到），

如果把代码 try…catch 起来，这个 catch 就负责捕捉错误的，捕捉错误到程序里面，他就不会抛到控制台里面，就不会让程序终止。


 try…catch  就是为了容错，并且把错误抓到。把抓到的错误信息给我们，我们爱怎么处理怎么处理，打印出来也行，给用户显示也行。

try{
  console.log('a');
  console.log(b);
  console.log('c');
}catch(e){
  alert(e.name + ' : ' + e.message); // 这块可以alert通过弹窗给用户看
}

console.log('d');


把代码写在 try 里面后，

一旦 try 里面没有错误就不会执行 catch，因为没有错误可捕捉，

一旦有错误才会跳到 catch 里面去，并且允许我们操作错误信息。


catch的格式就是  catch(e) （e可以随便写，写abc都行，e是一个参数是形参，虽然不像一个函数，但e依然是个形参），

系统会把错误对象传到 e 里面去，然后我们可以去用，

错误对象只有两个信息一个是 e.name，一个是 e.message。


问题天使问，

老师说是一个好问题，try里面两条语句出错，会报几条错误？到b就停来，不会执行c了

try{
  console.log('a'); 
  console.log(b); // 报错，到这就停了
  console.log(c); // 报错，不看这了
}catch(e){
  console.log(e.name + ' : ' + e.message); // ReferenceError : b is not                                      
}

console.log('d');


try…catch 的好处是他不会让程序后面的代码终止，它只会让 try 后面的代码终止，

一旦我们编程没有信心就用 try…catch。


try…catch 其实不是重点，重点是通过 try…catch 了解错误信息到底是什么，以后能更好的分辨错误，

Error.name 是错误的类型一共分六种，catch(e) 里的 Error.name 和程序里正常报错的 Error.name 是一样的。


比如现在不用 try…catch

console.log(e); // Uncaught ReferenceError: e is not defined

肯定输出的报错信息 Uncaught

1. 信息前面 ReferenceError 是一个错误的名字

2. 后面的 e is not defined 叫错误的信息


接下来看错误的名称和错误到信息，错误的名称一共分六种


二、Error.name的六种值对应的信息

1. EvalError


eval() 的使用与定义不一致，

eval 是不允许我们用的，但是如果要用它要报错就报一个单独的信息，错误的名称是 EvalError，

EvalError 错误不怎么常见基本上用不到。


2. RangeError 数值越界 


基本上是数值越界的一种情况，也很少见


Ps： 

是最常见的错误是 3，

4 其实也常见，

先说一下 5


5. TypeError 操作数类型错误


操作数类型错误，比如数组方法操作对象，就会返回类型 TypeError 错误


6. URIError URI


引用地址发生错误，有一个url都是地址，地址发生错误一般是URIError错误


Ps: 

主要是3和4，3和4搞明白后，基本一大半错误都明白了


3. ReferenceError 引用错误，非法或不能识别的引用数值


如果当一个变量没经声明就使用，错误的结果就是 Uncaught  ReferenceError : b is not defined

console.log(b); // Uncaught ReferenceError: b is not defined


当一个函数没经声明就调用，也是 ReferenceError 错误

b(); // Uncaught ReferenceError: b is not defined


一系列东西没定义就使用，基本上都是 ReferenceError，

一旦报出 ReferenceError 就看看是不是没定义好。


4. SyntaxError 发生语法解析错误


当代码里面写了一个中文的冒号，在程序在执行之前，第一步会通篇的扫描叫语义分析（语法分析）

function demo(){
  ：// 中文的冒号
}


虽然函数没执行，没执行在第一遍扫描时就发生错误了，因为写一个中文冒号严重不合法，是一种低级错误，

这种低级错误被解析出 SyntaxError，而且错误信息基本是这样的 SyntaxError: Invalid or unexpected token 意思是不被希望这么去用


包括写一个中文也报低级错误，试试中文行不行？

var 秘密 = 123;

console.log(秘密); // 123

中文还真能执行，伪代码现在好使了，原来管这种叫伪代码


什么是伪代码？

把所有的的变量、函数、执行功能都用汉字来表示，这样是不是好理解，管这种叫伪代码，

一般写项目实例的时候用伪代码来写，现在汉字可以当变量使用了。


写一个字符串的时候可能出现这样 ReferenceError 的错误，会报什么样的报错?

var str = abcd;

报错信息是 Uncaught ReferenceError:  abcd is not defined  abcd未定义

因为系统理解的是把 abcd 的值赋到变量 str 里面去，但是现在 abcd 不是变量，因为没声明，

其实我们理想的是这样  var str = 'abcd' 



Leave a comment 0 Comments.

Leave a Reply

换一张