JS常见错误(Error)及处理方案详解

1. 错误的类型

　　Error: 所有错误的父类型

　　 错误的子类型包括：

  • 　　 ReferenceError: 引用的变量不存在
  • 　　 TypeError: 数据类型不正确的错误
  • 　　 RangeError: 数据值不在其所允许的范围内
  • 　　 SyntaxError: 语法错误

常见的内置错误：

（1）ReferenceError: 引用变量不存在

console.log(a) //ReferenceError: a is not defined

（2）TypeError: 数据类型不正确

var b = {}
b.xxx() //TypeError: b.xxx is not a function

（3）RangeError: 数据值不在其所允许的范围内

function fn(){
　　fn()
}
fn() //RangeError: Maximum call stack size exceeded

（4）SyntaxError: 语法错误

const c = """" //SyntaxError: Unexpected string

2. 错误处理

　　捕获错误: try ... catch

　　抛出错误: throw error

（1）捕获错误

try {
  let d
  console.log(d.xxx)
} catch (error) { //可以通过调试查看error对象的属性（message属性: 错误相关信息；stack属性: 函数调用栈记录信息）
 console.log(error.message)
 //console.log(error.stack)
}
// 可以继续向下执行
console.log('出错之后')

（2）抛出错误

function something() {
  if (Date.now() % 2 === 1 ){
  console.log('当前时间为奇数,可执行任务')
  } else {
  throw new Error('当前时间为偶数无法执行任务')
  }
}

//情况1 直接调用
something() //Error: 当前时间为偶数无法执行任务
console.log('something之后') //不会继续这句代码（没有对异常进行处理）

//情况2 捕获处理异常
try {
 something()
} catch(error) {
 console.log(error.message)
}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 深入分析javascript中的错误处理机制

    前面的话 错误处理对于web应用程序开发至关重要,不能提前预测到可能发生的错误,不能提前采取恢复策略,可能导致较差的用户体验.由于任何javascript错误都可能导致网页无法使用,因此作为开发人员,必须要知道何时可能出错,为什么会出错,以及会出什么错.本文将详细介绍javascript中的错误处理机制 error对象 error对象是包含错误信息的对象,是javascript的原生对象.当代码解析或运行时发生错误,javascript引擎就会自动产生并抛出一个error对象的实例,然后整个程序

  • 简介JavaScript错误处理机制

    1. try-catch语句 ECMA-262第3版引入了try-catch语句,作为JavaScript中处理异常的一种标准方式. 语法: try{ // 可能会导致错误的代码 }catch (error){ // 在错误发生时怎么处理 } 也就是说,我们应该把所有可能会抛出错误的代码都放在try语句块中,而把那些用于错误处理代码放在catch块中. try-catch语句的逻辑是:如果try块中的任何代码发生了错误,就会立即退出代码执行过程,然后接着执行catch块.此时,catch块会接收

  • NodeJS处理Express中异步错误

    摘要 比起回调函数,使用 Promise 来处理异步错误要显得优雅许多. 结合 Express 内置的错误处理机制和 Promise 极大地降低产生未捕获错误(uncaught exception)的可能性. Promise 在ES6中是默认选项.如果使用 Babel 转译,它也可以与 Generators 或者 Async/Await 相结合. 本文主要阐述如何在 Express 中使用错误处理中间件(error-handling middleware)来高效处理异步错误.在 Github 上

  • laravel 错误处理,接口错误返回json代码

    Laravel 默认已经为我们配置好了错误和异常处理,我们在 App\Exceptions\Handler 类中触发异常并将响应返回给用户. 所有异常都由类App\Exceptions\Handler处理,该类包含两个方法:report和render report方法只是将异常传递给异常被记录的基类,我们这里主要是针对 render 的修改: 先看代码: public function render($request, Exception $exception) { if($request->i

  • JavaScript错误处理操作实例详解

    本文实例讲述了JavaScript错误处理操作.分享给大家供大家参考,具体如下: 良好的错误处理机制可以让用户得到及时的提醒,所以让我们来看看 JavaScript 提供了哪些针对错误处理的工具和方法吧O(∩_∩)O~ 1 try-catch 语句 ECMA-262 第 3 版引入了 try-catch 语句,这时 JavaScript 处理异常的标准方式: try{ //可能会导致错误的代码 } catch (error){ //错误处理 } 如果 try 块中的代码发生了错误,会立即执行 c

  • JavaScript错误处理和堆栈追踪详解

    有时我们会忽略错误处理和堆栈追踪的一些细节, 但是这些细节对于写与测试或错误处理相关的库来说是非常有用的. 例如这周, 对于 Chai 就有一个非常棒的PR, 该PR极大地改善了我们处理堆栈的方式, 当用户的断言失败的时候, 我们会给予更多的提示信息(帮助用户进行定位). 合理地处理堆栈信息能使你清除无用的数据, 而只专注于有用的数据. 同时, 当更好地理解 Errors 对象及其相关属性之后, 能有助于你更充分地利用 Errors. (函数的)调用栈是怎么工作的 在谈论错误之前, 先要了解下(

  • javascript 小数乘法结果错误的处理方法

    一.用js计算 12.32 * 7  结果是多少? 答案:86.24000000000001   为什么会出现这种问题?怎么解决? js在处理小数的乘除法的时候有一个bug,解决的方法可以是:将小数变为整数来处理. 以上的计算可以改为: 12.32 * 100 * 7 /100 得出的结果是:86.24,正确.   另外再计算一下: 8.80 * 100 * 12 / 100 结果:105.60000000000002 38.80也会出现类似的问题.   精确度增加10倍: 8.80 * 100

  • javascript容错处理代码(屏蔽js错误)

    有时候大家来浏览网页的时候发现IE浏览器左下角总有个黄色错误标志,有时候更是直接弹出错误无法继续浏览页面,这样对于网站的正规性与权威性发展不利. 国外银行页面就是因为这样的错误,导致用户大量流失不敢用这个银行的网上银行等导致损失惨重. 所以一个想要在用户体验与公司实力上都是不容出现的错误,就是不影响使用也不能让用户反感,我们一直致力于为大家提高更好的代码,所以这里我们将会大家整理一些常用的代码,使用方法什么,希望大家以后能越来越支持我们,让我们共同发展. 第一种:我们在用的 <SCRIPT la

  • 浅谈如何优雅处理JavaScript异步错误

    浅谈如何优雅处理JavaScript异步错误

    1. try/catch try/catch基本上是大家最常和async/await一起使用的,基本上我们会用它去包围大部分的异步方法.await关键字后面的promise一旦reject了,就会抛出一个异常错误. run(); async function run() { try { await Promise.ject(new Error('Oops!')); } catch (err) { console.error(error.message); } } try/catch同样也可以处理

  • JS常见错误(Error)及处理方案详解

    1. 错误的类型 Error: 所有错误的父类型 错误的子类型包括: ReferenceError: 引用的变量不存在 TypeError: 数据类型不正确的错误 RangeError: 数据值不在其所允许的范围内 SyntaxError: 语法错误 常见的内置错误: (1)ReferenceError: 引用变量不存在 console.log(a) //ReferenceError: a is not defined (2)TypeError: 数据类型不正确 var b = {} b.xxx

  • 前端JS图片懒加载原理方案详解

    目录 背景 原理 方案 方案一:img的loading属性设为“lazy” 使用方法 优点 兼容性 缺点 方案二:通过offsetTop来计算是否在可视区域内 优化 优点 缺点 方案三:通过getBoundingClientRect来计算是否在可视区域内 方案四:使用IntersectionObserver来判断是否在可视区域内 兼容性 优点 缺点 问题 布局抖动 响应式图片 SEO不友好 插件 背景 懒加载经常出现在前端面试中,是前端性能优化的常用技巧.懒加载也叫延迟加载,把非关键资源先不加载

  • Python eval的常见错误封装及利用原理详解

    最近在代码评审的过程,发现挺多错误使用eval导致代码注入的问题,比较典型的就是把eval当解析dict使用,有的就是简单的使用eval,有的就是错误的封装了eval,供全产品使用,这引出的问题更严重,这些都是血淋淋的教训,大家使用的时候多加注意. 下面列举一个实际产品中的例子,详情见[bug83055][1]: def remove(request, obj): query = query2dict(request.POST) eval(query['oper_type'])(query, c

  • JS前端常见的竞态问题解决方法详解

    JS前端常见的竞态问题解决方法详解

    目录 什么是竞态问题 取消过期请求 XMLHttpRequest 取消请求 fetch API 取消请求 axios 取消请求 可取消的 promise 忽略过期请求 封装指令式 promise 使用唯一 id 标识每次请求 「取消」和「忽略」的比较 「取消」更实际 「忽略」更通用 总结 什么是竞态问题 竞态问题,又叫竞态条件(race condition),它旨在描述一个系统或者进程的输出依赖于不受控制的事件出现顺序或者出现时机. 此词源自于两个信号试着彼此竞争,来影响谁先输出. 简单来说,竞

  • 纯js实现高度可扩展关键词高亮方案详解

    纯js实现高度可扩展关键词高亮方案详解

    目录 关键词高亮 1. 实现的主要功能: 2. 效果演示 高级定制用法 用法 1. react中使用 2. 原生js使用innerHTML 源码 核心源码 渲染方案 1. react组件渲染 2. innerHTML渲染 showcase演示组件 关键词高亮 日常需求开发中常见需要高亮的场景,本文主要记录字符串渲染时多个关键词同时高亮的实现方法,目的是实现高度可扩展的多关键词高亮方案. 1. 实现的主要功能: 关键词提取和高亮 多个关键词同时高亮 关键词支持正则匹配 每个关键字支持独立样式配置,

  • Go语音开发中常见Error类型处理示例详解

    目录 前言 透明错误处理策略 带来的问题 哨兵(Sentinel)错误处理策略 带来的问题 1.对errors.Error()的依赖 2.定义的错误类型会被公开 Error types 带来的问题 不透明错误处理策略(Opaque errors) 带来的问题 总结 前言 上文我们了解了 Error 在Go 中的设计理念.单从理念上来看, Error 的设计似乎有利于逻辑处理.但实际上,在开发过程中,我们还会遇到各种各样的困难.为了优化开发的流程,开发者们发明了很多处理 Error 的做法.今天我

  • JS技巧多状态页面中的mock方案详解

    目录 引言 技术选型 业务逻辑改造 Eruda 插件 Mock 数据整理 引言 我们有时候会遇到一个业务页面存在很多个状态,甚至子状态,比如订单详情就是其中的典型,涉及从订单创建到订单结束,以及售后等流程.维护起来每个状态对应一份数据,虽然我们 QA 提供了数据构造平台,但构造一份对应状态的数据还是需要花费不少时间,而且串行流程一旦出错的话只能重新来一遍. 后期维护阶段也不容易构造对应状态的数据,导致排查页面问题比较耗时. 另外一个问题就是从头熟悉业务的话成本比较高,如果有一个直观的页面能够看到

  • Vue如何防止按钮重复点击方案详解

    目录 前言 目的 文件结构 实现 请求拦截 响应拦截 取消重复发送请求 调用 前言 Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中. axios 是目前最优秀的 HTTP 请求库之一, 我们封装 axios 请求也是为了让代码看的更加清晰, 后期好维护. 目的 实现请求拦截 实现响应拦截 常见错误处理 不能请求头设置 api 集中式管理 (取消重复请求,重复发送请求, 请求缓存等情况均还未实现) 文件结构 实现 index.js内代码如下: 引入

  • JavaScript 中断请求几种方案详解

    目录 1 Promise 中断调用链 中断Promise 包装abort方法--仿照Axios的CancelToken 2 RXJS的unsubscribe方法 3 Axios的CancelToken 1 Promise Promise有一个缺点是一旦创建无法取消,所以本质上Promise是无法被终止的. 但是我们可以通过中断调用链或中断Promise来模拟请求的中断. 中断调用链 中断调用链就是在某一个then/catch执行之后,后续的链式调用(包括then,catch,finally)不再

  • Python中更优雅的日志记录方案详解

    目录 常见使用 loguru 安装 基本使用 详细使用 在 Python 中,一般情况下我们可能直接用自带的 logging 模块来记录日志,包括我之前的时候也是一样.在使用时我们需要配置一些 Handler.Formatter 来进行一些处理,比如把日志输出到不同的位置,或者设置一个不同的输出格式,或者设置日志分块和备份.但其实个人感觉 logging 用起来其实并不是那么好用,其实主要还是配置较为繁琐. 常见使用 首先看看 logging 常见的解决方案吧,我一般会配置输出到文件.控制台和

随机推荐