Console对象与错误处理机制

console的常见用途有两个。

调试程序,显示网页代码运行时的错误信息。

提供了一个命令行接口,用来与网页代码互动。

console对象的浏览器实现,包含在浏览器自带的开发工具之中。按 F12 打开

Console面板基本上就是一个命令行窗口,你可以在提示符下,键入各种命令。

console 对象的静态方法

console.log(),console.info(),console.debug()

console.log方法用于在控制台输出信息。它可以接受一个或多个参数,将它们连接起来输出。console.log方法会自动在每次输出的结尾,添加换行符。

如果第一个参数是格式字符串(使用了格式占位符),console.log方法将依次用后面的参数替换占位符,然后再进行输出。

console.log(' %s + %s = %s', 1, 1, 2)

//  1 + 1 = 2

%s 字符串

%d 整数

%i 整数

%f 浮点数

%o 对象的链接

%c CSS 格式字符串

var number = 11 * 9;

var color = 'red';

如果参数是一个对象,console.log会显示该对象的值。

console.log({foo: 'bar'})

// Object {foo: "bar"}

console.log(Date)

// function Date() { [native code] }

console.info是console.log方法的别名,用法完全一样。只不过console.info方法会在输出信息的前面,加上一个蓝色图标。

console.debug方法与console.log方法类似,会在控制台输出调试信息。但是,默认情况下,console.debug输出的信息不会显示,只有在打开显示级别在verbose的情况下,才会显示。

console对象的所有方法,都可以被覆盖。因此,可以按照自己的需要,定义console.log方法。

console.warn(),console.error()

warn方法和error方法也是在控制台输出信息,它们与log方法的不同之处在于,warn方法输出信息时,在最前面加一个黄色三角,表示警告;error方法输出信息时,在最前面加一个红色的叉,表示出错。同时,还会高亮显示输出文字和错误发生的堆栈。其他方面都一样。可以这样理解,log方法是写入标准输出(stdout),warn方法和error方法是写入标准错误(stderr)。

console.table()

对于某些复合类型的数据,console.table方法可以将其转为表格显示。

var languages = [

  { name: "JavaScript", fileExtension: ".js" },

  { name: "TypeScript", fileExtension: ".ts" },

  { name: "CoffeeScript", fileExtension: ".coffee" }

];

console.table(languages);

上面代码的language变量,转为表格显示如下。

(index)

name

fileExtension

0

"JavaScript"

".js"

1

"TypeScript"

".ts"

2

"CoffeeScript"

".coffee"

console.count()

count方法用于计数,输出它被调用了多少次。

function greet(user) {

  console.count();

  return 'hi ' + user;

}

greet('bob')

//  : 1

// "hi bob"

greet('alice')

//  : 2

// "hi alice"

上面代码每次调用greet函数,内部的console.count方法就输出执行次数。

console.dir(document.body)

Node 环境之中,还可以指定以代码高亮的形式输出。

console.clear方法用于清除当前控制台的所有输出,将光标回置到第一行。如果用户选中了控制台的“Preserve log”选项,console.clear方法将不起作用。

控制台命令行 API

Error 实例对象

JavaScript 解析或运行时,一旦发生错误,引擎就会抛出一个错误对象。JavaScript 原生提供Error构造函数,所有抛出的错误都是这个构造函数的实例。

var err = new Error('出错了');

err.message // "出错了"

上面代码中,我们调用Error构造函数,生成一个实例对象err。Error构造函数接受一个参数,表示错误提示,可以从实例的message属性读到这个参数。抛出Error实例对象以后,整个程序就中断在发生错误的地方,不再往下执行。JavaScript 语言标准只提到,Error实例对象必须有message属性,表示出错时的提示信息,没有提到其他属性。大多数 JavaScript 引擎,对Error实例还提供name和stack属性,分别表示错误的名称和错误的堆栈,但它们是非标准的,不是每种实现都有。

message:错误提示信息

name:错误名称(非标准属性)

stack:错误的堆栈(非标准属性)

原生错误类型

Error实例对象是最一般的错误类型,在它的基础上,JavaScript 还定义了其他6种错误对象。也就是说,存在Error的6个派生对象。

SyntaxError 对象

SyntaxError对象是解析代码时发生的语法错误。比如 变量名错误, 缺少括号

ReferenceError 对象

ReferenceError对象是引用一个不存在的变量时发生的错误。另一种触发场景是,将一个值分配给无法分配的对象,比如对函数的运行结果或者this赋值。

RangeError 对象

RangeError对象是一个值超出有效范围时发生的错误。主要有几种情况,一是数组长度为负数,二是Number对象的方法参数超出范围,以及函数堆栈超过最大值。

TypeError 对象

TypeError对象是变量或参数不是预期类型时发生的错误。比如,对字符串、布尔值、数值等原始类型的值使用new命令,就会抛出这种错误,因为new命令的参数应该是一个构造函数。

URIError 对象

URIError对象是 URI 相关函数的参数不正确时抛出的错误,主要涉及encodeURI()、decodeURI()、encodeURIComponent()、decodeURIComponent()、escape()和unescape()这六个函数。

EvalError 对象

eval函数没有被正确执行时,会抛出EvalError错误。该错误类型已经不再使用了,只是为了保证与以前代码兼容,才继续保留。

自定义错误

除了 JavaScript 原生提供的七种错误对象,还可以定义自己的错误对象。

function UserError(message) {

  this.message = message || '默认信息';

  this.name = 'UserError';

}

UserError.prototype = new Error();

UserError.prototype.constructor = UserError;

对于 JavaScript 引擎来说,遇到throw语句,程序就中止了。引擎会接收到throw抛出的信息,可能是一个错误实例,也可能是其他类型的值。

try...catch 结构

一旦发生错误,程序就中止执行了。JavaScript 提供了try...catch结构,允许对错误进行处理,选择是否往下执行。catch代码块捕获错误之后,程序不会中断,会按照正常流程继续执行下去。

try {

  throw new Error('出错了!');

} catch (e) {

  console.log(e.name + ": " + e.message);

  console.log(e.stack);

}

// Error: 出错了!

//   at <anonymous>:3:9

//   ...

try...catch结构允许在最后添加一个finally代码块,表示不管是否出现错误,都必需在最后运行的语句。

function cleansUp() {

  try {

    throw new Error('出错了……');

    console.log('此行不会执行');

  } finally {

    console.log('完成清理工作');

  }

}

如果没有catch语句块,一旦发生错误,代码就会中断执行。中断执行之前,会先执行finally代码块,然后再向用户提示报错信息。

function idle(x) {

  try {

    console.log(x);

    return 'result';

  } finally {

    console.log('FINALLY');

  }

}

猜你喜欢

转载自www.cnblogs.com/hjy-21/p/12312442.html