函数中this的指向问题 ——Javascript 进阶知识整理

来源:互联网 发布:头像卡通化软件 编辑:程序博客网 时间:2024/05/20 04:09

函数中this的指向问题

首先,明确一点,this在Javascr中调用一个函数隐式传递给函数的参数之一(还有一个是arguments),this是一个引用,指向调用函数的对象,这里要区别的是函数在不同调用情况下this的指向

函数当作简单的函数进行调用,或者当作对象的方法进行调用的使用:

这个时候,this指向的就是函数的调用者,全局函数(当作简单的函数进行调用)的调用者默认都是window(浏览器中,非严格模式下),对象的方法,调用函数的就是对象。

闭包中this的指向

闭包中的函数,调用的对象是全局对象,所以闭包中this的指向是window,这就会带来一个问题,闭包函数如果想使用外部函数中与全局对象同名的变量,使用this.val是不行的,执行时,这回引用全局对象的变量,这个时候需要将外部对象的this在外部函数中暂存起来(比如var that=this),然后在闭包的内部函数中通过缓存的外部函数引用that找到外部函数的变量。

使用apply、call、bind更改this的指向

javascript提供了更改this的方法,其中apply和call用途一样,只不过传递的参数不同,apply需要传递的参数是this指针要指向的对象和一个传递给被调用函数的参数的数组,而call需要传递的参数是this指针要指向的对象和每一个被调用函数需要的参数,apply和call选择时要考虑的就是取得被调用函数的每一个参数方便,还是取得被调用函数的所有参数形成的数组方便。两个函数调用的形式如下:

    function Obj(){        var name;        this.getName=function(){return this.name;};        this.setName=function(val){this.name=val;};    }    var obj1=new Obj(),obj2=new Obj();    //将两个对象通过apply、call函数交错调用,目的是为了把两个函数的调用方式都演示一遍    obj1.setName.apply(obj2,["LI"]);    obj2.setName.call(obj1,"Qiang");    console.log(obj2.getName());//通过name的值,可以理解apply和call做了什么    console.log(obj1.getName());

bind函数目的和apply、call是一样的,都是改变this的指向,但是bind不会直接执行被调用的函数,而是返回一个新的函数,这个新的函数将this的指向更改了,但是其他地方与原函数相同。
bind方法调用形式如下:

    function Obj(){        var name;        this.getName=function(){return this.name;};        this.setName=function(val){this.name=val;};    }    var obj1=new Obj(),obj2=new Obj();    obj1.setName("LI");    obj2.setName("Qiang");    obj1.getAnotherName=function(){return this.name}.bind(obj2);    console.log(obj1.getAnotherName());//可以看到,有了bind之后,这个函数返回的值是obj2的name

附三个函数的语法定义:

call方法:
语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]])
定义:调用一个对象的一个方法,以另一个对象替换当前对象。

apply方法:
语法:apply([thisObj[,argArray]])
定义:应用某一对象的一个方法,用另一个对象替换当前对象。

bind方法:
语法:bind(thisArg [, arg1 [, arg2, …]]);
定义:根据一个对象的方法返回一个新函数,新函数用另一对象替代当前对象

0 0
原创粉丝点击