webstorm中console.log的快捷补全方法

c.log 再按tab键 

因为嫌 console.log() 的写法太繁琐,想将其简写为 log() 。 我最初是这样写的:

 var log = console.log;
 log(..);

结果输出为:

TypeError: Illegal invocation

谷歌一番之后在 Stack Overflow 上找到这个答案:

var log = console.log.bind(console);

看到这个答案后,突然眼前一亮,因为我恰好刚刚在 《You Don't Know JS》 系列中读到过相关内容。虽然SO上只有答案没有解释,但是读过的内容瞬间在大脑中盘旋,帮我理解了这种写法的原理。刚刚学过的内容派上了用场,这种感觉太棒了!;-D

好了,不卖关子了,再卖会被鄙视的。;-)

言归正传。Javascript语言采用的是静态作用域规则(lexical scoping):

function foo() {
  console.log( a ); // 2
}

function bar() {
  var a = 3;
  foo();
}

var a = 2;

bar(); //2

但是,function中的 this 是个例外, this 并不指function对象本身,也不是指function的作用域对象。而是在运行时绑定到特定的对象上。即它采用的是动态作用域规则。参见 这篇文章 。

另外,一个function即便是定义在一个对象中,作为对象的一个“方法”,它也只不过是一个普通的函数而已,跟其他函数没有任何区别。在执行时仍然需要为this绑定一个具体的对象。

var obj = {
  a: 1,
  foo: function f() {
    console.log(this.a);		
  }
}

obj.foo(); //1

var g = obj.foo;
g();	//undefined

g = obj.foo.bind(obj);
g();	//1


var log = console.log;

中,log指向的其实是未绑定到console的普通的函数。可以设想log函数中使用到了诸如 this.xxx() 之类的语句,而在全局变量中并没有此类方法,所以会报出错误:

console.log.call(console, "stuff")//stuff
console.log.call(window, "stuff") //TypeError: Illegal invocation

你可能感兴趣的:(javascript)