apply\call\bind 笔记

作用
  • 改变某个函数运行时的上下文(context)而存在的,也就是改变函数内部this指向
不同点
  • 参数不同

call()
语法 :(thisobj[, arg1[,arg2[,[,…argN]]]])
fun.call(obj, arg1, arg2);

apply()
语法:(thisobj[, arr])
fun.call(obj, arr);

bind()
语法:(thisobj[, arg1[,arg2[,[,…argN]]]])
fun.bind(obj, arg1,arg2);

//示例代码
banana = {
    color: "yellow"
}

var apple = {
    color:'apple',
    say: function(str1, str2){
	console.log(this.color, str1, str2)
    }
}
var  temp = apple.say.bind({color:'bind'});
var temp2 = apple.say.bind({color:'bind'}, 'c1', 'c2');

apple.say.call(banana);     
apple.say.apply(banana);   
apple.say.call(banana, 'a1', 'a2');     
apple.say.apply(banana, ['b1', 'b2']);  

//调用时候才执行
temp(); 
temp2();
  • 调用时间不同

bind 是返回对应函数,便于稍后调用;apply 、call 则是立即调用 。

特殊用法和优秀代码
  • 后续完善

后续完善

下面的比较乱,可以不看,后续会统计干净

JavaScript 的一大特点是,函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」这样的概念。

对于 apply、call 二者而言,作用完全一样,只是接受参数的方式不太一样。

banana = {
    color: "yellow"
}
apple.say.call(banana);     //My color is yellow
apple.say.apply(banana);    //My color is yellow

特殊用法:
在里面:https://www.cnblogs.com/coco1s/p/4833199.html

bind() 方法与 apply 和 call 很相似,也是可以改变函数体内 this 的指向。

var foo = {
    bar : 1,
    eventBind: function(){
        var _this = this;
        $('.someClass').on('click',function(event) {
            /* Act on the event */
            console.log(_this.bar);     //1
        });
    }
}
var foo = {
    bar : 1,
    eventBind: function(){
        $('.someClass').on('click',function(event) {
            /* Act on the event */
            console.log(this.bar);      //1
        }.bind(this));
    }
}

bind的其他用法:

(慢慢研读)
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function/bind

偏函数
bind()的另一个最简单的用法是使一个函数拥有预设的初始参数。这些参数(如果有的话)作为bind()的第二个参数跟在this(或其他对象)后面,之后它们会被插入到目标函数的参数列表的开始位置,传递给绑定函数的参数会跟在它们的后面。

和settimeout的使用

//优秀代码
function log(){
  var args = Array.prototype.slice.call(arguments);
  args.unshift('(app)');
 
  console.log.apply(console, args);
};

ps:本文内容是摘自网上搜集的众多文章和代码集合而成的笔记! 所以文章类型是"翻译". 对于一些网址没有写到文中,深表歉意! 再次感谢.

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值