call()、apply()、bind()
1.均可以改变函数的执行上下文,也就是this值;
2.call() apply()
function apply(num1, num2){
return sum.apply(this, [num1,num2]);
}
function call(num1, num2){
return sum.call(this, num1, num2);
}
参数的第一部分:执行上下文,就是this;
参数的第二部分:需要传递的参数,可以是一个,也可以为多个;
apply第二部分需要的是一个数组作为参数;
call第二部分的参数是数组里面的元素,需要一个一个传,用逗号隔开;
但是第二部分均可以传arguments;
如果call和apply的第一个参数写的是null,那么this指向的是window对象。
var a = {
user:"zhangsan",
fn:function(){
console.log(this);//Window {speechSynthesis: SpeechSynthesis, caches: CacheStorage, localStorage: Storage, sessionStorage: Storage, webkitStorageInfo: DeprecatedStorageInfo…}
}
}
var b = a.fn;
b.apply(null);
3.bind()
属于es5中的方法,也是用来实现上下文绑定,但是它是新创建一个函数,称为绑定函数,然后把它的上下文绑定到bind()括号中的参数上,然后将它返回;
4.bind()与call()、apply()最大的区别:bind()不会立即调用,需要加上()来执行,其他两个会直接调用;
bind方法可以让对应的函数想什么时候调就什么时候调用,并且可以将参数在执行的时候添加,视情况而定。
1.第一个参数均是this要指向的对象;
2.都是用来改变函数this对象的指向;
3.都可以继续传递参数.
看代码:
var person = {
name: 'zhangsan',
sex: '男',
say: function(){
console.log(this.name + ',' + this.sex);
}
}
var other = {
name: 'lili',
sex: '女',
}
person.say.call(other);//lili,女
person.say.apply(other);//lili,女
person.say.bind(other)();//lili,女
带参数形式:
var person = {
name: 'zhangsan',
sex: '男',
say: function(school,grade){
console.log(this.name + ',' + this.sex + ';' + school + grade);
}
}
var other = {
name: 'lili',
sex: '女',
}
person.say.call(other,'北京大学','2');//lili,女;北京大学2
person.say.apply(other,['清华大学','3']);//lili,女;北京大学3
person.say.bind(other,'南开大学',4)();//lili,女;北京大学4
call()、apply()、bind()的更多相关文章
- JS中call、apply、bind使用指南,带部分原理。
为什么需要这些?主要是因为this,来看看this干的好事. box.onclick = function(){ function fn(){ alert(this); } fn();}; 我们原本以 ...
- Javascript中call、apply、bind函数
javascript在函数创建的时候除了自己定义的参数外还会自动新增this和arguments两个参数 javascript中函数也是对象,call.apply.bind函数就是函数中的三个函数,这 ...
- 图解call、apply、bind的异同及各种实战应用演示
一.图解call.apply.bind的异同 JavaScript中函数可以通过3种方法改变自己的this指向,它们是call.apply.bind.它们3个非常相似,但是也有区别.下面表格可以很直观 ...
- JavaScript中call、apply、bind、slice的使用
1.参考资料 http://www.cnblogs.com/coco1s/p/4833199.html 2.归结如下 apply . call .bind 三者都是用来改变函数的this对象的指向 ...
- JS中的call、apply、bind方法
JS中的call.apply.bind方法 一.call()和apply()方法 1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[, [,.argN]]] ...
- js中call、apply、bind那些事
前言 回想起之前的一些面试,几乎每次都会问到一个js中关于call.apply.bind的问题,比如- 怎么利用call.apply来求一个数组中最大或者最小值 如何利用call.apply来做继承 ...
- 前端总结·基础篇·JS(三)arguments、callee、call、apply、bind及函数封装和构造函数
前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 前端总结·基础篇·JS(一)原型.原型链.构造函数和字符串(String) 前 ...
- 数组去重,call、apply、bind之间的区别,this用法总结
一.数组去重,直接写到Array原型链上. //该方法只能去除相同的数字 不会去判断24和'24'是不同的 所有数字和字符串数字是相同是重复的 Array.prototype.redup=functi ...
- javascript中call()、apply()、bind()的用法终于理解
其实是一个很简单的东西,认真看十分钟就从一脸懵B 到完全 理解! 先看明白下面: 例1 obj.objAge; //17 obj.myFun() //小张年龄undefined 例2 shows( ...
- JS 中的this指向问题和call、apply、bind的区别
this的指向问题 一般情况下this对象指向调用函数的对象,全局环境中执行函数this对象指向window. function a(){ console.log(this); //输出函数a中的th ...
随机推荐
- SSH-简单登陆业务详解,从环境部署到代码编写
一直都是半解半知的情况下动手去实现某些功能,但是竟然也可以成功, 而我发现你花2小时听视频看所谓的理论,不如花2小时直接做个功能出来, 更加深了对此框架的理解,中间遇到问题后,可以上网再查详细的知识点 ...
- android O 蓝牙设备默认名称更改
安卓系统会首先读取BTM_DEF_LOCAL_NAME的值,如果为空,就使用"ro.product.model"作为蓝牙设备名. system/bt/btif/src/btif_d ...
- JsonCpp 判断 value 中是否有某个KEY
JsonCpp如何判断是否有某个KEY,使用json[“key”]和isXXX的函数即可. 如果json中没有key键,则会创建一个空成员或者返回一个空成员. bool isNull() const; ...
- Java如何使用线程解决死锁?
在Java编程中,如何使用线程解决死锁? 以下示例演示如何使用线程的概念解决死锁问题. // from W w w .Y I I b AI.c o M package com.yiibai; impo ...
- JDBC删除表实例
在本教程将演示如何在JDBC应用程序中删除一个数据库表. 在执行以下示例之前,请确保您已经准备好以下操作: 具有数据库管理员权限,以在给定模式中删除数据库表. 要执行以下示例,需要用实际用户名和密码替 ...
- 详细分析Java中断机制[转]
1. 引言 当我们点击某个杀毒软件的取消按钮来停止查杀病毒时,当我们在控制台敲入quit命令以结束某个后台服务时……都需要通过一个线程去取消另一个线程正在执行的任务.Java没有提供一种安全直接的方法 ...
- c# 递归函数使用案例
/// <summary> /// 递归查询 /// </summary> /// <param name="groupID"></par ...
- Python MySQL(MySQLdb)
From: http://www.yiibai.com/python/python_mysql.html Python标准的数据库接口的Python DB-API(包括Python操作MySQL).大 ...
- MySQL错误ERROR 2002 (HY000): Can't connect to local MySQL server
From: http://www.jb51.net/article/56952.htm 这篇文章主要介绍了MySQL错误ERROR 2002 (HY000): Can't connect to loc ...
- objelement = event.target || event.srcElement;
objelement = event.target || event.srcElement; function updateProductVideo(e){ e = window.event || a ...