bind,apply,call区别总结
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
var test = {
a : 5,
b : 6,
sum : function (a,b) {
var self = this;
function getA() {
return self.a;
}
function getB(){
return self.b;
}
alert(a);
alert(b);
return getA() + getB();
}
}
var obj = {a:2,b:3};
alert(test.sum.call(obj,4,5)); // alert顺序4,5,5
alert(test.sum.apply(obj,[6,7])); // alert顺序6,7,5
var sum = test.sum.bind(obj,8); // sum(b)
alert(sum(9));
// call
// var a = {
// user:"追梦子",
// fn:function(e,ee){
// console.log(this.user); //追梦子
// console.log(e+ee); //3
// }
// }
// var b = a.fn;
// b.call(a,1,2);
// //apply
// var a = {
// user:"追梦子",
// fn:function(e,ee){
// console.log(this.user); //追梦子
// console.log(e+ee); //11
// }
// }
// var b = a.fn;
// b.apply(a,[10,1]);
// //bind
// var a = {
// user:"追梦子",
// fn:function(){
// console.log(this.user);
// }
// }
// var b = a.fn;
// b.bind(a);
//我们发现代码没有被打印,这就是bind和call、apply方法的不同,实际上bind方法返回的是一个修改过后的函数。
// 那么我们现在执行一下函数c看看,能不能打印出对象a里面的user
// var a = {
// user:"追梦子",
// fn:function(){
// console.log(this.user); //追梦子
// }
// }
// var b = a.fn;
// var c = b.bind(a);
// c();
// // ok,同样bind也可以有多个参数,并且参数可以执行的时候再次添加,但是要注意的是,参数是按照形参的顺序进行的。
// var a = {
// user:"追梦子",
// fn:function(e,d,f){
// console.log(this.user); //追梦子
// console.log(e,d,f); //10 1 2
// }
// }
// var b = a.fn;
// var c = b.bind(a,10);
// c(1,2);
// 总结:call和apply都是改变上下文中的this并立即执行这个函数,bind方法可以让对应的函数想什么时候调就什么时候调用,并且可以将参数在执行的时候添加,这是它们的区别,根据自己的实际情况来选择使用。
bind方法生成了一个新的函数,称为绑定函数,传入bind方法的第一个参数作为这个绑定函数的this对象,传入bind的第二个参数连同后面调用绑定函数时传入的参数按照先后顺序(传入bind的在前)构成绑定函数的参数。
现在我们把上面的例子修改一下:
render: function () {
this.getAsyncData(function () {
this.specialFunction();
}.bind(this));
}
.bind()创建了一个函数,当这个函数在被调用的时候,它的 this 关键词会被设置成被传入的值(这里指调用bind()时传入的参数)
再看一个bind的使用例子:
var foo = {
x: 3
}
var bar = function(){
console.log(this.x);
}
bar(); // undefined
var boundFunc = bar.bind(foo);
boundFunc(); // 3
将bar方法和foo对象绑定后,bar中的this对象被替换为了foo,并生成了一个新的函数boundFunc,因此在全局环境中调用boundFunc时,也可以访问到foo对象的属性。
还可以了解一下Function.prototype.bind()内部是什么样的:
Function.prototype.bind = function (scope) {
var fn = this;//this是调用bind方法的对象(别的方法对象)
return function () {
return fn.apply(scope);//把fn环境中的this替换为scope
};
}
可看出,bind方法返回了一个新的函数,这个方法返回了原方法(调用bind的方法)通过apply修改作用域(传入的参数scope)后的执行结果。如果调用这个新函数则会立即执行fn.apply(scope),并返回执行后的结果。
fn.bind()
与call、apply的区别
call、apply是修改函数的作用域,并且立即执行,而bind是返回了一个新的函数,不是立即执行,即call and apply call a function while bind creates a function。bind在回调函数中常用到
</script>
</body>
</html>
bind,apply,call区别总结的更多相关文章
- call bind apply的区别
call() 和apply()的第一个参数相同,就是指定的对象.这个对象就是该函数的执行上下文. call()和apply()的区别就在于,两者之间的参数. call()在第一个参数之后的 后续所有参 ...
- 数组去重,call、apply、bind之间的区别,this用法总结
一.数组去重,直接写到Array原型链上. //该方法只能去除相同的数字 不会去判断24和'24'是不同的 所有数字和字符串数字是相同是重复的 Array.prototype.redup=functi ...
- this指向和apply,call,bind三者的区别
一.前言 this指向,apply,call,bind的区别是一个经典的面试问题,同时在项目中会经常使用到的原生的js方法.同时也是ES5中的众多坑的一个.ES6中可能会极大的避免了this产生的错误 ...
- call、apply、bind三者的区别
先构造函数let xiaowang={ name1:"小王", age:", sex:"男", say:function(){ console.log ...
- JavaScript中的call、apply、bind方法的区别
在JavaScript 中,this的指向是动态变化的,很可能在写程序的过程中,无意中破坏掉this的指向,所以我们需要一种可以把this的含义固定的技术,于是就有了call,apply 和bind这 ...
- bind、call、apply的区别与实现原理
1.简单说一下bind.call.apply的区别 三者都是用于改变函数体内this的指向,但是bind与apply和call的最大的区别是:bind不会立即调用,而是返回一个新函数,称为绑定函数,其 ...
- bind call apply 的区别和使用
bind call apply 的区别和使用:https://www.jianshu.com/p/015f9f15d6b3 在讲这个之前要理解一些概念,这些概念很重要,有人说过学会了javascrip ...
- bind,apply,call的区别
在Javascript中,bind, apply, call方法都可以显式绑定上下文this,这三者有何不同呢? bind只绑定this不马上执行 var person = { firstname: ...
- 箭头函数表达式和声名式函数表达式的区别以及 Function.prototype的bind, apply,call方法
箭头函数不能用做构造函数 箭头函数没有arguments参数 箭头函数没有自己的this,是从作用域链上取this,是与箭头函数定义的位置有关的,与执行时谁调用无关,所以用call,apply,bin ...
随机推荐
- Spring的IOC分析(二)源码
承接上节继续,分析Ioc的工作原理,在典型的 IOC 场景中,容器创建了所有对象,并设置必要的属性将它们连接在一起(同时一个叫DI"依赖注入"或DL"依赖查找" ...
- [国嵌攻略][151][nandflash驱动程序设计]
初始化 打开/drivers/mtd/nand/s3c2410.c找到nand flash驱动程序代码,找到模块初始化函数s3c_nand_init,找到platform_driver中的probe函 ...
- [国嵌攻略][100][嵌入式Linux内核制作]
Linux内核制作步骤 1.清除原有配置 make distclean 2.配置内核 选择一个已有的配置文件简化配置 make menuconfig ARCH=arm 3.编译内核 ARCH指明处理器 ...
- [C#]使用控制台获取天气预报
本例子主要是使用由中央气象局网站(http://www.nmc.gov.cn)提供的JSON API,其实现思路如下: 1.访问获取省份(包含直辖市.自治区等,以下简称省份)的网址(http://ww ...
- 在js中怎样获得checkbox里选中的多个值?
https://zhidao.baidu.com/question/203897221.html 思路:利用name属性值获取checkbox对象,然后循环判断checked属性(true表示被选中, ...
- Codeforces 448 D. Multiplication Table 二分
题目链接:D. Multiplication Table 题意: 给出N×M的乘法矩阵要你求在这个惩罚矩阵中第k个小的元素(1 ≤ n, m ≤ 5·10^5; 1 ≤ k ≤ n·m). 题解: n ...
- Hive 多分隔符的使用 (转载)
方法一)通过org.apache.hadoop.hive.contrib.serde2.RegexSerDe格式的serde. 1) 建表语句 #指定以^|~作为分隔符 CREATE TABlE ta ...
- 实现iota函数
void Reverse(char *s) { char temp; char *p = s; char *q = s; while (*p != '\0') { p ++; } q --; whil ...
- k8s 如何 Failover?- 每天5分钟玩转 Docker 容器技术(127)
上一节我们有 3 个 nginx 副本分别运行在 k8s-node1 和 k8s-node2 上.现在模拟 k8s-node2 故障,关闭该节点. 等待一段时间,Kubernetes 会检查到 k8s ...
- java中的Iterator与增强for循环的效率比较
最近在优化代码时遇到了这个问题:Iterator与增强for循环到底哪个效率高?之前在学习的时候,好像记着老师说过遍历集合(如list)时,使用iterator好像正规一些,因为是专用的,但是运行效率 ...