在我们写项目的时候,肯定不会对console陌生, 但是,console还有很多方便的用法.
首先让我们打开Chrome控制台-开发者工具
1.向控制台输出信息的种类有以下几种
console.log('Hello world!'); console.info('Hello world!'); console.warn('Hello world!'); console.error('Hello world!'); console.debug('Hello world!');
2.console.dir() 显示一个对象的所有属性和方法
console.dir(document);
3.console.table() 将数据以表格的形式显示
这个方法需要一个必填参数, 该参数必须是一个数组或者一个对象.
var names = [ { name: "小明", age: 20, gender: '男' }, { name: "小红", age: 18, gender: '女' }, { name: "小李", age: 22, gender: '男' } ]; console.table(names);
4.计算代码运行开始到结束的时间
注意: 每一个定时器的名字是唯一的, 也就是说不可以重名.
console.time('CodeRunTime'); let count = 0; for (let i=0; i<100; i++) { count++; } console.timeEnd('CodeRunTime');
5.输出被调用的次数
console.count()
次函数接受一个可选参数
let user = ""; function greate () { console.count(user); return 'hi' + user; } user = 'Bob'; // 此时的lable是Bob greate(); user = 'John'; // 此时的lable是John greate(); greate(); console.count('John');
6.判断结果是否为真
console.assert()
如果结果为false
, 则将一个错误消息输出到控制台, 如果结果为true
, 则没有任何反应.
console.assert(1==1, 'Success'); console.assert(1==2, 'Error');
7.分组
console.group()
在控制台创建一个分组, 直到调用console.groupEnd()
之后分组结束.
console.group('GroupOne'); console.log('A'); console.log('B'); console.log('C'); console.groupEnd(); console.group('GroupTwo'); console.log('D'); console.log('E'); console.log('F'); console.groupEnd();