关于前端:前端开发中的trycatch

根本构造

try {throw new Error('Hello world');
  console.log('抛出谬误后，这里就不会执行了')
} catch (err) {
  // 只有 try 抛出谬误这里才会执行
  console.error(err.message); // Hello world
} finally {console.log('无论如何都会执行');
}

catch捕捉的 Error 对象中蕴含以下属性：

• name：是谬误的名称，例如“Error”,“SyntaxError”,“ReferenceError”等。
• message：无关谬误详细信息的音讯。
• stack：是用于调试目标的谬误的堆栈跟踪。

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

1. EvalError: 示意对于全局 eval() 函数的谬误，这个异样不再由 JS 抛出，它的存在是为了向后兼容。
2. RangeError：当援用一个不存在的变量时，将引发 ReferenceError。
3. SyntaxError：当你在 JS 代码中应用任何谬误的语法时，都会引发SyntaxError。
4. TypeError：如果该值不是预期的类型，则抛出TypeError。比方1();
5. URIError：如果以谬误的形式应用全局 URI 办法，则会抛出URIError。比方decodeURI("%%%");

try 不可单身

try {throw new Error('Hello World');
}

ⓧ Uncaught SyntaxError: Missing catch or finally after try

每个 try 块必须与至多一个 catch 或finally块，否则会抛出 SyntaxError 谬误。

throw

throw <expression>

throw语句用于引发异样。

// throw 根底类型
throw "error";
throw 11;
throw true;
throw {toString: function() {return "I'm an object!";} };

// throw error 对象
throw new Error('通用谬误');
throw new SyntaxError('语法错误');
throw new ReferenceError('援用谬误');

// throw 自定义谬误对象
function ValidationError(message) {
  this.message = message;
  this.name = 'ValidationError';
}
throw new ValidationError('这是我的自定义');

try 和 throw

try {throw new Error('Hello World');
} catch (err) {console.error(err.message);// Hello World
}

try 生效

try {~!$%   // 有效代码} catch(err) {
  // 这里捕捉不到谬误
  console.log("这里不会被执行");
}

报错

➤ ⓧ Uncaught SyntaxError: Invalid or unexpected token

异步捕捉

try {setTimeout(function() {test;   // 未定义变量}, 1000);
} catch (err) {console.log("这里不会被执行");
}

须要更换一下形式

setTimeout(function() {
  try {test;} catch(err) {console.log("这里会捕捉到谬误");
  }
}, 1000);

嵌套

try {
  try {throw new Error('Hello world');
  } catch (err) {throw err; // 将谬误向上抛出}
} catch (err) {console.error(err.message); // Hello world
}

邂逅 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);
  })

邂逅 async await

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)
    }
})();