JavaScript中this关键字详解

来源：互联网发布：测试耳塞得软件编辑：程序博客网时间：2024/04/29 15:18

众所周知，JavaScript中this关键字在不同的场合，有不同的含义，本文主要介绍一下，各自场合，this的作用。

案例1（function）

function person() {this.age =25;console.log("this："+this);//"this：[object Window]"console.log(window.age);//25console.log(this.age);//25};

此时，this指向的是window对象，所以window.age和this.age是同样的结果。

案例2（new 对象）

function person() {this.age =25;console.log("this："+this);//"this：[object Object]"console.log(window.age);//undefinedconsole.log(this.age);//25};var p1 = new person();

此时，this指向的是p1对象，new关键字后的构造函数中的this指向用该构造函数构造出来的新对象。

案例3({}对象)

var name = "Bob";  var nameObj ={  name : "Tom",  showName : function(){  console.log("this:"+this);//"this:[object Object]"console.log(this.name);  //Tom}};  nameObj.showName();

此时，this指向的是nameObj对象。

案例4(setTimeout,setInterval)

var name = "Bob";  var nameObj ={  name : "Tom",  showName : function(){  console.log("this:"+this);//"this:[object Window]"console.log(this.name);  //Bob},  waitShowName : function(){  setTimeout(this.showName, 1000);  }  };  nameObj.waitShowName();

此时，this指向的是window对象。setTimeout、setInterval和匿名函数执行时的当前对象是全局对象window。

案例5(eval)

var name = "window";var Bob = {    name: "Bob",    showName: function(){console.log("this："+this);//"this：[object Object]"        eval("alert(this.name)");//Bob    }};Bob.showName();

此时，this指向的是Bob对象.对于eval函数，其执行时候似乎没有指定当前对象，但实际上其this并非指向window，因为该函数执行时的作用域是当前作用域。

案例6(apply,call)

var name = "window";    var someone = {    name: "Bob",    showName: function(){        alert(this.name);    }};var other = {    name: "Tom"};    someone.showName.apply();    //windowsomeone.showName.apply(other);    //Tom

apply用于改变函数执行时的当前对象，当无参数时，当前对象为window，有参数时当前对象为该参数。于是这个例子Bob成功偷走了Tom的名字。apply和call能够强制改变函数执行时的当前对象，让this指向其他对象。

2 0