近日阅读《javascript设计模式与开发实践》

书中的apply和call调用函数层出不穷,很多妙用;

函数中的this是根据调用方式来决定的

函数调用方式有4中
1、直接调用 a(...arg); 函数a中的this总是绑定的window /严格模式下绑定的undefined
2、方法调用 a.b(...arg); 方法函数b会返回当前执行上下文的对象a;如果a.b.c(); 那么此时返回的就是b
3、构造器调用 new a(...arg);构造器不会引用任何上下文的内容,只是单纯的根据自己生成一个对象并且返回;
4、使用call/apply调用 a.call(this,...arg);

function add(){
this.a = "add-a";
console.log(this)
}
add();
//控制台:window;
//数据改变:此时会多一个全局变量a;window.a="add-a"; var obj = {
a:1,
b:{
a:2,
c:add
}
}
obj.b.c();
//控制台:obj.b指向的对象 {a:"add-a",c:function add()...}
//数据改变:直接调用类似,add会改变上下文的属性值;obj.b.a==="add-a" new obj.b.c();
//控制台:通过构造器调用,不会改变obj.b.a;所以此时obj.b.a依然等于"add-a"
//数据改变:无 obj.b.c.call();
//控制台:window;
//数据改变:window.a的值会重新被赋值"add-a"
//不传入参数或者传入undefined、null时,add中的this就会是全局对象
//否则传入什么对象、运行时的this就是传入的对象
//注意:这里其他的数据类型 String Number Boolean Object也会当做一个对象进行处理
//例如:
obj.b.c.call(1);
//控制台: Number {a: "add-a", [[PrimitiveValue]]: 1}
obj.b.c.call(false);
//控制台:Boolean {a: "add-a", [[PrimitiveValue]]: false}

彻底搞清函数中的this指向的更多相关文章

  1. JS回调函数中的this指向(详细)

    首先先说下正常的this指向问题 什么是this:自动引用正在调用当前方法的.前的对象. this指向的三种情况 1. obj.fun()     fun中的this->obj,自动指向.前的对 ...

  2. Javascript回调函数中的this指向问题

    使用js中的定时器(setInterval,setTimeout),很容易会遇到this指向的问题. 直接上例子: 1 var name = 'my name is window'; 2 var ob ...

  3. React之函数中的this指向

    我们都知道在React中使用函数时,有两种写法,一是回调函数,二是直接调用,但需要在构造函数中绑定this,只有这样,函数中的this才指向本组件 总结一下没有绑定this的函数中的this指向 不管 ...

  4. 改变函数中的 this 指向——神奇的call,apply和bind及其应用

    在JavaScript 中,call.apply 和 bind 是 Function 对象自带的三个方法,这三个方法的主要作用是改变函数中的 this 指向,从而可以达到`接花移木`的效果.本文将对这 ...

  5. js闭包中的this(匿名函数中的this指向的是windows)

    js闭包中的this(匿名函数中的this指向的是windows) 一.总结 1.普通函数中的this指向的是对象,匿名函数中的this指向的是windows,和全局变量一样 2.让匿名函数中的thi ...

  6. JS的一些总结(函数声明和函数表达式的区别,函数中的this指向的问题,函数不同的调用方式,函数也是对象,数组中的函数调用)

    一.函数声明和函数表达式的区别: 函数声明放在if——else语句中,在IE8中会出现问题 函数表达式则不会 <script> if(true){ function f1(){ conso ...

  7. 普通函数跟箭头函数中this的指向问题

    箭头函数和普通函数的区别如下. 普通函数:根据调用我的人(谁调用我,我的this就指向谁) 箭头函数:根据所在的环境(我再哪个环境中,this就指向谁) 一针见血式总结: 普通函数中的this: 1. ...

  8. 箭头函数,闭包函数中的this指向

    在javscript中,this 是在函数运行时自动生成的一个内部指针,它指向函数的调用者. 箭头函数有些不同,它的this是继承而来, 默认指向在定义它时所处的对象(宿主对象),而不是执行时的对象. ...

  9. 函数中this的指向

    每个函数在被调用时都会自动取得两个特殊变量:this和arguments:内部函数在搜索这两个变量时,只会搜索到其活动对象为止,因此永远不可能直接访问外部函数中的这两个变量. f 1 var name ...

随机推荐

  1. 推荐virtualBox虚拟机及安装使用的注意事项

    推荐选择virtualBox虚拟机 选择vbox是因为,本人觉得使用起来比VMware要方便. 简要说明: 本人自学前端开发,对于linux了解很少,直接上手真实的linux环境会很不适应,所以选择了 ...

  2. 【转】如何实现Flex页面跳转

    其实对于这个题目是不恰当的,因为flex中是没有页面这个概念的,页面在flex里面其实就是一个个的Canvas,vbox,hbox等等之类的东西,看到的不同页面的切换,就是这些元素一层层的堆积,或者替 ...

  3. 早期练手:功能相对比较完善的 js 计算器

    第一次发博客,就先发一个自己早期,刚开始学前端时,用js写的一个计算器吧,计算功能比较少,只有 + - * / ,不过其他功能还是比较完善的,比如: 输出结果后,连续按"=",可以 ...

  4. (转)Java并发编程:并发容器之CopyOnWriteArrayList

    原文链接:http://ifeve.com/java-copy-on-write/ Copy-On-Write简称COW,是一种用于程序设计中的优化策略.其基本思路是,从一开始大家都在共享同一个内容, ...

  5. IONIC2新建项目并添加导航

    一.   基础搭建 1.      新建IONIC2项目 ionic start myApp tabs --v2 不加--v2会新建ionic1的项目 2.      运行项目 cd myApp io ...

  6. Selenium Grid2

    简介 使用selenium-grid可以远程执行测试的代码,核心步骤:grid --> server-->chromedriver驱动 -->chrome浏览器 利用Selenium ...

  7. Yii2发送邮件

    1.在配置文件main-local.php components=>[]里面配置 'mailer' => [ 'class' => 'yii\swiftmailer\Mailer', ...

  8. java复习(2)---java基础杂记

    java命名规范: 参考:http://www.cnblogs.com/maowang1991/archive/2013/06/29/3162366.html 1.项目名小写 2.包名小写 3.类名每 ...

  9. & and &&区别

    &:位逻辑运算: &&:逻辑运算: &&在java中又称为短路,第一个条件是false的话后面就不执行: &是所有条件都执行: System.out.p ...

  10. __read_mostly变量含义

     1. 定义 __read_mostly原语将定义的变量为存放在.data.read_mostly段中,原型在include/asm/cache.h 中定义: #define __read_mos ...