0x00:js中this的四种调用模式

1,方法调用模式

2,函数调用模式

3,构造器调用模式

4,apply、call、bind调用模式

0x01:第一种:方法调用模式 (也就是用.调用的)this就是这个对象本身 

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

  1. var myObject = {
  2.    value:;
  3.    increment:function(inc){
  4.        this.value + = typeof inc === 'number'?inc:;
  5.    }
  6. }
  7. myObject.increment();
  8. document.writeln(myObject.value);//1
  9. myObject.increment();
  10. document.writen(myObject.value;)
方法可以使用this去访问对象,所以它能从对象中取得或修改该对象,this到对象的绑定发生在调用它的时候,这个超级“迟绑定”(very later binding)使用函数可以对this高度复用,通过this可取得它们所属对象的上下文的方法称为公共方法。  

0x02:第二种:函数调用模式 

当函数并非一个对象的属性时,那么它被当做一个函数来调用:

  1. var sum = add(,);
当函数以些模式调用时,this被绑定到全局对象,这是语言设计上的一个错误,如果语言设计正确,当内部函数被调用时,this应该仍然绑定到外部函数的this对象,这个错误设计的后果就是方法不能利用内部函数来帮助它工作,因为内部函数的this被绑定了错误的值,所以不能共享该方法对对象的访问权,有一个很容易的解决办法如果该方法定义一个变量并给它赋值为this,那么内部函数就可以通过这个变量来访问到this
  1. //给myObject增加一个double方法
  2. myObject.double = function(){
  3.    that = this;
  4.    var helper = function(){
  5.        that.value = add(that.value,that.value);
  6.    }
  7.    helper();以函数的形式来调用helper
  8. }
  9. //以方法的形式来调用double
  10. myObject.double();
  11. document.wtiten(myObject.getValue());//6

0x03:第三种:构造函数调用模式

  1. var Class = function(){
  2.    this.value = ;
  3. }
  4. var class = new Class();
  5. console.log(class.value); //100

我们通过new关键字来调用构造函数,此时this会绑定在该新对象上(也就是这个实例对象上)

0x04:第四种:apply和call以及bind的调用模式:指定绑定对象 

  1. var myObject = {value:};
  2. var foo = function(){
  3.    console.log(this);
  4. };
  5. foo(); //global
  6. foo.apply(myObject);//{value:100}
  7. foo.call(myObject);//{value:100}
  8. var newFoo = foo.bind(myObject);
  9. newFoo(); //{value:100}

apply()方法接受两个参数第一个是函数运行时的作用域,另一个是参数的数组(arguments)

call()方法第一个参数与apply是一样的,第二个参数需要一个个列举出来

call方法更接近我们平时调用函数,而apply需要我们传递 Array形式的数组做为参数,它们是可以相互转换的

js中this的四种使用方法的更多相关文章

  1. 【温故知新】——原生js中常用的四种循环方式

    一.引言 本文主要是利用一个例子,讲一下原生js中常用的四种循环方式的使用与区别: 实现效果: 在网页中弹出框输入0   网页输出“欢迎下次光临” 在网页中弹出框输入1   网页输出“查询中……” 在 ...

  2. JS 中深拷贝的几种实现方法

    JS 中深拷贝的几种实现方法1.使用递归的方式实现深拷贝 //使用递归的方式实现数组.对象的深拷贝 function deepClone1(obj) { //判断拷贝的要进行深拷贝的是数组还是对象,是 ...

  3. stl中map的四种插入方法总结

    stl中map的四种插入方法总结方法一:pair例:map<int, string> mp;mp.insert(pair<int,string>(1,"aaaaa&q ...

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

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

  5. JS中常见的几种继承方法

    1.原型链继承 // 1.原型链继承 /* 缺点:所有属性被共享,而且不能传递参数 */ function Person(name,age){ this.name = name this.age = ...

  6. js中index()的四种经典用法(转https://blog.csdn.net/superit401/article/details/51726826)

    <!doctype html><html lang="en"> <head> <meta charset="UTF-8" ...

  7. js中index()的四种经典用法111

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. JS中this的四种用法

    1.在一般函数方法中使用 this 指代全局对象 2.作为对象方法调用,this 指代上级对象 3.作为构造函数调用,this 指代new 出的对象 4.apply 调用 ,apply方法作用是改变函 ...

  9. JS中 this 的四种用法

    1.在一般函数中使用 this 指全局对象 window function fn(){ this.x = 1 } fn(); //相当于window.fn() 2.作为对象方法使用 this 指该对象 ...

随机推荐

  1. 兼容所有浏览器的CSS3圆角

    兼容所有浏览器的CSS3圆角      解决CSS3圆角兼容所有浏览器的方法.本文提到了一种很不错的实现跨浏览器圆角的解决方案,但是说的不够全面,前端观察最近将整理更多更全面的资源给大家,敬请期待. ...

  2. org.jawin.COMException: 8000ffff: Invalid ptr null flag(原址:http://osdir.com/ml/windows.devel.jawin/2006-01/msg00013.html)

    I now realise my arguments to invoke should be more along the lines of byte[] result = tApp.invoke(& ...

  3. Programming C#.Classes and Objects.成员方法

    this关键字指向类的当前实例,this指针是类中所有非静态方法的隐藏指针,每个方法都能通过this指针指向对象的其他方法和成员变量. 因为对一个类来说,它的成员函数(方法)只有一份,所有的实例对象共 ...

  4. QF——iOS通知中心(NotificationCener)

    前面我们讲iOS不同界面间传值的时候,说过可以通过通知中心进行传值.那到底什么是通知中心,他是如何实现传值的呢? NSNotificationCenter是单例的,只提供了一个唯一的实例化入口,在整个 ...

  5. javascript自定义日期函数

    1.格式化日期(YYYY-MM-DD) 代码: var DateFormat = function (date) { if (!(date instanceof Date)) { date = dat ...

  6. SQL Server FileStream优点与不足

    LOB优点: 1.保证大对象的事务一致性. 2.备份与还原包括大数据对象,可以对它进行时点恢复. 3.所有数据都可以使用一种存储与查询环境. LOB不足: 1.大型对象在缓存中占非常大的缓存区. 2. ...

  7. ArcEngine栅格和矢量渲染(含可视化颜色带)

    使用ArcEngine9.3开发的栅格和矢量的渲染. 开发环境:ArcEngine9.3,VS2008. 功能:栅格(拉伸和分级)和矢量(简单.唯一值.分级.比例)渲染. 开发界面如图所示. 图1 主 ...

  8. delphi高手突破学习笔记之面向对象类和对象的本质

    知识点1:堆和栈 每个应用程序可以获得的内存空间分为两种:堆(heap)和栈(stack). 堆又称为“自由存储区”,其中的内存空间的分配与释放是必须由程序员来控制的.例如,用GetMem函数获取了一 ...

  9. [原]基于CAS实现单点登录(SSO):cas client端的退出问题

    自从CAS 3.4就很好的支持了单点注销功能,配置也很简单. 之前版本因为在CAS服务器通过HttpClient发送消息时并未指定为POST方式,所以在CAS客户端的注销Filter中没有收到POST ...

  10. VS中C++代码折叠

    用VS编写C#时,可以用#region name和#endregion,将代码分段,这样可以将代码折叠起来,当类过大,方法过长时,这种方法可以提高阅读效率,是人看着更舒服. 对于C/C++语言,#re ...