debugofonenpmpackageperdaydebugofonenpmpackageperday介绍：毫秒差通配符*环境变量格式化自定义格式支持浏览器进行调试使扩展动态settings检查调试目标是否开启有兴趣源码阅读如何判断是浏览器环境还是nodeJs环境？浏览器环境/nodeJs环境底层打印实现的是什么？每个打印的日志后面都会跟一个时间。这个时间是怎么计算的？格式如何逼真？格式化扩展是如何实现的？参考：社交信息/社交链接：简介：这是一个模仿Node.js核心调试技术的小型JavaScript调试实用程序。适用于Node.js和网络浏览器。调试包暴露了一个功能；你只需要将你的模块名称传递给这个函数，它就会返回一个封装了console.error的调试语句供你使用。这将允许您切换到模块的不同部分以及整个模块的调试输出。以毫秒为单位的差异当我们积极开发应用程序时，当我们仔细设计我们的代码时，查看一次调用debug()和下一次调用之间需要多长时间会很有用。例如，如果您在请求资源之前调用debug()一次，并在请求完成后调用一次，则两次调用将显示两次调用之间花费了多少时间。通配符*符号用作通配符。例如，如果您的库中有名为“connect:bodyParser”、“connect:compress”、“connect:session”的调试器，则不需要DEBUG=connect:bodyParser,connect:compress,connect:session列表出来。你可以简单地做DEBUG=connect:*，或者只使用DEBUG=*来运行这个模块的所有东西。环境变量通过Node.js运行时，您可以设置一些环境变量来更改调试日志记录的行为：变量名使用DEBUG来启用/禁用特定的调试命名空间。DEBUG_HIDE_DATE在调试输出中隐藏日期（不是TTY）DEBUG_COLORS是否在调试输出中使用颜色DEBUG_DEPTH对象检查深度DEBUG_SHOW_HIDDEN显示检查对象的隐藏属性Options对象与%O格式化程序一起使用。有关完整列表，请参阅util.inspect()的Node.js文档。使用printf样式格式格式化调试。以下是官方支持的格式化程序：格式含义%O在多行上漂亮地打印一个对象%o在一行上漂亮地打印一个对象%s一个字符串%d一个数字（整数和浮点数）%jJSON。如果参数包含循环引用，则替换为带有单个百分号（'%'）的字符串'[Circular]'%%，这将不会使用参数或变量自定义格式您可以通过扩展调试来添加自定义.formatters对象格式。例如，如果您想添加对使用%h将Buffer渲染为十六进制的支持，您可以编写如下代码：constcreateDebug=require('debug')createDebug.formatters.h=(v)=>{returnv.toString('hex')}//...elsewhereconstdebug=createDebug('foo')debug('thisishex:%h',newBuffer('helloworld'))//foo这是hex:68656c6c6f20776f726c6421+0ms浏览器支持如果您不想自己构建，您可以使用browserify或browserify-as-a-service构建浏览器就绪脚本。debug的开启状态由当前localStorage决定。考虑以下代码的情况，如果您希望调试两者，您有worker:a和worker:b。您可以使用localStorage.debug启用此功能：`localStorage.debug='worker:*'`然后刷新页面。a=debug('worker:a');b=debug('worker:b');setInterval(function(){a('做一些工作');},1000);setInterval(function(){b('做一些工作');},1200);要扩展调试，您可以简单地扩展调试器debuggerconstlog=require('debug')('auth');//createsnewdebuginstancewithextendednamespaceconstlogSign=log.extend('sign');constlogLogin=log.extend('登录');日志('你好');//authhellologSign('你好');//auth:signhellologLogin('你好');//auth:loginhello动态设置也可以通过调用enable()方法动态开启调试：letdebug=require('debug');console.log(1,debug.enabled('test'));debug.启用（'测试'）;console.log(2,debug.enabled('test'));调试。禁用（）；console.log(3,debug.enabled('test'));output:1false2true3falsecheckdebugtarget是否开启创建debug实例后，可以通过查看enabled属性判断是否开启：constdebug=require('debug')('http');if(debug.enabled){//做一些事情。..}您也可以手动切换此属性以强制启用或禁用调试实例。有兴趣源码阅读如何判断是浏览器环境还是nodeJs环境？if(typeofprocess==='undefined'||process.type==='renderer'||process.browser===true||process.__nwjs){module.exports=require('./browser.js');//浏览器环境}else{module.exports=require('./node.js');//nodeJs环境}说明：检测Electronrenderer/nwjs进程，因为它是一个节点，所以我们应该把它当作一个浏览器设备。浏览器环境/nodeJs环境底层打印实现的是什么？浏览器环境：/***在可用时调用`console.debug()`。*当`console.debug`不是“函数”时无操作。*如果`console.debug`不可用，回退到*`console.log`。**@apipublic*/exports.log=console.debug||控制台日志||(()=>{});nodeJs环境：/***使用指定参数调用`util.format()`并写入stderr。*/functionlog(...args){returnprocess.stderr.write(util.format(...args)+'\n');}common.js:······constlogFn=self.日志||它是如何计算出来的？首先我们要知道调试器是通过createDebug函数生成的；其次，createDebug函数执行的返回值是一个叫做debug的函数（其实这是一个闭包）；最后，在这个debug函数中，可以使用变量prevTime和变量curr结合Number(newDate())来计算时间。其实这个时间就是同一个调试器（或调试语句，即调试函数）调用的时间差。例子可以参考我的案例：index1.jscommonJs:functionsetup{//....functioncreateDebug(namespace){letprevTime;//...functiondebug(...args){constself=debug;//设置`diff`时间戳constcurr=Number(newDate());constms=curr-(prevTime||curr);self.diff=ms;self.prev=prevTime;self.curr=curr;上一个时间=当前；}returndebug}//...returncreateDebug;}module.exports=setup;版式如何写实毛呢？格式化扩展是如何实现的？common.js://···//···if(typeofargs[0]!=='string'){//其他任何让我们用%O检查args.unshift('%O');}//应用任何`formatters`转换letindex=0;args[0]=args[0].replace(/%([a-zA-Z%])/g,(match,format)=>{//如果我们遇到转义的%然后不要增加数组索引if(match==='%%'){return'%';}索引++；constformatter=createDebug.formatters[格式];if(typeofformatter==='function'){constval=args[index];match=formatter.call(self,val);//现在我们需要删除`args[index]`因为它内联在`format`中args.splice(index,1);指数-;}返回匹配；});//···//···browser.js:const{formatters}=module.exports;/***将%j映射到`JSON.stringify()`，因为默认情况下没有Web检查器这样做。*/formatters.j=function(v){try{returnJSON.stringify(v);}catch(error){return'[UnexpectedJSONParseError]:'+error.message;}};node.js:const{formatters}=module.exports;/***将%o映射到`util.inspect()`，全部在一行中。*/formatters.o=function(v){this.inspectOpts.colors=this.useColors;returnutil.inspect(v,this.inspectOpts).split('\n').map(str=>str.trim()).join('');};/***将%O映射到`util.inspect()`，如果需要允许多行。*/formatters.O=function(v){this.inspectOpts.colors=this.useColors;returnutil.inspect(v,this.inspectOpts);参考：https://www.npmjs.com/package...https://juejin.cn/post/684490...求关注，欢迎关注）Github：@huangyangquang微信公众号：前端学长Joshua
