前端知识点整理系列(二)—— apply() call() bind()
来源:互联网 发布:windows启动过程 编辑:程序博客网 时间:2024/06/14 18:18
最近在刷牛客网的前端题,涉及到很多apply()
,call()
,bind()
的调用,今天抽空整理一下这种函数的调用方法。
我们知道,在js里,万物皆对象,一个函数本身就是一个对象,所以它自然拥有一些方法,在js里,每一个函数都拥有一个prototype——Function
,其中apply()
,call()
,bind()
就是这个原型自带的方法。我们知道这三个方法都能改变函数this的指向,其实他们的区别不是很大,今天就整理一下他们之间的区别。
先说 apply()
方法,它让我们构造一个参数数组传递给函数,同时可以自己来设置 this 的值,这就是它最强大的地方。它有两个参数,第一个参数是传递给这个函数用来绑定this的值,第二个参数传递的是一个数组。
function a(xx) { this.b = xx;}var o = {};a.apply(o, [5]);alert(a.b); // undefinedalert(o.b); // 5
我们对a进行apply()
方法调用,函数 a 居然可以给 o 加属性值。当然,如果你 apply()
的第一个参数传递 null,那么在函数 a 里面 this 指针依然会绑定全局对象。
再谈谈call()
,其实call()
和apply()
没有什么本质的区别,在于第二个参数,apply()
传递的是一个数组,你想传递给这个函数的所有参数都放在数组里,而call()
传递的是一个一个参数。
function a(xx, yy) { alert(xx, yy); alert(this); alert(arguments);}a.apply(null, [5, 55]);a.call(null, 5, 55);
仅此而已。
再来看看bind()
方法,上面讲的无论是 call()
也好, apply()
也好,都是立马就调用了对应的函数,而 bind()
不会,bind()
会生成一个新的函数,bind()
函数的参数跟 call()
一致,第一个参数也是绑定 this 的值,后面接受传递给函数的不定参数。 bind()
生成的新函数返回后,你想什么时候调就什么时候调,看下代码就明白了
var m = { "x" : 1};function foo(y) { alert(this.x + y);}foo.apply(m, [5]);foo.call(m, 5);var foo1 = foo.bind(m, 5);foo1();
下面看一个牛客网上的例子,利用apply()调用函数。
题目描述
实现函数 callIt,调用之后满足如下条件
1、返回的结果为调用 fn 之后的结果
2、fn 的调用参数为 callIt 的第一个参数之后的全部参数
var a = 1; var b = 2; var test = function (first, second) { return first === a && second === b;}; callIt(test, a, b);
我们来实现这个callIt函数。
function callIt(fn) { var args = []; for(var i=1;i<arguments.length;i++){ args.push(arguments[i]); } return fn.apply(this,args);}
- 前端知识点整理系列(二)—— apply() call() bind()
- 前端JavaScript学习(一)(call、apply、bind)
- JavaScript基础知识——apply、call、bind
- JavaScript OOP(二):this关键字以及call、apply、bind
- 前端知识点整理系列(一)—— Ajax
- js笔记——call,apply,bind使用笔记
- [前端] call、apply、bind 和 aguments、caller、callee解析
- 深入理解函数内部原理(六)——函数的内部方法call、apply、bind
- 每日一则(2):call apply bind
- 改变this指向(call、apply、bind)
- 彻底理解call()及其apply.bind
- call apply 与 bind
- call()、apply()、bind()
- apply bind call区别
- call,apply,bind
- 【JavaScript】call, apply, bind
- bind apply call异同
- apply call bind区别
- 选择排序
- [LeetCode] Perfect Squares
- VB.NET总结
- vue--mounted
- java中IO流中的标准输入输出流
- 前端知识点整理系列(二)—— apply() call() bind()
- java中IO流中的转换流
- 图标切换,内容展开
- 【PostgreSQL-9.6.3】设置log参数
- ARGB与RGB、RGBA的区别
- Torch SpatialZeroPadding 实例
- Java基础练习项目-猜字母小游戏
- 正则化
- java中IO流中的 打印流