call apply bind瞎谈
简单理解call apply bind以及其中所谓的改变this指向问题
先看代码
const xiaoming = { name: '小明', own: '铅笔', zhuanbidao: function(result1, result2){console.log(`${this.name}使用了转笔刀把${this.own}变成了${result1}和${result2}`)} }
上述代码很简单,小明有一只铅笔,有一把转笔刀,可以用来削铅笔,当我们调用
xiaoming.zhuanbidao('削好的铅笔', '木屑');
很明显会得到:小明使用了转笔刀把铅笔变成了削好的铅笔和木屑
此时有个问题,小明的同桌小华也有一只铅笔,但是没有转笔刀,但是他也需要削铅笔,咋办呢?
const xiaohua = { name: '小华', own: '铅笔' };
直接调用
xiaohua.zhuanbidao('削好的小华的铅笔', '小华铅笔的木屑'); // 肯定报错
此时,小华可以叫一下小明:‘小明哥,借个转笔刀使使呗’,于是便有了
xiaoming.zhuanbidao.call(xiaohua, '削好的小华的铅笔', '小华铅笔的木屑'); // 小华使用了转笔刀把铅笔变成了削好的小华的铅笔和小华铅笔的木屑
从上述示例不难理解,小明和小华都有各自的铅笔,这个铅笔可以看作this,但是小明自己有转笔刀,可以直接削自己的铅笔,但是小华没有,他只有自己的铅笔,于是他需要借小明的转笔刀来削自己的铅笔(this指向改变,变成了小华自己的铅笔),也一样可以得到自己削好的铅笔。
最后至于call和apply的区别就只是传参的方式不同而已
xiaoming.zhuanbidao.apply(xiaohua, ['削好的小华的铅笔', '小华铅笔的木屑']);
bind可以看作只是和小明借到了转笔刀,但是还没有开始削,要削怎么办?调用一下方法咯;传参和call一样
xiaoming.zhuanbidao.bind(xiaohua, '削好的小华的铅笔', '小华铅笔的木屑')();
ok that’s all
原文地址:https://segmentfault.com/a/1190000020515009
相关推荐
-
实战:使用React Hook一步一步创建一个可排序表格组件 javascript/jquery
2020-5-28
-
通过原型继承理解ES6 extends 如何实现继承 javascript/jquery
2019-9-15
-
echarts各项配置(详细版) javascript/jquery
2019-8-21
-
消息推送之APNS javascript/jquery
2019-6-18
-
Html5游戏中的setInterval与setTimeout javascript/jquery
2020-6-10
-
对 React 组件进行单元测试(unit testing) javascript/jquery
2020-6-12
-
想进美团不知道选哪个技术岗位?这里有一份通关秘籍! javascript/jquery
2020-6-12
-
jQuery源码分析(一):立即调用函数 javascript/jquery
2019-7-21
-
职场瓶颈:2~4 年前端走出离职困境与舒适区 javascript/jquery
2020-6-12
-
JavaScript 内存泄露问题 javascript/jquery
2019-5-6