首页 >> js开发 >> jsjavaScript代码飘红报错看不懂?读完这篇文章再试试js大全
jsjavaScript代码飘红报错看不懂?读完这篇文章再试试js大全
发布时间: 2021年1月13日 | 浏览:
| 分类:js开发
一、本文将会出现以下英语词汇
一、本文将会出现以下英语词汇一、本文将会出现以下英语词汇assignment[əˈsaɪnmənt] 赋值;分配
assignment [əˈsaɪnmənt] 分配;任务
call [kɔːl]
调用
caught [kɔːt]
捕获;接住;截住;拦住;
constructor [kənˈstrʌktə(r)] 构造器
cannot [ˈkænɒt]
不是
catch [kætʃ]
接住;抓住
constant[ˈkɒnstənt]
常量
defined [dɪˈfaɪnd]
定义
error [ˈerə(r)]
错误; 差错; 谬误;
exceeded [ɪkˈsiːdɪd]
超过
function [ˈfʌŋkʃn]
函数
finally [ˈfaɪnəli]
最终;最后
invalid [ɪnˈvælɪd]
不承认的; 无效的
initializer [ɪˈnɪʃəˌlaɪzə]
初始值
left-hand [ˈleft hænd]
左边的
Maximum [ˈmæksɪməm]
最大
property [ˈprɒpəti]
属性;财产
stack [stæk]
堆栈
shorthand [ˈʃɔːthænd]
syntax [ˈsɪntæks]
句法; 句法规则; 语构;
side [saɪd] 一边;一侧;
reference [ˈrefrəns]
谈及; 涉及;
range [reɪndʒ]
范围;界限;区间; 类; 种;
token [ˈtəʊkən]
令牌;标记
try [traɪ]
尝试
throw [θrəʊ]
投;掷;抛;扔;摔;丢;猛推;使劲撞
Uncaught
未捕获
unexpected [ˌʌnɪkˈspektɪd]
出乎意料的;始料不及的
undefined [ˌʌndɪˈfaɪnd]
未定义
variable[ˈveəriəbl]
变量
二、带你领略JS常见的四种Error类型二、带你领略JS常见的四种Error类型二、带你领略JS常见的四种Error类型1、ReferenceError(引用错误):使用了未定义的变量。错误之前的代码会执行,之后代码不会执行。
// 1、变量未定义便直接使用
console.log(my);
// 报错:Uncaught ReferenceError: my is not defined
// 翻译:my未定义
// 2、将变量赋值给一个无法被赋值的东东
Math.random()=1;
// 报错:Uncaught ReferenceError: Invalid left-hand side in assignment
// 翻译:左侧的赋值无效
// 1、变量未定义便直接使用
console.log(my);
// 报错:Uncaught ReferenceError: my is not defined
// 翻译:my未定义
// 2、将变量赋值给一个无法被赋值的东东
Math.random()=1;
// 报错:Uncaught ReferenceError: Invalid left-hand side in assignment
// 翻译:左侧的赋值无效
2、TypeError(类型错误):变量或参数不是预期类型,或调用对象不存在的属性方法。错误之前的代码会执行,之后代码不会执行。
// 1、变量不是预期类型,比如对字符串、布尔值、数值等原始类型的值使用new命令。
let userName = new "zhangpeiyue";
// 报错:Uncaught TypeError: "zhangpeiyue" is not a constructor
// 翻译:"zhangpeiyue" 不是一个构造函数。new 操作符后应该是一个构造函数
// 2、变量不是预期类型,比如变量被作为函数来使用
let userName = "zhangpeiyue";
console.log(userName())
// 报错:Uncaught TypeError: userName is not a function
// 翻译:userName 不是一个函数
// 3、对象的属性或方法不存在
const obj = undefined;// 为null也会报错
console.log(obj.userName);
// 报错:Uncaught TypeError: Cannot read property 'userName' of undefined
// 翻译:undefined的环境下无法读取属性“userName”
// 1、变量不是预期类型,比如对字符串、布尔值、数值等原始类型的值使用new命令。
let userName = new "zhangpeiyue";
// 报错:Uncaught TypeError: "zhangpeiyue" is not a constructor
// 翻译:"zhangpeiyue" 不是一个构造函数。new 操作符后应该是一个构造函数
// 2、变量不是预期类型,比如变量被作为函数来使用
let userName = "zhangpeiyue";
console.log(userName())
// 报错:Uncaught TypeError: userName is not a function
// 翻译:userName 不是一个函数
// 3、对象的属性或方法不存在
const obj = undefined;// 为null也会报错
console.log(obj.userName);
// 报错:Uncaught TypeError: Cannot read property 'userName' of undefined
// 翻译:undefined的环境下无法读取属性“userName”
3、RangeError(范围错误):数据值不在JS所允许的范围内。错误之前的代码会执行,之后代码不会执行。
// 1、递归函数未设置跳出的条件
function run(){
run();
}
run();
// 报错:Uncaught RangeError: Maximum call stack size exceeded
// 翻译:超出最大调用堆栈大小。原因函数一直调用,直到达到调用堆栈限制。
// 2、无效的数组长度,应该是个正整数
const arr =new Array(-1);
// 报错:Uncaught RangeError: Invalid array length
// 翻译:无效的数组长度
// 1、递归函数未设置跳出的条件
function run(){
run();
}
run();
// 报错:Uncaught RangeError: Maximum call stack size exceeded
// 翻译:超出最大调用堆栈大小。原因函数一直调用,直到达到调用堆栈限制。
// 2、无效的数组长度,应该是个正整数
const arr =new Array(-1);
// 报错:Uncaught RangeError: Invalid array length
// 翻译:无效的数组长度
4、SyntaxError(语法错误):即写的代码不符合js编码规则。我们可以根据后面的信息提示去修改错误,当然,语法错误,浏览器会直接报错,整个代码都不会执行。
// 1、程序错误,比如写错,或者缺少 , ) ; } 这些符号。
const obj = {;
// 报错:Uncaught SyntaxError: Unexpected token ';'
// 翻译:";"该标记有些出乎意料。
// 2、变量定义不合法
let 8userName = "zhangpeiyue";
// 报错:Uncaught SyntaxError: Invalid or unexpected token
// 翻译:定义的变量标记无效
// 3、对象属性赋值语法错误
const obj = {
userName = "zhangpeiyue"
}
// 报错:Uncaught SyntaxError: Invalid shorthand property initializer
// 翻译:对象属性初始值无效。原因:对象中属性与其对应的值之间使用“=”
// 语法错误有很多,在此就不一一列举了
// 1、程序错误,比如写错,或者缺少 , ) ; } 这些符号。
const obj = {;
// 报错:Uncaught SyntaxError: Unexpected token ';'
// 翻译:";"该标记有些出乎意料。
// 2、变量定义不合法
let 8userName = "zhangpeiyue";
// 报错:Uncaught SyntaxError: Invalid or unexpected token
// 翻译:定义的变量标记无效
// 3、对象属性赋值语法错误
const obj = {
userName = "zhangpeiyue"
}
// 报错:Uncaught SyntaxError: Invalid shorthand property initializer
// 翻译:对象属性初始值无效。原因:对象中属性与其对应的值之间使用“=”
// 语法错误有很多,在此就不一一列举了三、通过try…catch处理Error三、通过try…catch处理Error三、通过try…catch处理Error1、被try包裹的代码块一旦出现Error,会将Error传递给catch并运行catch代码块。不会影响后续代码运行。
try{
console.log(userName);
}catch (err) {
// ReferenceError: userName is not defined
console.log(err);
}
console.log("我还会继续运行哦!!")
try{
console.log(userName);
}catch (err) {
// ReferenceError: userName is not defined
console.log(err);
}
console.log("我还会继续运行哦!!")2、出现SyntaxError(语法错误),不会被抛出。
try{
// Uncaught SyntaxError: Invalid or unexpected token
const 8userName = "zhangpeiyue";
}catch (err) {
console.log(err);
}
console.log("我不会继续运行了!!")
try{
// Uncaught SyntaxError: Invalid or unexpected token
const 8userName = "zhangpeiyue";
}catch (err) {
console.log(err);
}
console.log("我不会继续运行了!!")
3、通过 throw new Error 抛出错误
try{
throw new Error("出现异常了");
}catch (err) {
// 错误相关信息
console.log(err.message);// 出现异常了
// 函数调用栈记录信息
console.log(err.stack);// Error: 出现异常了
}
console.log("我还会继续运行哦!!")
try{
throw new Error("出现异常了");
}catch (err) {
// 错误相关信息
console.log(err.message);// 出现异常了
// 函数调用栈记录信息
console.log(err.stack);// Error: 出现异常了
}
console.log("我还会继续运行哦!!")
4、不管有没有异常,finally中的代码都会在try和catch之后执行
try{
throw new Error("出现异常了");
}catch (err) {
// 错误相关信息
console.log(err.message);// 出现异常了
// 函数调用栈记录信息
console.log(err.stack);// Error: 出现异常了
}finally {
// 不管有没有异常,我都会执行。哪怕你有return,我也会执行!
console.log("不管有没有异常,我都会执行。哪怕你有return,我也会执行!")
}
console.log("我还会继续运行哦!!")
try{
throw new Error("出现异常了");
}catch (err) {
// 错误相关信息
console.log(err.message);// 出现异常了
// 函数调用栈记录信息
console.log(err.stack);// Error: 出现异常了
}finally {
// 不管有没有异常,我都会执行。哪怕你有return,我也会执行!
console.log("不管有没有异常,我都会执行。哪怕你有return,我也会执行!")
}
console.log("我还会继续运行哦!!")
5、总结
只要不发生语法错误,程序即可不中断执行。
使用try包裹的代码,即使不出错,效率也比不用try包裹的代码低。
在try中,尽量少的包含可能出错的代码。
无法提前预知错误类型的错误,必须用try catch捕获。
finally可以省略。
只要不发生语法错误,程序即可不中断执行。使用try包裹的代码,即使不出错,效率也比不用try包裹的代码低。在try中,尽量少的包含可能出错的代码。无法提前预知错误类型的错误,必须用try catch捕获。finally可以省略。
try{
//可能发生错误的代码
}catch(err){
//只有发生错误时才执行的代码
}finally{
//无论是否出错,肯定都要执行的代码
}
try{
//可能发生错误的代码
}catch(err){
//只有发生错误时才执行的代码
}finally{
//无论是否出错,肯定都要执行的代码
}
最后,代码出现错误并不可怕,真正可怕的是你的业务及代码逻辑出现问题才是真正灾难的开始!
一、本文将会出现以下英语词汇一、本文将会出现以下英语词汇assignment[əˈsaɪnmənt] 赋值;分配
assignment [əˈsaɪnmənt] 分配;任务
call [kɔːl]
调用
caught [kɔːt]
捕获;接住;截住;拦住;
constructor [kənˈstrʌktə(r)] 构造器
cannot [ˈkænɒt]
不是
catch [kætʃ]
接住;抓住
constant[ˈkɒnstənt]
常量
defined [dɪˈfaɪnd]
定义
error [ˈerə(r)]
错误; 差错; 谬误;
exceeded [ɪkˈsiːdɪd]
超过
function [ˈfʌŋkʃn]
函数
finally [ˈfaɪnəli]
最终;最后
invalid [ɪnˈvælɪd]
不承认的; 无效的
initializer [ɪˈnɪʃəˌlaɪzə]
初始值
left-hand [ˈleft hænd]
左边的
Maximum [ˈmæksɪməm]
最大
property [ˈprɒpəti]
属性;财产
stack [stæk]
堆栈
shorthand [ˈʃɔːthænd]
syntax [ˈsɪntæks]
句法; 句法规则; 语构;
side [saɪd] 一边;一侧;
reference [ˈrefrəns]
谈及; 涉及;
range [reɪndʒ]
范围;界限;区间; 类; 种;
token [ˈtəʊkən]
令牌;标记
try [traɪ]
尝试
throw [θrəʊ]
投;掷;抛;扔;摔;丢;猛推;使劲撞
Uncaught
未捕获
unexpected [ˌʌnɪkˈspektɪd]
出乎意料的;始料不及的
undefined [ˌʌndɪˈfaɪnd]
未定义
variable[ˈveəriəbl]
变量
二、带你领略JS常见的四种Error类型二、带你领略JS常见的四种Error类型二、带你领略JS常见的四种Error类型1、ReferenceError(引用错误):使用了未定义的变量。错误之前的代码会执行,之后代码不会执行。
// 1、变量未定义便直接使用
console.log(my);
// 报错:Uncaught ReferenceError: my is not defined
// 翻译:my未定义
// 2、将变量赋值给一个无法被赋值的东东
Math.random()=1;
// 报错:Uncaught ReferenceError: Invalid left-hand side in assignment
// 翻译:左侧的赋值无效
// 1、变量未定义便直接使用
console.log(my);
// 报错:Uncaught ReferenceError: my is not defined
// 翻译:my未定义
// 2、将变量赋值给一个无法被赋值的东东
Math.random()=1;
// 报错:Uncaught ReferenceError: Invalid left-hand side in assignment
// 翻译:左侧的赋值无效
2、TypeError(类型错误):变量或参数不是预期类型,或调用对象不存在的属性方法。错误之前的代码会执行,之后代码不会执行。
// 1、变量不是预期类型,比如对字符串、布尔值、数值等原始类型的值使用new命令。
let userName = new "zhangpeiyue";
// 报错:Uncaught TypeError: "zhangpeiyue" is not a constructor
// 翻译:"zhangpeiyue" 不是一个构造函数。new 操作符后应该是一个构造函数
// 2、变量不是预期类型,比如变量被作为函数来使用
let userName = "zhangpeiyue";
console.log(userName())
// 报错:Uncaught TypeError: userName is not a function
// 翻译:userName 不是一个函数
// 3、对象的属性或方法不存在
const obj = undefined;// 为null也会报错
console.log(obj.userName);
// 报错:Uncaught TypeError: Cannot read property 'userName' of undefined
// 翻译:undefined的环境下无法读取属性“userName”
// 1、变量不是预期类型,比如对字符串、布尔值、数值等原始类型的值使用new命令。
let userName = new "zhangpeiyue";
// 报错:Uncaught TypeError: "zhangpeiyue" is not a constructor
// 翻译:"zhangpeiyue" 不是一个构造函数。new 操作符后应该是一个构造函数
// 2、变量不是预期类型,比如变量被作为函数来使用
let userName = "zhangpeiyue";
console.log(userName())
// 报错:Uncaught TypeError: userName is not a function
// 翻译:userName 不是一个函数
// 3、对象的属性或方法不存在
const obj = undefined;// 为null也会报错
console.log(obj.userName);
// 报错:Uncaught TypeError: Cannot read property 'userName' of undefined
// 翻译:undefined的环境下无法读取属性“userName”
3、RangeError(范围错误):数据值不在JS所允许的范围内。错误之前的代码会执行,之后代码不会执行。
// 1、递归函数未设置跳出的条件
function run(){
run();
}
run();
// 报错:Uncaught RangeError: Maximum call stack size exceeded
// 翻译:超出最大调用堆栈大小。原因函数一直调用,直到达到调用堆栈限制。
// 2、无效的数组长度,应该是个正整数
const arr =new Array(-1);
// 报错:Uncaught RangeError: Invalid array length
// 翻译:无效的数组长度
// 1、递归函数未设置跳出的条件
function run(){
run();
}
run();
// 报错:Uncaught RangeError: Maximum call stack size exceeded
// 翻译:超出最大调用堆栈大小。原因函数一直调用,直到达到调用堆栈限制。
// 2、无效的数组长度,应该是个正整数
const arr =new Array(-1);
// 报错:Uncaught RangeError: Invalid array length
// 翻译:无效的数组长度
4、SyntaxError(语法错误):即写的代码不符合js编码规则。我们可以根据后面的信息提示去修改错误,当然,语法错误,浏览器会直接报错,整个代码都不会执行。
// 1、程序错误,比如写错,或者缺少 , ) ; } 这些符号。
const obj = {;
// 报错:Uncaught SyntaxError: Unexpected token ';'
// 翻译:";"该标记有些出乎意料。
// 2、变量定义不合法
let 8userName = "zhangpeiyue";
// 报错:Uncaught SyntaxError: Invalid or unexpected token
// 翻译:定义的变量标记无效
// 3、对象属性赋值语法错误
const obj = {
userName = "zhangpeiyue"
}
// 报错:Uncaught SyntaxError: Invalid shorthand property initializer
// 翻译:对象属性初始值无效。原因:对象中属性与其对应的值之间使用“=”
// 语法错误有很多,在此就不一一列举了
// 1、程序错误,比如写错,或者缺少 , ) ; } 这些符号。
const obj = {;
// 报错:Uncaught SyntaxError: Unexpected token ';'
// 翻译:";"该标记有些出乎意料。
// 2、变量定义不合法
let 8userName = "zhangpeiyue";
// 报错:Uncaught SyntaxError: Invalid or unexpected token
// 翻译:定义的变量标记无效
// 3、对象属性赋值语法错误
const obj = {
userName = "zhangpeiyue"
}
// 报错:Uncaught SyntaxError: Invalid shorthand property initializer
// 翻译:对象属性初始值无效。原因:对象中属性与其对应的值之间使用“=”
// 语法错误有很多,在此就不一一列举了三、通过try…catch处理Error三、通过try…catch处理Error三、通过try…catch处理Error1、被try包裹的代码块一旦出现Error,会将Error传递给catch并运行catch代码块。不会影响后续代码运行。
try{
console.log(userName);
}catch (err) {
// ReferenceError: userName is not defined
console.log(err);
}
console.log("我还会继续运行哦!!")
try{
console.log(userName);
}catch (err) {
// ReferenceError: userName is not defined
console.log(err);
}
console.log("我还会继续运行哦!!")2、出现SyntaxError(语法错误),不会被抛出。
try{
// Uncaught SyntaxError: Invalid or unexpected token
const 8userName = "zhangpeiyue";
}catch (err) {
console.log(err);
}
console.log("我不会继续运行了!!")
try{
// Uncaught SyntaxError: Invalid or unexpected token
const 8userName = "zhangpeiyue";
}catch (err) {
console.log(err);
}
console.log("我不会继续运行了!!")
3、通过 throw new Error 抛出错误
try{
throw new Error("出现异常了");
}catch (err) {
// 错误相关信息
console.log(err.message);// 出现异常了
// 函数调用栈记录信息
console.log(err.stack);// Error: 出现异常了
}
console.log("我还会继续运行哦!!")
try{
throw new Error("出现异常了");
}catch (err) {
// 错误相关信息
console.log(err.message);// 出现异常了
// 函数调用栈记录信息
console.log(err.stack);// Error: 出现异常了
}
console.log("我还会继续运行哦!!")
4、不管有没有异常,finally中的代码都会在try和catch之后执行
try{
throw new Error("出现异常了");
}catch (err) {
// 错误相关信息
console.log(err.message);// 出现异常了
// 函数调用栈记录信息
console.log(err.stack);// Error: 出现异常了
}finally {
// 不管有没有异常,我都会执行。哪怕你有return,我也会执行!
console.log("不管有没有异常,我都会执行。哪怕你有return,我也会执行!")
}
console.log("我还会继续运行哦!!")
try{
throw new Error("出现异常了");
}catch (err) {
// 错误相关信息
console.log(err.message);// 出现异常了
// 函数调用栈记录信息
console.log(err.stack);// Error: 出现异常了
}finally {
// 不管有没有异常,我都会执行。哪怕你有return,我也会执行!
console.log("不管有没有异常,我都会执行。哪怕你有return,我也会执行!")
}
console.log("我还会继续运行哦!!")
5、总结
只要不发生语法错误,程序即可不中断执行。
使用try包裹的代码,即使不出错,效率也比不用try包裹的代码低。
在try中,尽量少的包含可能出错的代码。
无法提前预知错误类型的错误,必须用try catch捕获。
finally可以省略。
只要不发生语法错误,程序即可不中断执行。使用try包裹的代码,即使不出错,效率也比不用try包裹的代码低。在try中,尽量少的包含可能出错的代码。无法提前预知错误类型的错误,必须用try catch捕获。finally可以省略。
try{
//可能发生错误的代码
}catch(err){
//只有发生错误时才执行的代码
}finally{
//无论是否出错,肯定都要执行的代码
}
try{
//可能发生错误的代码
}catch(err){
//只有发生错误时才执行的代码
}finally{
//无论是否出错,肯定都要执行的代码
}
最后,代码出现错误并不可怕,真正可怕的是你的业务及代码逻辑出现问题才是真正灾难的开始!
相关文章:
- js微信小程序自定义tabBar的踩坑实践记录js大全
- js详解Java中String JSONObject JSONArray List<实体类>转换js大全
- js关于Vue中$refs的探索浅析js大全
- jsvant中的toast轻提示实现代码js大全
- jsnuxt引入组件和公共样式的操作js大全
- jsVant 中的Toast设置全局的延迟时间操作js大全
- js如何实现小程序与小程序之间的跳转js大全
- jsArray.filter中如何正确使用Asyncjs大全
- jsnuxt 服务器渲染动态设置 title和seo关键字的操作js大全
- js解决vue项目中遇到 Cannot find module ‘chalk‘ 报错的问题js大全