问

如何在控制台和文档中将内置方法分配给javascript中的变量？

傻傻的笑没心没肺wy 发布于 2023-01-08 11:51

console

我正在尝试将console.log()方法的条件赋值实现为变量,如下所示:

var dbglevel = 1;
var dbg = (dbglevel > 0) ? console.log : function(){};

dbg('message'); // throws TypeError

TypeError:在没有实现接口控制台的对象上调用'log'.

它曾经工作但在Firefox 30中发生了一些变化.现在我不知道它是否应该工作.我怀疑的原因是我在文档对象中看到了同样的事情.比较这两个函数赋值的结果,第一个是函数包装器,第二个是直接赋值给方法:

function qs1(q) { return document.querySelector(q); }; // wrapper
qs1('head'); // works

var qs2 = document.querySelector;
qs2('head'); // throws TypeError

TypeError:'querySelector'调用未实现接口Document的对象.

我在这看到什么？为什么将方法直接赋值给变量会破坏它与父对象的"接口"？

我想要做到这一点的理由是双重的:

1.)赋值语法较短,我不需要担心声明参数,2.)更重要的是,我希望我的dbg()调用向控制台报告正确的文件和行号.如果函数是包装器,则控制台始终在该包装器中显示console.log调用的行号.我不想模拟行号记录,因为console.log直接调用的常规方法为您提供了一个可单击的链接,以查看以调用它为中心的源为中心的源.

我不是在寻找涉及FireBug,预处理(LESS/SASS)或第三方脚本等插件的解决方法.解决方案只需要在vanilla Firefox 30或更高版本上运行,我想解决的具体问题是如何在我想要有条件地记录的每一行上压缩以下代码:

if (typeof cfg.DEBUG != 'undefined' && cfg.DEBUG > 2) console.log(something);

......对......

dbg(something);

... dbg()函数执行任何适当的条件评估,然后显示相同的行号,就像我直接调用console.log一样.

1 个回答

有一个简单的解决方法:
```
var dbglevel = 1;
var dbg = (dbglevel > 0) ? function(msg){console.log(msg);} : function(){};

dbg('message'); // prints message
```
顺便说一句,也将本机功能分配给Chrome中的var投掷TypeError.问题是绑定:当你像你一样使用别名函数时,它们会在全局对象上被调用,而你需要将它们绑定到console或document依次绑定.

所以正确的别名方法就像:
```
var dbg = console.log.bind(console);
```
要么
```
var qs2 = document.querySelector.bind(document);
```
假设你至少运行ES5.所以,如果你需要后向兼容性,你可能想要使用类似上面的解决方法(也许更精心设计一些可变数量的参数,使用apply和arguments对象).

如果您确定可以访问ES5功能,请使用:
```
var dbglevel = 1;
var dbg = (dbglevel > 0) ? console.log.bind(console) : function(){};

dbg('message'); // prints message
```
2023-01-08 11:54 回答

花落酒未醉

撰写答案

今天，你开发时遇到什么问题呢？

立即提问

热门标签