首页
学习
活动
专区
圈层
工具
发布

你必须掌握的 7 种 JavaScript 错误类型

dog ^ ReferenceError: dog is not defined 每当我们创建或定义变量时,变量名称都会写入环境记录中。...调用尚未定义的函数。 现在,当我们创建或定义一个没有赋值的变量时。 该变量以键作为变量名称写入环境记录,但该值将保持未定义状态。...can't find it 注意:未定义的变量不会抛出ReferenceError,因为它存在于环境记录中只是它的值尚未设置。...解析期间,JS引擎捕获了此错误。 在JS引擎中,我们的代码经过不同的阶段,然后才能在终端上看到这些结果。...如果我们使用错误的参数调用它们中的任何一个,我们将得到URIErro decodeURI("%") ^ URIError: URI malformed encodeURI,获取URI的未编码版本。

6.2K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    try..catch 不能捕获的错误有哪些?注意事项又有哪些?

    我们还会讲一下 JS 中内置的错误对象(Error, SyntaxError, ReferenceError等)以及如何定义自定义错误。...JS 代码,例如try块中的以下代码在语法上是错误的,但它不会被catch块捕获。...noSuchVariable; // undefined variable }, 1000); } catch (err) { console.log("这里不会被执行"); } 未捕获的...Error: Error while executing the code 这里注意两件事: 即使从try块抛出错误后,也会执行finally块 如果没有catch块,错误将不能被优雅地处理,从而导致未捕获的错误...JS 中的内置错误 3.1 Error JavaScript 有内置的错误对象,它通常由try块抛出,并在catch块中捕获,Error 对象包含以下属性: name:是错误的名称,例如 “Error”

    4.1K20

    前端开发,如何优雅处理前端异常?

    :ReferenceError: nam is not defined at anonymous>:3:15 不能捕获到具体的语法错误,只有一个语法错误提示。...无法捕获语法错误; 到这里基本就清晰了:在实际的使用过程中,onerror 主要是来捕获预料之外的错误,而 try-catch 则是用来在可预见情况下监控特定的错误,两者结合使用更加高效。...这些 error 事件不会向上冒泡到 window ,不过(至少在 Firefox 中)能被单一的window.addEventListener 捕获。...没有写 catch 的 Promise 中抛出的错误无法被 onerror 或 try-catch 捕获到,所以我们务必要在 Promise 中不要忘记写 catch 处理抛出的异常。...十二、错误上报 1.通过 Ajax 发送数据 因为 Ajax 请求本身也有可能会发生异常,而且有可能会引发跨域问题,一般情况下更推荐使用动态创建 img 标签的形式进行上报。

    1.4K10

    一篇文章教你如何捕获前端错误

    e.g: 下图是当使用了未定义的变量"foo",导致产生js运行时错误时的上报数据: ? 2、资源加载错误 这里的静态资源包括js、css以及image等。...3、未处理的promise错误 未使用catch捕获的promise错误,往往都会存在比较大的风险。而编码时有可能覆盖的不够全面,因此有必要监控未处理的promise错误并进行上报。...('error')都能捕获,但是window.onerror含有详细的error堆栈信息,存在error.stack中,所以我们选择使用onerror的方式对js运行时错误进行捕获。...因此,浏览器只允许同域下的脚本捕获具体错误信息,而其他脚本只知道发生了一个错误,但无法获知错误的具体内容。 解决方案1:(推荐) 添加 crossorigin="anonymous" 属性。...", "", 0, 0, undefined (滑动查看) 可见 try catch 中的 Console 语句输出了完整的信息,但 window.onerror 中只能捕获“Script error”

    5.4K40

    如何优雅处理前端异常?

    : 捕获到异常:ReferenceError: nam is not defined at anonymous>:3:15 不能捕获到语法错误 我们修改一下代码,删掉一个单引号: try {...无法捕获语法错误; 到这里基本就清晰了:在实际的使用过程中,onerror 主要是来捕获预料之外的错误,而 try-catch 则是用来在可预见情况下监控特定的错误,两者结合使用更加高效。...这些 error 事件不会向上冒泡到 window ,不过(至少在 Firefox 中)能被单一的window.addEventListener 捕获。...没有写 catch 的 Promise 中抛出的错误无法被 onerror 或 try-catch 捕获到,所以我们务必要在 Promise 中不要忘记写 catch 处理抛出的异常。...错误上报 通过 Ajax 发送数据 因为 Ajax 请求本身也有可能会发生异常,而且有可能会引发跨域问题,一般情况下更推荐使用动态创建 img 标签的形式进行上报。

    2.1K20

    如何优雅处理前端异常?

    捕获到异常: ReferenceError: nam is not defined at anonymous>:3:15 2....无法捕获语法错误; 到这里基本就清晰了:在实际的使用过程中,onerror 主要是来捕获预料之外的错误,而 try-catch 则是用来在可预见情况下监控特定的错误,两者结合使用更加高效。...这些 error 事件不会向上冒泡到 window ,不过(至少在 Firefox 中)能被单一的window.addEventListener 捕获。...没有写 catch 的 Promise 中抛出的错误无法被 onerror 或 try-catch 捕获到,所以我们务必要在 Promise 中不要忘记写 catch 处理抛出的异常。...通过 Ajax 发送数据 因为 Ajax 请求本身也有可能会发生异常,而且有可能会引发跨域问题,一般情况下更推荐使用动态创建 img 标签的形式进行上报。 2.

    2.6K30

    一篇文章教你如何捕获前端错误

    e.g: 下图是当使用了未定义的变量"foo",导致产生js运行时错误时的上报数据: 2、资源加载错误 这里的静态资源包括js、css以及image等。...e.g: 下图是图片资源不存在时的上报数据: 3、未处理的promise错误 未使用catch捕获的promise错误,往往都会存在比较大的风险。...使用window.onerror和window.addEventListener('error')都能捕获,但是window.onerror含有详细的error堆栈信息,存在error.stack中,...因此,浏览器只允许同域下的脚本捕获具体错误信息,而其他脚本只知道发生了一个错误,但无法获知错误的具体内容。 解决方案1:(推荐) 添加 crossorigin="anonymous" 属性。...", "", 0, 0, undefined 可见 try catch 中的 Console 语句输出了完整的信息,但 window.onerror 中只能捕获“Script error”。

    4.4K90

    如何优雅处理前端异常?(史上最全前端异常处理方案)

    : 捕获到异常:ReferenceError: nam is not defined at anonymous>:3:15 不能捕获到具体的语法错误,只有一个语法错误提示。...无法捕获语法错误; 到这里基本就清晰了:在实际的使用过程中,onerror 主要是来捕获预料之外的错误,而 try-catch 则是用来在可预见情况下监控特定的错误,两者结合使用更加高效。...这些 error 事件不会向上冒泡到 window ,不过(至少在 Firefox 中)能被单一的window.addEventListener 捕获。...没有写 catch 的 Promise 中抛出的错误无法被 onerror 或 try-catch 捕获到,所以我们务必要在 Promise 中不要忘记写 catch 处理抛出的异常。...十二、错误上报 1.通过 Ajax 发送数据 因为 Ajax 请求本身也有可能会发生异常,而且有可能会引发跨域问题,一般情况下更推荐使用动态创建 img 标签的形式进行上报。

    4.8K10

    JS 面试总结 理论篇

    由于浏览器可以渲染DOM,JS也可以修改DOM结构,未避免冲突,JS执行的时候,浏览器DOM渲染会停止。 两段JS不能同时执行。...关于$ajax 中的 async 参数 async默认的设置值为true,这种情况为异步方式,就是说当ajax发送请求后,在等待server端返回的这个过程中,前台会继续 执行ajax块后面的脚本,直到...console.log(e); // ReferenceError: c is not defined } 缺点:增加代码量和维护性,不适用于整个项目的异常捕获。...在MVVM框架中如果你一如既往的想使用window.onerror来捕获异常,那么很可能会竹篮打水一场空,或许根本捕获不到,因为你的异常信息被框架自身的异常机制捕获了。...使用Vue.config.errorHandler这样的Vue全局配置,可以在Vue指定组件的渲染和观察期间未捕获错误的处理函数。这个处理函数被调用时,可获取错误信息和Vue 实例。

    1.8K30

    1000多个项目中的十大JavaScript错误以及如何避免

    (unknown): Script Error 当未捕获的 JavaScript 错误违背跨边界原则时,就会发生脚本错误。...例如,如果将 JavaScript 代码托管在 CDN 上,则任何未被捕获的错误(通过 window.onerror 处理程序发出的错误,而不是 try-catch 中捕获到的错误)将仅报告为“脚本错误...在脚本标签上设置crossorigin =“anonymous” 在你的 HTML 源代码中,为每一个脚本设置 Access-Control-Allow-Origin,在设置 SCRIPT 标签中,设置...通常在数组中能够找到定义的长度,但是如果数组未初始化或变量名在另一个上下文中隐藏,则可能会出现这种错误。让我们用下面的例子来解释这种错误。...ReferenceError: Event Is Not Defined 尝试访问未定义的变量或当前范围之外的变量时会引发此错误。 ?

    13.5K40

    前端异常捕获和定位

    在 catch 中我们也可以发送相关埋点到我们的监控平台。 关于 Vue 异常捕获 之所以会存在这种场景,是因为 Vue 自身已经通过 try...catch......指定组件的渲染和观察期间未捕获错误的处理函数。..."> 在 webpack 中,我们可以设置 output 中 crossOriginLoading 为 anonymous,如下所示 output: { path: path.resolve...这个涉及到了事件循环(Event Loop)相关知识了,首先 js 是单线程的,当我们 try 中执行的代码是异步的时候,当异步执行报错时候,可能同步代码已经从执行栈中取出并执行完毕了,所以没有办法捕获到异步的异常.../5e099ee3f265da33910a547d [6] JS 异步错误捕获二三事: https://juejin.im/post/5cc15de5e51d456e68659340

    1.7K10

    bootsrap+jquery+组件项目引入文件的常见报错报错一:Uncaught ReferenceError: $ is not defined报错二:jsp页面相对路径和绝对路径的问题:报错三:

    做一个项目的时候 ,控制台总是会出现各种bug,其实不用慌张,终结起来也就几种类型的错误,在开发中每次遇到错误都善于总结,下次在看到就会胸有成竹知道是什么情况了,以下是在开发过程中总结的一些错误以及错误的解决方法...报错一:Uncaught ReferenceError: $ is not defined Uncaught ReferenceError: $ is not defined Uncaught ReferenceError...anonymous> (app.js:42) at l (jquery.min.js:4) at Object.fireWith [as resolveWith] (jquery.min.js...尝试删除 ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"> 解决办法...anonymous> (dashboard.js:12) at l (VM552 jquery.min.js:4) at Object.fireWith [as resolveWith

    27K40

    javaScript代码飘红报错看不懂?读完这篇文章再试试!

    若要快速解决项目开发过程中遇到的各种刁钻Error,首先要快速识破它的本质!而不是一味的依赖第六感去猜测,更不该盲目凭借自身的幸运值去不断尝试解决!...] 范围;界限;区间; 类; 种; token [ˈtəʊkən] 令牌;标记 try [traɪ] 尝试 throw [θrəʊ] 投;掷;抛;扔;摔;丢;猛推;使劲撞 Uncaught 未捕获...常见的四种Error类型 1、ReferenceError(引用错误):使用了未定义的变量。...// 1、变量未定义便直接使用 console.log(my); // 报错:Uncaught ReferenceError: my is not defined // 翻译:my未定义 // 2、将变量赋值给一个无法被赋值的东东...•在try中,尽量少的包含可能出错的代码。•无法提前预知错误类型的错误,必须用try catch捕获。•finally可以省略。

    9.1K20

    1000多个项目中的十大JavaScript错误以及如何避免

    Type your name" /> (unknown): Script Error 当未捕获的...例如,如果将 JavaScript 代码托管在 CDN 上,则任何未被捕获的错误(通过 window.onerror 处理程序发出的错误,而不是 try-catch 中捕获到的错误)将仅报告为“脚本错误...在脚本标签上设置crossorigin =“anonymous” 在你的 HTML 源代码中,为每一个脚本设置 Access-Control-Allow-Origin,在设置 SCRIPT 标签中,设置...[image.png] 通常在数组中能够找到定义的长度,但是如果数组未初始化或变量名在另一个上下文中隐藏,则可能会出现这种错误。让我们用下面的例子来解释这种错误。...ReferenceError: Event Is Not Defined 尝试访问未定义的变量或当前范围之外的变量时会引发此错误。

    10.8K30
    领券