18.try catch 的使用

1.什么是try catch

Try-Catch 是 JavaScript 中用于错误处理的机制,让你能够优雅地处理可能出现的错误,而不是让程序崩溃。

因为在js发生了错误,如果没有捕获的话,后面的代码就不会执行,最重要的其实为了写出健壮的代码,而不是动不动代码就执行不下去了。

但是也不能滥用,很多地方明显没问题,就不需要使用。 下面是他的基本语法

javaScript 复制代码
try {
  // 可能出错的代码
} catch (error) {
  // 处理错误的代码
} finally {
  // 无论是否出错都会执行的代码(可选)
}
console.log('我会执行吗')

其中,其中只有finally 是可以省略的,如果你省略了catch,保留finally,就代表你的错误没有处理,最后面的一行我会执行吗? 就不会输出。

2.典型的例子

  1. 访问null的某个属性
javascript 复制代码
try {
  let obj = null;
  console.log(obj.name);  // 💥 这里会报错:Cannot read property 'name' of null
} catch (error) {
  console.log('捕获到错误:', error.message);
  // 输出: 捕获到错误: Cannot read property 'name' of null
}
console.log('程序没有崩溃,继续执行');
  1. 请求接口
javascript 复制代码
async function fetchUserData(userId) {
  try {
    const response = await fetch(`/api/users/${userId}`);
    const userData = await response.json();
    console.log('用户数据:', userData);
    return userData;
  } catch (error) {
    console.error('获取用户数据失败:', error.message);
    return null;  // 返回默认值
  }
}
  1. JSON 解析
javascript 复制代码
function parseConfig(configString) {
  try {
    const config = JSON.parse(configString);
    return config;
  } catch (error) {
    console.warn('配置解析失败,使用默认配置');
    return { theme: 'default', language: 'zh' };  // 默认配置
  }
}

// 使用
const config1 = parseConfig('{"theme": "dark"}');     // 正常解析
const config2 = parseConfig('无效的JSON');            // 返回默认配置
  1. 文件读取
javascript 复制代码
const fs = require('fs');

function readConfigFile(filePath) {
  try {
    const data = fs.readFileSync(filePath, 'utf8');
    return JSON.parse(data);
  } catch (error) {
    if (error.code === 'ENOENT') {
      console.log('配置文件不存在,创建默认配置');
    } else if (error instanceof SyntaxError) {
      console.log('配置文件格式错误');
    } else {
      console.log('读取配置文件时出错:', error.message);
    }
    return {};  // 返回空配置
  }
}

3.其他用法

a.嵌套使用

javascript 复制代码
try {
  console.log('外层开始');
  try {
    console.log('内层开始');
    throw new Error('内层错误');
  } catch (innerError) {
    console.log('内层捕获:', innerError.message);
    throw new Error('内层处理后重新抛出');  // 重新抛出给外层
  }
} catch (outerError) {
  console.log('外层捕获:', outerError.message);
}

对于嵌套来说,如果内层的catch 捕获内层的错误,外层的catch 捕获外层的错误,如果想要内层的错误给外层捕获,就要在内层的catch里面再将其抛出

b.可以根据错误的类型做一些其他事情

javascript 复制代码
try {
  // 一些可能出现多种错误的代码
  someComplexOperation();
} catch (error) {
  if (error instanceof TypeError) {
    console.log('类型错误:', error.message);
  } else if (error instanceof ReferenceError) {
    console.log('引用错误:', error.message);
  } else {
    console.log('其他错误:', error.message);
  }
}
相关推荐
weixin_456904273 分钟前
Vue3入口文件main.js解析
前端·javascript·vue.js
neon120431 分钟前
Vue 3 父子组件通信核心机制详解:defineProps、defineEmits 与 defineExpose 完全指南
前端·javascript·vue.js·前端框架
Ciito36 分钟前
vue+moment将分钟调整为5的倍数(向下取整)
javascript·vue.js
Juchecar1 小时前
Vue3 开发环境搭建及循序渐进学习指南
前端·javascript
小牛.7932 小时前
Web第二次作业
前端·javascript·css
Pikachu8032 小时前
揭秘 tyarn:一个为大型 TypeScript Monorepo 优化的 Yarn 性能猛兽
前端·javascript
用户49430538293802 小时前
大规模建筑自动贴图+单体化效果,cesium脚本
前端·javascript·算法
小高0072 小时前
🔥10 个被忽视的 Vue3 API 开发利器,用过 5 个才算真正入门
前端·javascript·vue.js
Tony小周3 小时前
qml 实现数值键盘
前端·javascript·html