Try..Catch的注意事项有什么

这篇文章主要介绍“Try..Catch的注意事项有什么”,在日常操作中,相信很多人在Try..Catch的注意事项有什么问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”Try..Catch的注意事项有什么”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!

创新互联建站主要业务有网站营销策划、成都网站建设、网站建设、微信公众号开发、小程序设计、H5网站设计、程序开发等业务。一次合作终身朋友,是我们奉行的宗旨;我们不仅仅把客户当客户,还把客户视为我们的合作伙伴,在开展业务的过程中,公司还积累了丰富的行业经验、成都全网营销资源和合作伙伴关系资源,并逐渐建立起规范的客户服务和保障体系。 

1.使用 try..catch..finally..throw

在 JS  中处理错误,我们主要使用try、catch、finally和throw关键字。

  • try块包含我们需要检查的代码

  • 关键字throw用于抛出自定义错误

  • catch块处理捕获的错误

  • finally 块是最终结果无论如何,都会执行的一个块,可以在这个块里面做一些需要善后的事情

1.1 try

每个try块必须与至少一个catch或finally块,否则会抛出SyntaxError错误。

我们单独使用try块进行验证:

try {   throw new Error('Error while executing the code'); }
ⓧ Uncaught SyntaxError: Missing catch or finally after try

1.2 try..catch

建议将try与catch块一起使用,它可以优雅地处理try块抛出的错误。

try {   throw new Error('Error while executing the code'); } catch (err) {   console.error(err.message); }
➤ ⓧ Error while executing the code

1.2.1 try..catch 与 无效代码

try..catch 无法捕获无效的 JS 代码,例如try块中的以下代码在语法上是错误的,但它不会被catch块捕获。

try {   ~!$%^&* } catch(err) {   console.log("这里不会被执行"); }
➤ ⓧ Uncaught SyntaxError: Invalid or unexpected token

1.2.2 try..catch 与 异步代码

同样,try..catch无法捕获在异步代码中引发的异常,例如setTimeout:

try {   setTimeout(function() {     noSuchVariable;   // undefined variable   }, 1000); } catch (err) {   console.log("这里不会被执行"); }

未捕获的ReferenceError将在1秒后引发:

➤ ⓧ Uncaught ReferenceError: noSuchVariable is not defined

所以 ,我们应该在异步代码内部使用 try..catch 来处理错误:

setTimeout(function() {   try {     noSuchVariable;   } catch(err) {     console.log("error is caught here!");   } }, 1000);

1.2.3 嵌套 try..catch

我们还可以使用嵌套的try和catch块向上抛出错误,如下所示:

try {   try {     throw new Error('Error while executing the inner code');   } catch (err) {     throw err;   } } catch (err) {   console.log("Error caught by outer block:");   console.error(err.message); }
Error caught by outer block: ➤ ⓧ Error while executing the code

1.3 try..finally

不建议仅使用 try..finally 而没有 catch 块,看看下面会发生什么:

try {   throw new Error('Error while executing the code'); } finally {   console.log('finally'); }
finally ➤ ⓧ Uncaught Error: Error while executing the code

这里注意两件事:

  • 即使从try块抛出错误后,也会执行finally块

  • 如果没有catch块,错误将不能被优雅地处理,从而导致未捕获的错误

1.4 try..catch..finally

建议使用try...catch块和可选的finally块。

try {   console.log("Start of try block");   throw new Error('Error while executing the code');   console.log("End of try block -- never reached"); } catch (err) {   console.error(err.message); } finally {   console.log('Finally block always run'); } console.log("Code execution outside try-catch-finally block continue..");
Start of try block ➤ ⓧ Error while executing the code Finally block always run Code execution outside try-catch-finally block continue..

这里还要注意两件事:

  • 在try块中抛出错误后往后的代码不会被执行了

  • 即使在try块抛出错误之后,finally块仍然执行

finally块通常用于清理资源或关闭流,如下所示:

try {   openFile(file);   readFile(file); } catch (err) {   console.error(err.message); } finally {   closeFile(file); }

1.5 throw

throw语句用于引发异常。

throw 
// throw primitives and functions throw "Error404"; throw 42; throw true; throw {toString: function() { return "I'm an object!"; } };  // throw error object throw new Error('Error while executing the code'); throw new SyntaxError('Something is wrong with the syntax'); throw new ReferenceError('Oops..Wrong reference');  // throw custom error object function ValidationError(message) {   this.message = message;   this.name = 'ValidationError'; } throw new ValidationError('Value too high');

2. 异步代码中的错误处理

对于异步代码的错误处理可以Promise和async await。

2.1 Promise 中的 then..catch

我们可以使用then()和catch()链接多个 Promises,以处理链中单个 Promise 的错误,如下所示:

Promise.resolve(1)   .then(res => {       console.log(res);  // 打印 '1'        throw new Error('something went wrong');  // throw error        return Promise.resolve(2);  // 这里不会被执行   })   .then(res => {       // 这里也不会执行,因为错误还没有被处理       console.log(res);       })   .catch(err => {       console.error(err.message);  // 打印 'something went wrong'       return Promise.resolve(3);   })   .then(res => {       console.log(res);  // 打印 '3'   })   .catch(err => {       // 这里不会被执行       console.error(err);   })

我们来看一个更实际的示例,其中我们使用fetch调用API,该 API 返回一个promise对象,我们使用catch块优雅地处理 API 失败。

function handleErrors(response) {     if (!response.ok) {         throw Error(response.statusText);     }     return response; }  fetch("http://httpstat.us/500")     .then(handleErrors)     .then(response => console.log("ok"))     .catch(error => console.log("Caught", error));
Caught Error: Internal Server Error     at handleErrors (:3:15)

2.2 try..catch 和 async await

在 async await 中 使用try..catch 比较容易:

(async function() {     try {         await fetch("http://httpstat.us/500");     } catch (err) {         console.error(err.message);     } })();

让我们看同一示例,其中我们使用fetch调用API,该API返回一个promise对象, 我们使用try..catch块优雅地处理API失败。

function handleErrors(response) {     if (!response.ok) {         throw Error(response.statusText);     } }  (async function() {     try {       let response = await fetch("http://httpstat.us/500");       handleErrors(response);       let data = await response.json();       return data;     } catch (error) {         console.log("Caught", error)     } })();
Caught Error: Internal Server Error     at handleErrors (:3:15)     at :11:7

3. JS 中的内置错误

3.1 Error

JavaScript 有内置的错误对象,它通常由try块抛出,并在catch块中捕获,Error 对象包含以下属性:

  • name:是错误的名称,例如 “Error”, “SyntaxError”, “ReferenceError” 等。

  • message:有关错误详细信息的消息。

  • stack:是用于调试目的的错误的堆栈跟踪。

我们创建一个Error 对象,并查看它的名称和消息属性:

const err = new Error('Error while executing the code');  console.log("name:", err.name); console.log("message:", err.message); console.log("stack:", err.stack);
name: Error message: Error while executing the code stack: Error: Error while executing the code     at :1:13

JavaScript 有以下内置错误,这些错误是从 Error 对象继承而来的

3.2 EvalError

EvalError 表示关于全局eval()函数的错误,这个异常不再由 JS 抛出,它的存在是为了向后兼容。

3.3 RangeError

当值超出范围时,将引发RangeError。

➤ [].length = -1 ⓧ Uncaught RangeError: Invalid array length

3.4 ReferenceError

当引用一个不存在的变量时,将引发 ReferenceError。

➤ x = x + 1; ⓧ Uncaught ReferenceError: x is not defined

3.5 SyntaxError

当你在 JS 代码中使用任何错误的语法时,都会引发SyntaxError。

➤ function() { return 'Hi!' } ⓧ Uncaught SyntaxError: Function statements require a function name  ➤ 1 = 1 ⓧ Uncaught SyntaxError: Invalid left-hand side in assignment  ➤ JSON.parse("{ x }"); ⓧ Uncaught SyntaxError: Unexpected token x in JSON at position 2

3.6 TypeError

如果该值不是预期的类型,则抛出TypeError。

➤ 1(); ⓧ Uncaught TypeError: 1 is not a function  ➤ null.name; ⓧ Uncaught TypeError: Cannot read property 'name' of null

3.7 URIError

如果以错误的方式使用全局 URI 方法,则会抛出URIError。

➤ decodeURI("%%%"); ⓧ Uncaught URIError: URI malformed

4. 定义并抛出自定义错误我们也可以用这种方式定义自定义错误。

class CustomError extends Error {   constructor(message) {     super(message);     this.name = "CustomError";   }  };  const err = new CustomError('Custom error while executing the code');  console.log("name:", err.name); console.log("message:", err.message);
name: CustomError message: Custom error while executing the code

我们还可以进一步增强CustomError对象以包含错误代码

class CustomError extends Error {   constructor(message, code) {     super(message);     this.name = "CustomError";     this.code = code;   }  };  const err = new CustomError('Custom error while executing the code', "ERROR_CODE");  console.log("name:", err.name); console.log("message:", err.message); console.log("code:", err.code);
name: CustomError message: Custom error while executing the code code: ERROR_CODE

在try..catch块中使用它:

try{   try {     null.name;   }catch(err){     throw new CustomError(err.message, err.name);  //message, code   } }catch(err){   console.log(err.name, err.code, err.message); }

到此,关于“Try..Catch的注意事项有什么”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注创新互联网站,小编会继续努力为大家带来更多实用的文章!


新闻名称:Try..Catch的注意事项有什么
URL分享:http://ybzwz.com/article/ghhepi.html