javascript 的bind/apply/call性能
javascript
有两种使用频率非常高的三个内置的功能:bind/apply/call
。许多技术是基于高点,这些功能实现。这三个功能被用来改变的功能运行环境.从而达到代码复用的目的。
先来所说bind
函数, bind,函数通常有两个用途:
1. 创建新函数,指定函数的this指针。
name = 'global';
var obj1 = {name: 'foo'};
var showName = function() {
console.log(this.name);
}
showName(); //global
var showObj = showName.bind(obj1);
showObj(); // foo
2. bind函数体现出偏函数的思维,能够有效降低匿名函数的使用,譬如,有一个接收用户不同请求并分发处理的模块:
//query: 请求參数
//config:不同请求的配置信息
function dispatcher(query, config) {
var action = query.action;
switch(action){
case 'action1':{
//....
break;
}
}
}
dispatcher函数运行的操作都是相似的,仅仅是不同的用户请求须要不同的config配置信息。能够有例如以下做法:
function createDispatcher(config) {
return function(query) {
dispatcher(query, config);
};
}
当然假设须要多个參数也能够这样搞:
function createDispatcher(config, ext) {
//借用Array原型对象的slice函数把函数參数拷贝一份
var args = Array.prototype.slice.call(arguments);
return function (query) {
var newArgs = args.push(query);
dispatcher.apply(null, newArgs);
};
}
假设通过bind来实现,能够这样搞:
function dispatcher(config, query) {
//
}
//创建分发函数
var dispatch1 = dispatcher.bind(null, config1);
var dispatch2 = dispatcher.bind(null, config2);
var dispatch3 = dispatcher.bind(null, config3);
在这里我们不须要改变bind返回的偏函数的this指针。所以bind函数第一个參数传null。
仅仅须要指定一个固定的參数。所以一句话就搞定了。
再说说apply函数。apply和call函数能够方便的实现函数借用。javascript这样的基于原型继承的语言,基础类型的原型为我们提供了很多方便的内建函数,譬如,我要把上面的分发函数写成一个通用的模块。即:把分发行为也抽象出来,由使用者来指定函数行为。createDispatcher
仅仅是收集用户參数并调用指定的动作函数:
function createDispatcher(doit, context) {
var args = Array.prototype.slice.call(arguments, 2);
return function() {
doit.apply(context, args.concat(Array.prototype.slice.call(arguments));
}
}
var obj1 = {name: 'obj1'};
var obj2 = {name: 'obj2'};
var showParams1 = function() {
console.log(this.name + 'got it: ' + arguments.join('+'));
};
var showParams2 = function() {
console.log(this.name + 'got it: ' + arguments.join('-'));
};
//obj1 got it: 1+2+3
createDispatcher(showParams1, obj1)(1, 2, 3);
//obj2 got it: 4-5-6
createDispatcher(showParams2, obj2)(4, 5, 6);
apply与call的唯一差别是apply通过数组的形式传參,而call须要把參数列在函数后面,能够觉得apply是javascript语言基于call构造的一个语法糖罢了~
版权声明:本文博主原创文章,博客,未经同意不得转载。
javascript 的bind/apply/call性能的更多相关文章
- javascript中bind,apply,call的相同和不同之处
javasctipt中bind,apply,call的相同点是: 1,都是用来改变this的指向; 2,都可以通过后续参数进行传参; 3,第一个参数都是指定this要指向的对象; 不同点: 1,调用方 ...
- 博文推荐】Javascript中bind、call、apply函数用法
[博文推荐]Javascript中bind.call.apply函数用法 2015-03-02 09:22 菜鸟浮出水 51CTO博客 字号:T | T 最近一直在用 js 写游戏服务器,我也接触 j ...
- 《JavaScript总结》apply、call和bind方法
在JavaScript中,apply.call.bind这个三个方法,它们的作用都是为了改变某个函数运行时的上下文, 也就是改变函数体内的this指向. 在一个函数里,存在“定义时上下文”.“运行时上 ...
- javascript中call,apply,bind的用法对比分析
这篇文章主要给大家对比分析了javascript中call,apply,bind三个函数的用法,非常的详细,这里推荐给小伙伴们. 关于call,apply,bind这三个函数的用法,是学习java ...
- 面试官:能解释一下javascript中bind、apply和call这三个函数的用法吗
一.前言 不知道大家还记不记得前几篇的文章:<面试官:能解释一下javascript中的this吗> 那今天这篇文章虽然是介绍javascript中bind.apply和call函数 ...
- javascript中bind函数的作用
javascript的bind的作用 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...
- bind,apply,call的区别
在Javascript中,bind, apply, call方法都可以显式绑定上下文this,这三者有何不同呢? bind只绑定this不马上执行 var person = { firstname: ...
- 箭头函数表达式和声名式函数表达式的区别以及 Function.prototype的bind, apply,call方法
箭头函数不能用做构造函数 箭头函数没有arguments参数 箭头函数没有自己的this,是从作用域链上取this,是与箭头函数定义的位置有关的,与执行时谁调用无关,所以用call,apply,bin ...
- javascript call与apply关键字的作用
apply接受两个参数.第一个参数指定函数体内this对象的指向,第二个参数为一个带下标的集合. call则是apply的语法糖,如果参数数量固定,则可以不用带下标的集合传第二个参数. 1 2 3 4 ...
随机推荐
- tmpfs(/dev/shm)
tmpfs是一种基于内存的文件系统,它和虚拟磁盘ramdisk比较类似像,但不完全相同,和ramdisk一样,tmpfs可以使用RAM,但它也可以使用swap分区来存储.而且传统的ramdisk是个块 ...
- js技术要点---JS 获取网页源代码
JS 获取网页源代码 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html& ...
- hdu1506(dp求最大子矩阵)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1506 分析: 对于每个单位矩阵,我们先求出连续比它高的最左边的下标假设为l,然后求出比它高的最右边的下 ...
- 【微信公众平台开发】公布动态新闻好帮手UEditor富文本
因为微信要做公布动态新闻.那就须要富文本. 上网搜索有非常多这样的插件,比方CKEditor.KindEditor等:最后看到百度一款开源的UEditor.官网打开,风格设计就吸引住了自己.所以就选U ...
- c++构造函数隐式转换--转换构造函数
其实我们已经在C/C++中见到过多次标准类型数据间的转换方式了,这种形式用于在程序中将一种指定的数据转换成另一指定的类型,也即是强制转换,比如:int a = int(1.23),其作用是将1.23转 ...
- LeetCode: Best Time to Buy and Sell Stock III [123]
[称号] Say you have an array for which the ith element is the price of a given stock on day i. Design ...
- http协议之cookie标准RFC6265介绍
[Docs] [txt|pdf] [draft-ietf-httpst...] [Diff1] [Diff2] [Errata] PROPOSED STANDARD Errata Exist In ...
- HDU 4126 Genghis Khan the Conqueror MST+树形dp
题意: 给定n个点m条边的无向图. 以下m行给出边和边权 以下Q个询问. Q行每行给出一条边(一定是m条边中的一条) 表示改动边权. (数据保证改动后的边权比原先的边权大) 问:改动后的最小生成树的权 ...
- 第三章 AOP 基于@AspectJ的AOP
在前面,我们分别使用Pointcut.Advice.Advisor接口来描述切点.增强.切面.而现在我们使用@AdpectJ注解来描述. 在下面的例子中,我们是使用Spring自动扫描和管理Bean. ...
- Android下的单元測试
android下的单元測试 在AndroidManifest.xml文件里配置下面信息: 在manifest节点下加入: <!-- 指定測试信息和要測试的包 --> <instrum ...