javascript this指向简单介绍

快乐打工仔 分类:实例代码

this在javascript中是一个重要的概念,如果对此没有很好的掌握,那么在编码中肯定是举步维艰。

下面就介绍一下this的指向问题,需要的朋友可以做一下参考。

this的指向总结如下:

(1).有对象就指向调用对象。

(2).没调用对象就指向全局对象。

(3).用new构造就指向新对象。

(4).通过 apply 或 call 或 bind 来改变 this 的所指。

特别说明:在严格模式下,this的指向会有所差别,具体可以参阅严格模式下this的指向问题简单介绍一章节。

下面就分别做一下简单介绍:

一.函数属于一个对象时,则this指向该对象:

当一个函数属于一个对象时,那么此函数中的this就是指向该对象。

代码实例如下:

var url="51texiao.cn";
var obj={
  url:"pipipi.net"
}
obj.done=function(){
  console.log(this.url);
}
obj.done();

从上面的代码表现可以看出,this是指向obj对象的。

二.函数没有所属对象:指向全局对象:

这一个原则在严格模式下有所改变,可以参阅上面的文章。

但是在普通模式下,还是成立的,代码实例如下:

var url="51texiao.cn";
var obj={
  url:"pipipi.net"
};
obj.func=function(){
 var foo=function(){
  console.log(this.url)
  console.log(this);
 };
 foo();
 return this.url;
};
console.log(obj.func());

三.构造函数中的this是指向创建的对象实例:

构造函数中的会指向新创建的对象实例,代码如下:

function Antzone(webName,url){
  this.webName=webName;
  this.url=url;
}
var antzone=new Antzone("前端教程网","pipipi.net");
console.log(antzone.url);

关于new运算符的作用可以参阅js new运算符一章节。

四.apply和call调用以及bind改变this的指向:

关于上面几个函数的用法这里就不多介绍了,具体可以参阅相关阅读。

(1).apply()和call()可以参阅javascript call()和apply()的作用和区别一章节。

(2).bind()可以参阅javascript bind()一章节。

回复

我来回复
  • 暂无回复内容