call apply bind 的作用和区别
1.call apply bind 的作用和区别
作用:
都可以改变函数内部的this指向。
区别点:
1.call和apply会调用函数,并且改变函数内部this指向。
2.call和apply传递的参数不一样,call传递参数arg1,arg2..形式apply必须数组形式[arg]
3.bind不回调用函数,可以改变函数内部this指向。
解析:
call方法
改变函数内部this指向
call()方法调用一个对象。简单理解为调用函数的方式,但是它可以改变函数的this指向。
写法:fun.call(thisArg,arg1,arg3,...)//thisArg为想要指向的对象,arg1,arg3为参数
call的主要作用页可以实现继承
function Person(uname,age){
this.uname = uname
this.age = age
}
function Son(uname,age){
Person.call(this,uname,age)
}
var son = new Son("zhang",12)
console.log(son)
apply()方法
apply()方法调用一个函数。简单理解为调用函数的方法,但是它可以改变函数的this指向
写法:fun.apply(thisArg,[argsArray])
thisArg:在fun函数允许时指定的this值
argsArray:传递的值,必须包含数组里面
返回值就说函数的返回值,因为他就说调用函数
apply的主要应用,比如可以利用apply可以求得数组中最大值
const arr = [1,22,3,44,5,66,7,88,9]
const max = Math.max.apply(Math,arr)
console.log(max)
bind()方法
bind()方法不回调用函数,但是能改变函数内部this指向
写法:fun.bind(thisArg,arg1,arg2,...)
thisArg:在fun函数运行时指定的this值
arg1,arg2:传递的其他参数
返回由指定的this值和初始化参数改造的原函数拷贝
var o = {
name:"lisa"
};
function fn(){
console.log(this)
}
var f = fn.bind(o)
f()
bind应用
如果有的函数我们不需要立即调用,但是又需要改变这个函数的this指向,此时用bind再合适不过了
const btns = docment.querySelectorAll("button");
for(let i = 0;i<btns.length;i++){
btns[i}.onclick = function(){
this.disabled = true;
setTimeout(
function(){
this.disabled = false
}.bind(this),
2000
)
}
}
扩展:
主要应用场景:
1.call经常做继承。
2.apply经常跟数组有关系,比如借助于数学对象实现数组最大值最小值。
3.bind不调用函数,但是海想改变this指向,比如改变定时器内部的this指向。
call apply bind 的作用和区别相关推荐
- call(),apply(),bind()的用法及举例
通过学习call(),apply(),bind()的用法和区别,我们能更好的理解this及作用域的含义,为后面的编程打下基础. call()的用法: 调用一个函数,使其具有一个指定的this值和分别地 ...
- call,apply,bind的用法与区别
1.call/apply/bind方法的来源 首先,在使用call,apply,bind方法时,我们有必要知道这三个方法究竟是来自哪里?为什么可以使用的到这三个方法? call,apply,bind这 ...
- JavaScript中的call,apply,bind区别及应用(包含手写call/apply/bind)
目录 一.使用目的 二.三者分别是如何定义的及区别(摘自MDN) 三.在程序中收获 四.三者的具体应用 四.手写bind,apply,call 今天在读程序题的时候,遇到call,apply,bind ...
- JavaScript的call,apply和bind方法之间的区别
by Rajat Saxena 通过拉贾特·萨克森纳(Rajat Saxena) JavaScript的call,apply和bind方法之间的区别 (The difference between J ...
- JavaScript中的call,apply,bind学习总结
JavaScript 中的 call, apply, bind 这三个函数的作用和区别在各大论坛都被讨论了很多次了,但是我一直都还没来得及好好总结,这次正好看到了一个很不错的关于JavaScript ...
- call apply bind 深入了解
不知其理,何以谈用 众所周知 call.apply.bind 的作用都是'改变'作用域,但是网上对这这'改变'说得含糊其辞,并未做详细说明,'改变'是直接替换作用域?谁替换谁?怎么产生效果?这些问题如 ...
- call,apply,bind,new实现原理
在实际开发过程中,对于函数封装时,不确定外部是谁调用的,调用函数内部方法时,有可能是window调用这时就会报错,常使用call,apply,bind来绑定this指向. Function.proto ...
- bind函数作用、应用场景以及模拟实现
bind函数 bind 函数挂在 Function 的原型上 Function.prototype.bind 创建的函数都可以直接调用 bind,使用: function func(){console ...
- JavaScript内置一些方法的实现原理--new关键字,call/apply/bind方法--前戏
new关键字,call/apply/bind方法都和this的绑定有关,在学习之前,首先要理解this. 一起来学习一下this吧 首先.this是一个对象. 对象很好理解,引用类型值,可以实现如th ...
最新文章
- win7访问不了服务器共享文件夹权限设置,win7系统开启共享文件夹访问权限的操作方法...
- 华为轮值主席鸿蒙,鸿蒙2.0已开源 华为轮值董事长:今年至少3亿设备搭载鸿蒙系统...
- Java 并发——多线程基础
- c语言socket发送excel,socket文件传输功能的实现
- 关于Java中try-catch-finally-return语句的思考
- AttributeError: module 'networkx' has no attribute 'draw_graphviz'解决方案
- jvm gc垃圾回收机制和参数说明amp;amp;Java JVM 垃圾回收(GC 在什么时候,对什么东西,做了什么事情)
- drool 7.x 属性 : lock-on-active
- 程序员总被坑?这是GitHub上的一篇防骗指南
- 最简单DIY基于ESP8266的国产WS2812智能彩灯④(在网页用按钮点亮)
- 有道词典【输入式翻页】
- 让 macbook 外接键盘支持 HOME 键
- Blue Coat:2015年数据安全趋势七大预测
- 孢子社群:今日推荐人工智能微信群:粤、沪、鄂人工智能产业化集群1
- 一个屌丝程序猿的人生(一百零八)
- 水星pppoe连接服务器无响应,利用水星路由器系统日志解决PPPOE拨号故障
- 芯片的本质是什么?(4)物质与数字世界接口
- [转]高精度乘法计算
- Element-UI 表格自定义序号列
- 吴恩达ML WEEK7 机器学习