Chrome 调试技巧(1)

本文详细介绍了JavaScript中console对象的各种方法,如数据展示、函数计数跟踪、时间测量以及断言,同时展示了Chrome开发者工具的强大功能,包括性能分析、DOM调试、事件监听和各种实用技巧,旨在提升前端开发者的工作效率。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

console.table(stu);

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

成组输出

//建立一个参数组

console.group(“start”); //引号里是组名,自己起

console.log(“sub1”);

console.log(“sub1”);

console.log(“sub1”);

console.groupEnd(“end”);

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

函数计数和跟踪

function fib(n){ //输出前n个斐波那契数列值

if(n == 0) return;

console.count(“调用次数”);//放在函数里,每当这句代码运行输出所在函数执行次数

console.trace();//显示函数调用轨迹(访问调用栈)

var a = arguments[1] || 1;

var b = arguments[2] || 1;

console.log(“fib=” + a);

[a, b] = [b, a + b];

fib(–n, a, b);

}

fib(6);

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

注:Chrome开发者工具中的Sources标签页也在Watch表达式下面显示调用栈。

计时

console.time() //计时开始

fib(100); //用上述函数计算100个斐波那契数

console.timeEnd() //计时结束并输出时长

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

断言语句,这个c++调试里面也经常用到。js中,当第一个表达式或参数为true时候什么也不发生,为false时终止程序并报错

console.assert(true, “我错了”);

console.assert(false, “我真的错了”);

外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传

性能分析
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值