JavaScript this - 全面解析 (三)

程序人生

2.4 绑定规则 - new 绑定

在传统的面向类的语言中,“构造函数”是类中的一些特殊方法,使用 new 初始化类时会 调用类中的构造函数。通常的形式是这样的:
something = new MyClass(..);
JavaScript 也有一个 new 操作符,使用方法看起来也和那些面向类的语言一样,绝大多数开 发者都认为 JavaScript 中 new 的机制也和那些语言一样。然而,JavaScript 中 new 的机制实 际上和面向类的语言完全不同。
首先我们重新定义一下 JavaScript 中的“构造函数” 。
在 JavaScript 中,构造函数只是一些使用 new 操作符时被调用的函数。它们并不会属于某个类,也不会实例化一个类。实际上它们甚至都不能说是一种特殊的函数类型,它们只是被 new 操作符调用的普通函数而已。
<script type="text/javascript">
function foo(name){
 this.a = 1;
 console.log(this.a);
}
var obj = new foo(); //1
</script>

使用 new 来调用 foo(..) 时,我们会构造一个新对象并把它绑定到 foo(..) 调用中的 this 上。new 是最后一种可以影响函数调用时 this 绑定行为的方法,我们称之为 new 绑定。

使用bind函数解决回调函数对this的影响

错误示例

<script type="text/javascript">
function foo(name){
 this.a = 1;
 this.say = function(){
  setTimeout(function(){
   console.log(this.a);
  },1000);
 }
}
var obj = new foo();
obj.say(); //undefined
</script>
上面代码中 this 在 setTimeout()中被调用,但不能再代表 obj 对象。解决方案 .bind()
<script type="text/javascript">
function foo(name){
 this.a = 1;
 this.say = function(){
  setTimeout(function(){
   console.log(this.a);
  }.bind(this),1000);
 }
}
var obj = new foo();
obj.say(); //1
</script>
在this所在的函数结尾使用bind()函数绑定this所指向的对象可以更精准的控制this。


Tags: JavaScript this
转自:http://www.hcoder.net/books/read/info/1219.html
  • 还没有评论,沙发等你来抢
*         

正在加载验证码......