在JavaScript中,apply、call、bind这个三个方法,它们的作用都是为了改变某个函数运行时的上下文,

也就是改变函数体内的this指向。

在一个函数里,存在“定义时上下文”、“运行时上下文”,而且上下文是可以改变的。

apply方法

apply方法接收两个参数,第一个参数是:“上下文对象” ,第二个参数是:“传入当前执行函数的参数”(第二个参数是数组)。

        function test(){
console.log(this.name);
} let one = {
name:'测试1'
} let two = {
name:'测试2'
} test.apply(one);//将one对象传入函数 这时test函数的上下文是one ,one的name等于'测试1' 所以输出 '测试1'
test.apply(two);//将two对象传入函数 这时test函数的上下文是two ,two的name等于'测试2' 所以输出 '测试2'

我们自己封装一个log函数,将传入的参数打印在控制台。

        function log(){
var arr = Array.prototype.slice.apply(arguments);
console.log.apply(console,arr);
} log(1,2,4);

call方法

call和apply作用都是一样的,唯一的不同点是第二个参数,apply的第二个参数是数组,而call的第二个参数的话,看下面例子:

        var arr = [1,2,3];
Array.prototype.push.call(arr,6,7,8); //参数是一个一个传的
console.log(arr);//[1, 2, 3, 6, 7, 8]

bind方法

bind方法和apply、call的作用也是差不多的,不同的是 apply、call 这两个方法是立即执行函数,而bind不是,来看下面例子:

        let one = {
name:'测试1'
}
let two = {
name:'测试2'
} function sayName(){
console.log(this.name);
} let play = sayName.bind(one); //这里并不会立即执行
play(); //所以 可以将这个方法 放到需要的地方 在执行

apply、call、bind这三者的区别

相同点:这个三个方法的作用都是改变函数执行上下文。

不同点:bind是返回对应的函数,便于稍后调用,apply、call方法则是立即执行(立即调用)

参考教程:https://www.cnblogs.com/moqiutao/p/7371988.html

《JavaScript总结》apply、call和bind方法的更多相关文章

  1. 彻底理解了call()方法,apply()方法和bind()方法

    javascript中的每一个作用域中都有一个this对象,它代表的是调用函数的对象.在全局作用域中,this代表的是全局对象(在web浏览器中指的是window).如果包含this的函数是一个对象的 ...

  2. 浅析 JavaScript 中的 Function.prototype.bind() 方法

    Function.prototype.bind()方法 bind() 方法的主要作用就是将函数绑定至某个对象,bind() 方法会创建一个函数,函数体内this对象的值会被绑定到传入bind() 函数 ...

  3. JavaScript 中的 Function.prototype.bind() 方法

    转载自:https://www.cnblogs.com/zztt/p/4122352.html Function.prototype.bind()方法 bind() 方法的主要作用就是将函数绑定至某个 ...

  4. Javascript中this作用域以及bind方法的重写

    这是一个最近遇到的笔试题,出于尊重,不会说出该公司的名字,源于自身比较少,笔试题是将bind方法用ES3重写,使用bind这个方法,导致一时半会懵了,只记得bind可以改变this的作用域. 作为查漏 ...

  5. JavaScript的apply()方法和call()方法

    1 <script type="text/javascript"> 2 /*定义一个人类*/ 3 function Person(name,age) 4 { 5 thi ...

  6. JavaScript中apply与call方法

    一.定义 apply:应用某一对象的一个方法,用另一个对象替换当前对象. call:调用一个对象的一个方法,以另一个对象替换当前对象. 二.apply //apply function Person( ...

  7. Javascript中call,apply,bind方法的详解与总结

    在 javascript之 this 关键字详解 文章中,谈及了如下内容,做一个简单的回顾: 1.this对象的涵义就是指向当前对象中的属性和方法. 2.this指向的可变性.当在全局作用域时,thi ...

  8. javascript中函数的call,apply及bind方法

    call 方法调用一个对象的一个方法,以另一个对象替换当前对象.call([thisObj[,arg1[, arg2[,  [,.argN]]]]])参数thisObj可选项.将被用作当前对象的对象. ...

  9. javascript中apply、call和bind的区别及方法详解

    文章目录   apply.call apply.call 区别 apply.call实例 数组之间追加 获取数组中的最大值和最小值 验证是否是数组(前提是toString()方法没有被重写过) 类(伪 ...

随机推荐

  1. [html]CSS中的margin、border、padding区别

    图解CSS padding.margin.border属性W3C组织建议把所有网页上的对像都放在一个盒(box)中,设计师可以通过创建定义来控制这个盒的属性,这些对像包括段落.列表.标题.图片以及层. ...

  2. session实现原理(阿里面试题)

    问: 当用户登录某网站后,向服务器发送一个请求,服务器如何判断是这个用户请求的 首先,你要明白一点,最初http协议在设计的时候,主要面向当时的web1.0网站,他们不需要知道是谁来访问,只需要向外界 ...

  3. squid日志详解

    quid的日志很重要.常常要了解的,其中最重要的就是命中率啦,不然反向代理做的用就不大. cat access.log|gawk ‘{print $4}’|sort|uniq -c|sort -nr ...

  4. 【翻译】Flume 1.8.0 User Guide(用户指南) Sink

    翻译自官网flume1.8用户指南,原文地址:Flume 1.8.0 User Guide 篇幅限制,分为以下5篇: [翻译]Flume 1.8.0 User Guide(用户指南) [翻译]Flum ...

  5. Centos7 登录mysql 出现mysql.sock不存在

    记一次纠错大战 本来今天开开心心地部署nginx和uwsgi到我的Django服务器,刚想给老师演示一遍我这项目如何酷炫时,一登陆就出现mysql连接不上了 (2003, "Can't co ...

  6. 2019.03.09 bzoj5371: [Pkusc2018]星际穿越(主席树)

    传送门 题意简述: 给一个序列,对于第iii个位置,它跟[limi,i−1][lim_i,i-1][limi​,i−1]这些位置都存在一条长度为111的无向边. 称dist(u,v)dist(u,v) ...

  7. 登陆页、注册页、会员中心页logo图的替换

                  关闭   PHP在线开发笔记       目录视图 摘要视图 订阅 异步赠书:9月重磅新书升级,本本经典           程序员9月书讯      每周荐书:ES6.虚 ...

  8. DOM函数和jQuery函数的覆盖与执行顺序

    <script type="text/javascript"> window.onload = function () { alert(); } window.onlo ...

  9. SVM探讨

    目录 SVM探讨 SVM算法 硬间隔最大化的优化目标 软间隔最大化 SVM探讨 SVM算法 根据处理问题的复杂度,SVM 可由简到繁分为三种: 线性可分支持向量机:硬间隔最大化. 线性支持向量机:数据 ...

  10. noip第32课资料