JavaScript函数中的这四种绑定形式

　　

　　

, javascript中的这和函数息息相关,所以今天,我就给大家详细地讲述一番:javascript函数中的这个
　　

　　

一谈到这个,很多让人晕晕乎乎的抽象概念就跑出来了,这里我就只说最核心的一点——函数中的这个总指向调用它的对象,接下来的故事都将围绕这一点展开
　　

　　

(提醒前排的筒子们准备好茶水和西瓜,我要开始讲故事啦! !)
　　

　　

【故事】有一个年轻人叫“迪斯”(这),有一天,迪斯不小心穿越到一个叫“伽瓦斯克利”(javascript)的异世界,此时此刻迪斯身无分文,他首先要做的事情就是——找到他的住宿的地方,调用函数的对象

　　

　　

　　

【故事——线路1】如果迪斯(这)直到天黑前都没有找到能收留自己的住所,他眼看就要过上非洲难民的生活,这时候,一位乐善好施的魔法师村长——窗口救世主一般地出现了:先住在我家吧!,
　　

　　

　　

【正文】

　　

当一个函数没有明确的调用对象的时候,也就是单纯作为独立函数调用的时候,将对函数的这使用默认绑定:绑定到全局的窗口对象

　　 　　 　　函数火(){ 　　控制台。日志(这个===窗口) 　　} 　　火();//输出真正的 　　 　　

上面的例子我相信对大多数人都很简单,但有的时候我们把例子变一下就会具有迷惑性:

　　 　　 　　函数火(){//我是被定义在函数内部的函数哦! 　　函数innerFire () { 　　控制台。日志(这个===窗口) 　　} 　　innerFire ();//独立函数调用 　　} 　　火();//输出真正的 　　 　　

函数innerFire在一个外部函数火里面声明且调用,那么它的这个是指向谁呢?仍然是窗口
　　

　　

许多人可能会顾虑于火函数的作用域对innerFire的影响,但我们只要抓住我们的理论武器——没有明确的调用对象的时候,将对函数的这使用默认绑定:绑定到全局的窗口对象,便可得正确的答案了,
　　

　　

下面这个加强版的例子也是同样的输出真正的

　　 　　 　　var obj={ 　　火:函数(){ 　　函数innerFire () { 　　控制台。日志(这个===窗口) 　　} 　　innerFire ();//独立函数调用 　　} 　　} 　　obj.fire ();//输出真正的 　　 　　

【注意】在这个例子中,obj.fire()的调用实际上使用到这了的隐式绑定,这就是下面我要讲的内容,这个例子我接下来还会继续讲解,
　　

　　

【总结】凡事函数作为独立函数调用,无论它的位置在哪里,它的行为表现,都和直接在全局环境中调用无异,
　　

　　

　　

【故事——线路2】迪斯(这)穿越来异世界”伽瓦斯克利”(javascript)的时候,刚好身上带了一些钱,于是他找到一个旅馆住宿了下来,
　　

　　

　　

当函数被一个对象“包含”的时候,我们称函数的这个被隐式绑定到这个对象里面了,这时候,通过这可以直接访问所绑定的对象里面的其他属性,比如下面的一属性

　　 　　 　　var obj={ 　　答:1, 　　火:函数(){ 　　console.log (this.a) 　　} 　　} 　　obj.fire ();//输出1 　　
　　 　　

现在我们需要对平常司空见惯的的代码操作做一些更深的思考,首先,下面的这两段代码达到的效果是相同的:

　　 　　//我是第一段代码 　　函数火(){ 　　console.log (this.a) 　　} 　　var obj={ 　　答:1, 　　火:火 　　} 　　obj.fire ();//输出1//我是第二段代码 　　var obj={ 　　答:1, 　　火:函数(){ 　　console.log (this.a) 　　} 　　} 　　obj.fire ();//输出1 　　 　　

火函数并不会因为它被定义在obj对象的内部和外部而有任何区别,也就是说在上述隐式绑定的两种形式下,消防通过这还是可以访问到obj内的一个属性,这告诉我们:,
　　

　　

1只;这是动态绑定的,或者说是在代码运行期绑定而不是在书写期

　　

2只;函数于对象的独立性,这的传递丢失问题,
　　

　　

(下面的描述可能带有个人的情感倾向而显得不太严谨,但这是因为我希望阅读者尽可能地理解我想表达的意思)

JavaScript函数中的这四种绑定形式