JavaScript调试,停止使用console.log - 猿码设计师

JavaScript调试,停止使用console.log - 猿码设计师JavaScript log 前端; 停止对JavaScript所有内容使用 console.log; 我已经看到并继续看到许多开发人员经常以我认为不正确的方式使用控制台对象的 log 方法。https://www.yuanmadesign.com/ymdesign/js-console-log

停止对JavaScript所有内容使用 console.log 。我已经看到并继续看到许多开发人员经常以我认为不正确的方式使用控制台对象的 log 方法。

使用console.log来调试

许多开发人员仍然使用 log 方法来调试他们的应用程序。例如,确保代码到达某个地方或变量在给定时间具有正确的值。这有几个缺点。

您无法查看应用程序的整个生命周期,只能查看给定时间变量的值或您的代码是否遵循其逻辑流程。

经常发生console.log在代码中的几个地方被遗忘,除了假设的性能损失(很小,但其大小根据通过log方法调用的数据而变化),不是很干净。

解决方法是使用浏览器提供的调试工具。这可能需要一点学习,但回报大于努力。这样您就可以完全控制代码的生命周期,并避免在代码中忘记 console.log。

仅用console.log

同样,许多开发人员使用 console.log 来显示任何类型的消息:信息、错误、警告等。提供对浏览器调试控制台的访问权限的控制台对象有许多具有非常特定用途的方法。以下是最常用方法的详尽列表:

console.error → 显示错误信息

console.warn → 显示警告信息

console.info → 显示信息性消息(Firefox 上的特殊渲染,但技术上与 log 方法相同)

console.log → 显示全局消息

console.debug → 向控制台显示一条带有日志级别调试的消息

console.table → 将数组/对象的数据显示为表格

console.time (with console.timeEnd) → 允许你设置一个计时器来查看一个任务需要多长时间才能完成。

调试方法的具体案例

就个人而言,我考虑在三种不同情况下使用调试方法。

在第一种情况下,我们希望在屏幕上快速显示一条信息(例如变量的值)。即使它不是最佳的,这个方法的日志级别也会让消息默认对用户保持“隐藏”(除非他的控制台的详细模式被激活)。

在第二种情况下,我们希望使用该方法作为源文件的锚点(如果您愿意,我们也可以使用调试器语句,但我个人不喜欢它)。

第二种情况示例

第三种情况,我们想在生产中使用按需调试日志系统。例如,直接在 window 对象中注册的函数可以触发在用户控制台中显示日志。当我们没有可供我们使用的预生产环境以及客户提出的错误难以在开发环境中重现时,此用例可能很有用。

从生产中删除 console.debug

除非你是我们刚刚看到的第三种情况,我建议你使用 git pre-commit 钩子或插件之类的东西来检查你不想在生产版本之前出现的方法或关键字。您可以使用 UglifyJS 过滤这些关键字。

我的公众号:源码设计师 上会分享更多心得体会,敬请关注。

Console.log JavaScript 性能优化

» 转载保留版权:猿码设计师 » 《JavaScript调试,停止使用console.log》

» 本文链接地址:JavaScript调试,停止使用console.log - 猿码设计师

» 如果喜欢可以:关注《猿码设计师》公众号

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值