JavaScript中的bind,call和apply函数的用法和区别

一直没怎么使用过JavaScript中的bind,call和apply, 今天看到一篇比较好的文章,觉得讲的比较透彻,所以记录和总结如下

首先要理解的第一个概念,JavaScript中函数调用的方式,总结下来,有以下4种

1. 方法调用

2. 正常函数调用

3. 构造器函数调用

4. apply/call 调用

要明白的第2个概念, JavaScript 中的函数,无论是上面哪种函数调用方式,除了你函数声明时定义的形参外,还会自动给函数添加两个形参,分别是this 和 arguments

要明白的第3个概念,  Javascript中的函数,存在函数上下文(context) 这么一个概念, 而函数上下文又存在【定义时上下文】,【运行时上下文】,【上下文是可以改变的】这样子的情况, 而第2个概念中的this, 指向的就是当前函数中的上下文

要明白的第4个概念, 也是我们今天在这里要讲的call, apply函数的目的 => 它们在JavaScript函数中存在的目的,就是为了改变某个函数运行时的上下文(context)而存在的, 换句话说,是为了改变函数体内部this的指向

现在我们一个一个来看

1. 方法调用函数的方式

应该可以理解,所谓方法调用函数的方式,就是说把一个函数定义为一个对象的方法,然后通过调用这个对象的该方法,来达到调用该函数的目的

直接上代码

var myValue = {

     para: 5,
     setFunc: function(xvalue){

         this.para = xvalue;

      }
}

myValue.setFunc(0);

在这里,函数setFunc作为变量myValue的也给方法存在,所以使用myValue.setFunc()的形式就可以调用它。在这里,函数setFunc中的this,绑定的上下文就是myValue, 所以this.para取到的就是对象myValue的para属性

2. 

猜你喜欢

转载自www.cnblogs.com/wphl-27/p/11526801.html
今日推荐