浏览器控制台命令调试——console

控制台命令调试时经过浏览器开发工具中的控制台命令嵌入到JavaScript中，输出特定的信息或日志，从而达到调试的目的。

咱们经常使用的Chrome和FireFox，均可以经过F12来打开开发工具。

下面简要介绍几个经常使用的控制台命令：

（1）常规信息输出

console.log()是咱们最经常使用的命令，只须要将咱们但愿输出的内容传进入便可：

console.log("这是我要输出的信息");

除了console.log()命令外，咱们还有其它三种命令：

console.info("这是我要输出的信息");

console.error("错误信息");

 

console.warn("警告信息");

从这四种命令的名称就能够看出来它们的做用，它们是用来展现不一样类型信息，使得咱们的信息输出更加规范（我的观点）。

（2）常规信息分组输出

大量的信息输出，咱们可使用分组输出来对它们进行分组，方便咱们查看：

console.group("第一组开始");
console.log("第一组第一条");
console.log("第一组第二条");
console.groupEnd();

console.group("第二组开始");
console.log("第二组第一条");
console.log("第二组第二条");
console.groupEnd();

console.group()命令用于分组的开始，console.groupEnd()用来结束分组。

（3）对象输出

console.dir()是专门输出对象全部方法和属性的，咱们就能够不用本身遍历就查看对象的信息：

var obj = {
    name: "haha",
    desc: "doubi"
};
console.dir(obj);

（4）DOM输出

console.dirxml()命令是专门输出某个节点（node）所包含的html/xml代码：

var div = document.getElementById("demo");
console.dirxml(div);

因为内容过多，图片并无截全。

（5）函数调用轨迹监测

var x = test3(1);

function test(a) {
    console.trace();
    return a;
}

function test1(a) {
    return test(a);
}

function test2(a) {
    return test1(a);
}

function test3(a) {
    return test2(a);
}

（6）计时功能

有时咱们须要监测一段代码花费的时间，咱们一般能够这样作：

var time1 = new Date();
for (var i = 0; i < 100; i++) {

}
var time2 = new Date();
console.log(time2 - time1);

咱们还能够经过console.time()和console.timeEnd()帮助咱们完成这件事：

console.time("计时器");
for (var i = 0; i < 100; i++) {

}
console.timeEnd("计时器");

须要注意的是，这两个命令里面的参数要一致，才会输出计时信息。

好了，在下了解的console经常使用命令就这些啦，若是有遗漏的console相关的其它经常使用命令，也欢迎你们来补充哦。