this指向问题绝对可以排js 的top 5最难和最重点的问题,初学者常常搞不清楚this指向哪里,特别是学过java和c#的人,想当年俺也迷糊了好久,直到遇到蝴蝶书,主要是因为js和主流的面向对象语言java,c#都不同(相似的问题还有new 操作符的问题,

关于new 构构器函数的原理,参见这篇文章:

http://www.cnblogs.com/windyfancy/p/5167266.html

),this并不指向当前对象,这是理解this的关键所在,this的指向取决于你是采用何种方式调用this所在的这个函数的,其实也只有四种调用模式,搞清楚了就以不变应万变。蝴蝶书(javascript语言精髓)里总结的最清楚,在javascript中一共有四种调用模式:方法调用模式,函数调用模式,构造器调用模式,apply/call调用模式。这些模式在如何初始化关键参数this上存在差异。

1   .方法调用模式(对象名.方法名(),或对象名[“方法名”]())

当一个函数被保存为对象的一个属性时,我们称它为一个方法。当一个方法被调用时,this被绑定到该对象。如果一个调用表达式包含一个属性存取表达式(即一个.点表达式或者[subscript]下标表达式),那么它被当做一个方法来调用

var myObject = {

value :0,

increment:function (inc){

this.value += typeof inc ==='number' ? inc:1;

}

};

myObject.increment();

document.writeln(myObject.value);  //1

myObject.increment(2);

document.writeln(myObject.value);  //3

方法可以使用this去访问对象,所以它能从对象中取得或修改该对象。this到对象的绑定发生在调用的时候。这个“超级”迟绑定( very late binding)使得函数可以对this高度复用。通过this可取得它们所属对象的上下文的方法称为公共方法。

2 .函数调用模式

当一个函数并非一个对象的属性是,那么它被当做一个函数来调用:var sum = add(3,4); //sum的值为7,当函数以此模式调用时,this被绑定到全局对象window上。这是语言设计上的一个错误,倘若语言设计正确,当内部函数被调用时,this应该仍然绑定到外部函数的this变量。这个设计错误错误的后果是方法不能利用内部函数来帮助它工作,因为内部函数的this被绑定了错误的值,所以不能共享该方法对对象的访问权。幸运的是,可以利用闭包特性保存this到一个自定义变量:如果该方法定义一个变量并给他赋值为this,那么内部函数就可以通过那个变量访问到this。

//给myObject增加一个double方法

myObject.double = function(){

var self = this; //解决方案

var doubleFn = function(){

self.value = self.value*2;

};

doubleFn ();//以函数的形式调用

};

//以方法的形式调用double

myObject.double();

document.writeln(myObject.getValue()); //6

3 . 构造器函数调用模式

使用new 方式调用一个函数,那么这个函数被称之为构造器函数,这个构造器函数会创建出来一个新生的对象,这个新生对象的constructor指向这个构造器函数。

Function myFun(){

this.color=”red”;

}

var obj=new myFun();

console.log(obj.color); //red;

关于new 构构器函数的原理,参见这篇文章:

http://www.cnblogs.com/windyfancy/p/5167266.html

4  .apply/call 调用方式

apply调用方式最为强大,可以指定this为任意对象,call的功能和apply一样,只是接收的参数有区别。

var user={

name:'windy',

say:'hello,world'

}

var obj={

test:function(){

alert(this.name+':'+this.say);

}

}

obj.test.apply(user);

关于javascript中this 指向的4种调用模式的更多相关文章

  1. 从零开始学习前端JAVASCRIPT — JavaScript中this指向的四种情况

    JavaScript中this的四种情况(非严格模式) 1.当this所在函数是事件处理函数时,this指向事件源.2.当this所在函数是构造函数时,this指向new出来的对象.3.this所在函 ...

  2. 【转】JavaScript中的this关键字使用的四种调用模式

    http://blog.csdn.net/itpinpai/article/details/51004266 this关键字本意:这个.这里的意思.在JavaScript中是指每一个方法或函数都会有一 ...

  3. javascript中var let const三种变量声明方式

    javascript中var let const三种变量声明方式 1.var  ①var表示声明了一个变量,并且可以同时初始化该变量. ②使用var语句声明的变量的作用域是当前执行位置的上下文:一个函 ...

  4. javascript中函数的四种调用模式详解

    介绍函数四种调用模式前,我们先来了解一下函数和方法的概念,其实函数和方法本质是一样,就是称呼不一样而已.函数:如果一个函数与任何对象关系,就称该函数为函数.方法:如果一个函数作为一个对象属性存在,我们 ...

  5. javascript中实现继承的几种方式

    javascript中实现继承的几种方式 1.借用构造函数实现继承 function Parent1(){ this.name = "parent1" } function Chi ...

  6. js中this指向的三种情况

    js中this指向的几种情况一.全局作用域或者普通函数自执行中this指向全局对象window,普通函数的自执行会进行预编译,然后预编译this的指向是window //全局作用域 console.l ...

  7. JavaScript中数组去重的几种方法

    JavaScript中数组去重的几种方法 正常情况下,数据去重的工作一般都是由后端同事来完成的,但是前端也要掌握好处理数据的能力,万一去重的工作交给我们大前端处理,我们也不能怂呀.现在我总结了一些去重 ...

  8. js中this的四种调用模式

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  9. JavaScript高级之函数的四种调用形式

    主要内容 分析函数的四种调用形式 弄清楚函数中this的意义 明确构造函对象的过程 学会使用上下文调用函数 了解函数的调用过程有助于深入学习与分析JavaScript代码. 本文是JavaScript ...

随机推荐

  1. Ternsorflow 学习:006-MNIST进阶 深入MNIST

    前言 这篇文章适合实践过MNIST入门的人学习观看.没有看过MNIST基础的人请移步这里 深入MNIST TensorFlow是一个非常强大的用来做大规模数值计算的库.其所擅长的任务之一就是实现以及训 ...

  2. Python实现的远程登录windows系统功能示例

    https://www.jb51.net/article/142326.htm 重点是这几本书要好好读读!: 更多关于Python相关内容感兴趣的读者可查看本站专题:<Python进程与线程操作 ...

  3. 第四张5G牌照发给广电,能打破三大运营商的垄断吗?

    近段时间,多个国家处于莫须有的安全性考虑,禁止华为参与核心5G网络设备竞标.其实这就从侧面反映出,国内民族企业在5G层面的领先性.当然,这也让我们认知到,5G网络将是新时代的竞争关键节点.为此,国内正 ...

  4. node - multer 加图片后缀

    var multer = require('multer') var storage = multer.diskStorage({   destination: function (req, file ...

  5. Java基础学习总结(一)——Java开发学习介绍

    Java平台: 1.J2SE java开发平台标准版 2.J2EE java开发费平台企业版 Java程序需要在虚拟机上才可以运行,换言之只要有虚拟机的系统都可以运行java程序.不同的系统上要安装对 ...

  6. Service总结

    Service Service的应用场景,以及和Thread区别 开启Service的两种方式以及区别 Service基础 Service是什么? Service(服务)是一个可以在后台长时间运行而没 ...

  7. netty权威指南学习笔记八——编解码技术之JBoss Marshalling

    JBoss Marshalling 是一个java序列化包,对JDK默认的序列化框架进行了优化,但又保持跟java.io.Serializable接口的兼容,同时增加了一些可调参数和附加特性,这些参数 ...

  8. .Net 笔记

    1.介绍 .net一般指.Net Framework框架.一种平台,一种技术. C#是一种编程语言,可以开发基于.net平台的应用. .Net Framework是框架是.Net平台不可缺少的一部分, ...

  9. ROS大型工程学习(二) 怎么阅读大型工程

    基本思路是由点到面,由浅到深. 1.首先从launch文件入手. 文件中会看到比如: <node ns="> <rosparam command="load&qu ...

  10. JS高级学习笔记(1)- 数据类型及转换规则

    必读: Javascript对象Oject的强制类型转换 JavaScript筑基篇(二)->JavaScript数据类型 聊一聊valueOf和toString 深入理解JavaScript系 ...