【Javascript】Javascript中的函数调用模式

    在Javascript中,一个函数有四种调用模式,分别是:方法调用模式、函数调用模式、构造器调用模式和Apply或Call调用模式。本人在实际的工作中,各种调用模式都用过。这俩想特别提到的是函数调用模式,因为它的一点小特性使得我的一些代码无法正常工作。其实总结起来,还是因为个人的经验不足。

    在函数调用模式中,主要的问题就是this所指向的对象,到底是调用者本身,还是全局的问题。其实,我们很多时候希望this指向的是调用者本身,但是实际上它是指向了window全局对象。个人感觉,这是Javascript语言本身的不足,没能满足大多数的需要。为了说明这个问题,先看如下代码:

var B={
    b:10,
    fun:function(){
        var exe=function(){
            alert(this.b);
        }
        exe();
    }
}
var b=20;
B.fun();

     这段代码很简单,B对象中有个fun方法,这个方法有时很大,因此,我经常会把这个方法中的公共部分再封装成内部的小函数,如代码中的exe,这个方法中,用到了对象中的b进行操作,所以这里我想当然的用到了this,意思是在调用B.fun()时,this是指向B的,因此在执行fun中的exe()时,也会自动对this进行操作。也就是说,上面的alert应该弹出“10”,但是,实际的运行效果是:


    很显然,20是上面代码中的全局变量var b=20的数值,如果我们删掉这句,弹出undefined,这说明,exe()在调用时,this指向的是window,不是B对象。这个问题会使得很多通过像exe()这样调用方式的代码得到意想不到的结果。

    解决办法有一些,我们可以通过把exe这个方法提到外面,用B.exe()这样的方式调用。这样,exe的调用模式就变成了方法调用模式了。

    当然,最直接的方法就是通过函数的链式访问的方式,把this传到exe中去。 比如,我们可以把this赋值到一个内部的变量中,然后,exe对这个内部变量进行操作就行了。修改如下:

var B={
    b:10,
    fun:function(){
        var that=this;
        var exe=function(){
            alert(that.b)
        }
        exe();
    }
}
var b=20;
B.fun();

 

    这样,就弹出10了。 

原文地址:https://www.cnblogs.com/echoloyuk/p/2605215.html