javascript-this,call,apply,bind简述3
上节介绍了call()和apply()的用法,这节再讨论一下arguments参数和bind函数的用法以及函数柯里化就算是完结了。
bind()函数
先看定义:
bind()方法会创建一个函数的实例,其this值会被绑定到传给bind()函数的值。代码如下:
var name="window";
var obj={
name:"obj对象"
}; function sayName(){ console.log(this.name)
}; var bindSayName = sayName.bind(obj); bindSayName(); //obj对象
由代码可以看出,call()函数会直接调用,而bind()函数则是先生成,再通过其他途径来调用,但是this指针不会再发生改变。
arguments
函数体内可以通过arguments对象来访问参数数组,从而获得传递给函数的每一个参数。
function fn (x,y,z) {
arguments.length; //
arguments[0]; //
arguments[0]=10;
console.log(x); //
arguments[2]=100;
console.log(z) //undefined
arguments.callee ===fn //true
}
fn(1,2);
使用arguments来获得函数参数时,arguments需要和参数之间存在绑定关系,如4,5行是可以修改成功的,但7,8行是没有绑定关系的,因为并没有一开始传递z这个参数进来。(4,5行在严格模式下参数也是不会变化的)
arguments对象的长度是由传入的参数个数决定的,不是由定义函数时的命名参数的个数决定。
函数currying化
即把函数拆分成多个单元。比如:
function add(a,b,c) {
return a+b+c;
}
var fun1 = add.bind(undefined,100);
fun1(1,2); //
var fun2 = fun1.bind(undefined,200);
fun2(10); //
5,6行表示给add函数绑定了一个undefined(相当于window),并传递了一个参数100,则100会首先赋值给add函数的参数a,然后执行fun1,b和c分别赋值为1,2,得到103。8,9行再在fun1的基础上绑定参数200,这时200会传递给参数b,因为a已经绑定为100,然后传入c=10,得到310。
柯里化的好处
function getConfig (colors,size,other) {
console.log(colors,size,other);
}
var defaultConfig = getConfig.bind(undefined,"#000","1024*768");
defaultConfig("嘿嘿"); //#000 1024*768 嘿嘿
defaultConfig("呵呵"); //#000 1024*768 呵呵
可以看出来,第五行可以只传入两个参数,第七行和第八行分别再传入other参数,colors和size参数则是公共的,这样可以大量减小代码冗余。
bind和new
function fn () {
this.a=100;
return this.b;
}
var fun1 = fn.bind({b:1});
fun1(); //
new fun1() //{a:100}
return后必须是个对象才会作为返回值,否则会返回this的值,this会指向无bind时的this指向,并返回所有的值。
bind方法的实现
if (!Function.prototype.bind) {
Function.prototype.bind = function(oThis) {
if (typeOf this!=='function') {
throw new Error('调用bind函数的对象不是function。')
};
//函数实现
var aArgs= Array.prototype.slice.call(arguments,1),
fToBind=this,
fNOP = function(){},
fBound = function () {
return fToBind.apply(this instance fNOP?this:oThis,
aArgs.concat(Array.prototype.slice.call(arguments)))
};
fNOP.prototype = this.prototype;
fBound.prototype = new fNOP();
return fBound;
};
};
bind方法的实现还是比较绕的,等研究完原型链有关的内容再回头做这段代码的介绍。
javascript-this,call,apply,bind简述3的更多相关文章
- javascript-this,call,apply,bind简述2
上节我们一起研究了this这个小兄弟,得出一个结论,this指向调用this所在函数(或作用域)的那个对象或作用域.不太理解的朋友可以看看上节的内容,这次我们主要探讨一下call(),apply(), ...
- javascript-this,call,apply,bind简述1
最近在系统的学习面向对象方面的知识,遇到的最大拦路虎就数this的指向,call,apply,bind函数的使用,单独抽出一天时间把这几个烦人的家伙搞定,去学习更深入的内容. 首先介绍一下this的一 ...
- javascript中call,apply,bind的用法对比分析
这篇文章主要给大家对比分析了javascript中call,apply,bind三个函数的用法,非常的详细,这里推荐给小伙伴们. 关于call,apply,bind这三个函数的用法,是学习java ...
- JavaScript中call,apply,bind方法的总结。
why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之前,通常会有这些问题. var a = { user:"追梦子", fn:f ...
- JavaScript中call,apply,bind方法的总结
原文链接:http://www.cnblogs.com/pssp/p/5215621.html why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之 ...
- JavaScript中call,apply,bind方法的区别
call,apply,bind方法一般用来指定this的环境. var a = { user:"hahaha", fn:function(){ console.log(this.u ...
- JavaScript中call,apply,bind方法
why?call,apply,bind干什么的?为什么要学这个? 一般用来指定this的环境,在没有学之前,通常会有这些问题. var a = { user:"追梦子", fn:f ...
- JavaScript 之 call apply bind
关键字 this 绑定的方法 this的动态切换,固然为JavaScript创造了巨大的灵活性,但也使得编程变得困难和模糊.有时,需要把this固定下来,避免出现意想不到的情况.JavaScript提 ...
- javascript中call,apply,bind的使用
不同点: 1.call():传参方式跟bind一样(都是以逗号隔开的传参方式),但是跟apply(以数组的形式传参)不一样, 2.bind(): 此方法应用后的情形跟call和apply不一样.该方法 ...
随机推荐
- CLR via C#深解笔记四 - 方法、参数、属性
实例构造器和类(引用类型) 构造器(constructor)是允许将类型的实例初始化为良好状态的一种特殊方法.构造器方法在“方法定义元数据表”中始终叫.ctor. 创建一个引用类型的实例时: #1, ...
- php XML 读写 创建
一 .XML 读 1.1. 首先同目录定义好一个XML文件 : book.xml <?xml version="1.0" encoding="utf-8" ...
- JAVA和C# 3DES加密解密
最近 一个项目.net 要调用JAVA的WEB SERVICE,数据采用3DES加密,涉及到两种语言3DES一致性的问题, 下面分享一下, 这里的KEY采用Base64编码,便用分发,因为Java的B ...
- Understanding apps: mobile, native or responsive
Background Maybe you have decided to get an app built. You will not build it yourself (obviously!) s ...
- IT痴汉的工作现状24-Just for fun
早在大学一开始我进行Linux的学习了,那时大家都跟Windows Xp玩的火热,而我从来就不走寻常路,在XP上安装了VMware虚拟机搞起了Linux的探索.这简直让我眼界大开,每天都和那么多的国外 ...
- ES6入门系列一(基础)
1.let命令 Tips: 块级作用域(只在当前块中有效) 不会变量提升(必须先申明在使用) 让变量独占该块,不再受外部影响 不允许重复声明 总之:let更像我们熟知的静态语言的的变量声明指令 ES6 ...
- python 在sublime 中的配置
首先可以先装package control 方法——按ctrl+`,然后在命令行里复制粘贴以下代码, import urllib2,os;pf='Package Control.sublime-pac ...
- 帮助你在 Photoshop 中轻松实现长阴影效果的工具
扁平化设计正被用于各个主流的移动操作系统以及许多流行的网站,这是一个不断上升的趋势. 这种趋势有其分支,其中之一是“长阴影 “的效果在元素上的使用. 采用角度为 45 度的投影,给对象添加了一份立体感 ...
- sitemesh学习笔记(2)
之前我也是通过网上一些资料来学习sitemesh的,后来发现那些资料都比较老了,现在最近的已经是sitemesh3了而我之前看的是sitemesh2.3,今天重新去看了一些sitemesh3的资料,发 ...
- SystemTap知识(二)
Unbuntu安装systemtap: http://www.cnblogs.com/hdflzh/archive/2012/07/25/2608910.html 1 更新源到http://mirro ...