call(),apply()和bind()的区别
javascript中的每一个Function对象都有一个apply()和一个call()方法,它们的语法分别是:
/*apply()方法*/
function.apply(thisObj[, argArray])
apply: 调用一个对象的一个方法,用另一个对象替换当前对象。 例如: B.apply(A,arguments); 即A对象应用B对象的方法。
/*call()方法*/
function.call(thisObj[, arg1[, arg2[, [,...argN]]]]);
call: 调用一个对象的一个方法,用另一个对象替换当前对象。 例如:B.call(A,args1,args2);即A对象调用B对象的方法。
相同点:
1.方法的含义是一样的,功能自然也是一样的;
2.第一个参数的作用是一样的。
不同点:两者传入的列表形式不一样
1.call可以传入多个参数
2.apply只能传入两个参数,所以器第二个参数往往是作为数组的形式传入。
意义:
实现(多重)继承
实例代码:
function sum(num1,num2){
return num1+num2
}
function sub(num1,num2){
return num1-num2
}
var a1 = sum.apply(sub,[4,2]) // sub调用sum内的方法
console.log(a1) // 6
var a2 = sub.apply(sum,[4,2]) // sum调用sub内部的方法
console.log(a2) // 2
var c1 = sum.call(sub,4,2) // sub调用sum的方法
console.log(c1) // 6
var c2 = sub.call(sum,4,2) // sum调用sub内部的方法
console.log(c2) // 2
window.color = 'red';
var o = {color:'blue'}
function sayColor(){
console.log(this)
console.log(this.color)
}
console.log(this) // window
sayColor.call(this) // window red
sayColor.call(window) // window red
sayColor.call(o) // {color:'blue'} blue
sayColor.apply(this) // window red
sayColor.apply(window) // window red
sayColor.apply(o) // {color:'blue'} blue
实现继承
function Animal(name){
this.name = name
this.showName = function(){
console.log(this.name)
}
}
function Cat(name){
Animal.apply(this,[name])
}
var cat = new Cat("猫")
cat.showName() //猫
// 多继承
function Sum(){
this.sumadd = function(a,b){
console.log(a+b)
}
}
function Sub(){
this.subadd = function(a,b){
console.log(a-b)
}
}
function Js(){
console.log(this) //Js {}
Sum.apply(this)
Sub.apply(this)
}
var a = new Js();
a.sumadd(3,1) //4
a.subadd(3,1) //2
/*bind()方法*/
bind() 这个方法会创建一个函数实例,其this值会被绑定到传给bind()函数的值
var objSayColor = sayColor.bind(o) //{color:'blue'}
objSayColor() // blue
var a = {
user: 'skl',
}
var b = function(e,d,f){
console.log(this.user) //skl
console.log(e,d,f) //10,1,2
};
var c = b.bind(a,10)
c(1,2)
总结:call和apply都是改变上下文中的this并立即执行这个函数,bind方法可以让对应的函数想什么时候调就什么时候调用,并且可以将参数在执行的时候添加,这是它们的区别,根据自己的实际情况来选择使用。
call(),apply()和bind()的区别的更多相关文章
- JS 中的this指向问题和call、apply、bind的区别
this的指向问题 一般情况下this对象指向调用函数的对象,全局环境中执行函数this对象指向window. function a(){ console.log(this); //输出函数a中的th ...
- this+call、apply、bind的区别与使用
http://www.ruanyifeng.com/blog/2018/06/javascript-this.html https://segmentfault.com/a/1190000018017 ...
- 改变this指针的apply,call,bind的区别
apply.call 在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(context)而存在的,换句话说,就是为了改变函数体内部 this 的指向. Jav ...
- js中call、apply和bind的区别
在JS中,这三者都是用来改变函数的this对象的指向的,他们有什么样的区别呢.在说区别之前还是先总结一下三者的相似之处:1.都是用来改变函数的this对象的指向的.2.第一个参数都是this要指向的对 ...
- call和apply和bind的区别
在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(context)而存在的,换句话说,就是为了改变函数体内部 this 的指向. JavaScript 的一大 ...
- 有关call和apply、bind的区别及this指向问题
call和apply都是解决this指向问题的方法,唯一的区别是apply传入的参数除了其指定的this对象之外的参数是一个数组,数组中的值会作为参数按照顺序传入到this指定的对象中. bind是解 ...
- Javascript中call,apply,bind的区别
一.探索call方法原理 Function.prototype.call = function(obj) { // 1.让fn中的this指向obj // eval(this.toString().r ...
- JS中call()和apply()以及bind()的区别
一.方法定义: apply:调用一个对象的一个方法,用另一个对象替换当前对象.例如:B.apply(A, arguments);即A对象应用B对象的方法. call:调用一个对象的一个方法,用另一个对 ...
- 超容易理解的call()、apply()、bind()的区别
call().apply().bind()是用来改变this的指向的. 一 举个例子 一个叫喵喵的猫喜欢吃鱼,一个叫汪汪的小狗喜欢啃骨头,用代码实现如下: 有一天,小狗汪汪和喵喵共进午餐的时候,汪汪说 ...
- apply,all,bind的区别
这三个都是用来改变this指向的 call() 和apply()的第一个参数相同,就是指定的对象.这个对象就是该函数的执行上下文.call()和apply()的区别就在于,两者接收的参数不一样.cal ...
随机推荐
- 数据分析三剑客之pandas
Pandas 引入 前面一篇文章我们介绍了numpy,但numpy的特长并不是在于数据处理,而是在它能非常方便地实现科学计算,所以我们日常对数据进行处理时用的numpy情况并不是很多,我们需要处理的数 ...
- miui 系统铃声
MIUI7-8系统铃声和通知铃声等,从miui system.img中提取出来的: 链接:http://pan.baidu.com/s/1bpH5N5P 密码:tz7p
- ICPC China Nanchang National Invitational -- D. Match Stick Game(dp)
题目链接:https://nanti.jisuanke.com/t/38223 题意:有一堆火柴构成了一个加减法式子,你可以把火柴重新组合,要求数字个数和原来一样多,每个数字的位数和对应原数字位数一样 ...
- echarts 折线图自定义颜色与修改legend颜色
option4 = { title : { text: '', subtext: '' }, color:['#2db7f5','#ff6600','#808bc6'], //关键加上这句话 ...
- openvpn搭建
以ubuntu系统为例: 1.安装openvpn和easy-rsa,easy-rsa主要用来设置CA(证书颁发机构) $ sudo apt-get update $ sudo apt-get inst ...
- CTF--web 攻防世界web题 robots backup
攻防世界web题 robots https://adworld.xctf.org.cn/task/answer?type=web&number=3&grade=0&id=506 ...
- Django mysql应用
环境:python3.Django2 1.安装驱动mysqlclient pip3 install mysqlclient 2.创建一个数据库 CREATE DATABASE database_nam ...
- JavaEE三大框架整合
搭建项目: 搭建一个实际的项目,为了避免影响到你之前已经搭建过的项目,可以先新建一个工作空间,指定一个新的空间来做这一次的项目,不会和其他的项目冲突,尤其是在编码这一部分. 指定新工作空间的目录: 一 ...
- 在线批量修改mysql中表结构
在线批量修改mysql中表结构 1.获取要修改的表的表名称登录mysql库,查询出所有表 show tables; 将需要修改表结构的表名称存放到b.txt文件中2.执行修改修改表引擎为InnoDB ...
- .NET框架 - NETCORE + API + EF + MYSQL
.NET框架 - NETCORE + API + EFCORE + MYSQL 1. 新建项目: 本文中使用 框架 .netcore2.2 . 2. 生成项目框架 3 安装MYSQL插件 点击“工具” ...