概念:
this是运行环境下的一个系统变量, 由于this在不同的执行环境下有不同的值, 所以在使用this时,多加注意 (使用this之前,先打印)
1,在全局作用域下,this默认指向window(前端运行环境),{}(后端运行环境).
2,在事件函数中,this指向绑定事件的目标
3,在构造函数中,this指向构造函数将要创建的对象
4,在对象中,this指向对象本身
特殊情况:(1) 有函数嵌套时,内层的函数this不会继承外层函数的this的值,会被还原成window
如果像让内层函数的this和外层函数this统一指向, 内层函数请使用箭头函数(因为箭头函数没有自己的this,会在上下文查找
(2)在ajax回调函数中, this指向window
 
修改this指向
修改this指向:   三种方法    call   apply    bind
 
function add(a, b) {
            console.log(8, this, a + b)
        }
        add(3, 4)
1, 通过call函数修改this指向, 用函数直接调用call(),
第一个参数是this修改后的指向(支持引用类型,如果传入值类型会自动装箱),
后边的参数是函数add的原始参数, 调用call时会直接执行add函数。
  add.call("李四", 5, 6)
 
2,通过apply函数修改this指向, 用函数直接调用apply(),
第一个参数是this修改后的指向(支持引用类型,如果传入值类型会自动装箱),
后边的参数是函数add的原始参数所在的数组,
调用apply时会直接执行add函数
  add.apply(false, [5, 6])
 
3,通过bind函数修改this指向,用函数不会直接调用bind(),
第一个参数是this修改后的指向(支持引用类型,如果传入值类型会自动装箱),
后边的参数是函数add的原始参数, 调用bind时不会直接执行add函数
  var obj = { name: "思聪", age: 10 }
      调用bind后会返回一个新的函数
   var newAdd = add.bind(obj, 5, 6)
      调用新的函数得到修改后的this
   newAdd()
 
3,call和apply和bind的异同点:
            (一), call和apply 修改this指向时会立即调用函数, bind修改指向不会立即调用函数会, 返回一个新函数
            (二), call,bind的第二个参数是函数的原始参数写法, apply的第二个参数必须是数组, 数组中放的是原始参数
 4,使用场景:
        (一), call 适合在调用函数时修改this指向, 直接使用call或apply修改即可
            (二), bind 适合在修改this指向时, 不立即调用函数, 而是时机成熟时在调用的情况,  如: 计时器, ajax请求等异步回调函数的修改

注意:事件函数修改this时,一定要用bind

btn6.onclick = function () {
            console.log(9, this)
        }.bind(document.body)
 
 
 

this的指向问题及改变this指向的更多相关文章

  1. JS中this指向问题和改变this指向

    首先必须要说的是,this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上this的最终指向的是那个调用它的对象(这句话有些问题,后面会解释为什么会有问题,虽然 ...

  2. Javasript中this指向问题和改变this指向的方法

    在学习javascript中我们往往会被this的指向问题弄的头昏转向,今天我们就来学习一下this的指向问题,和改变this指向的方法. 一.this的指向问题 在学习this的指向问题之前我们需要 ...

  3. 可以改变this指向的方法

    this一般指向的是当前被调用者,但也可以通过其它方式来改变它的指向,下面将介绍三种方式: 1.call用作继承时: function Parent(age){ this.name=['mike',' ...

  4. call()与apply() 改变this指向

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 15.0px Consolas; color: #a5b2b9 } span.Apple-tab-span ...

  5. this指向及改变this指向的方法

    一.函数的调用方式决定了 this 的指向不同,但总的原则,this指的是调用函数的那个对象: 1.普通函数调用,此时 this 指向 全局对象window function fn() { conso ...

  6. 改变this指向的三种方法

    call.apply.bind三者为改变this指向的方法. 共同点:第一个参数都为改变this的指针.若第一参数为null/undefined,this默认指向window call(无数个参数) ...

  7. js中改变this指向的call、apply、bind 方法使用

    前言: 由于js 中this的指向受函数运行环境的影响,指向经常改变,使得开发变得困难和模糊,所以在封装sdk,写一些复杂函数的时候经常会用到this 指向绑定,以避免出现不必要的问题,call.ap ...

  8. $.on()方法和addEventListener改变this指向

    jQuery $.on()方法和addEventListener改变this指向 标签(空格分隔): jQuery JavaScript jQuery $.on() jq的绑定事件使用$([selec ...

  9. (三十七)js改变this指向的方法

    最近又遇到了JacvaScript中的call()方法和apply()方法,而在某些时候这两个方法还确实是十分重要的,那么就让我总结这两个方法的使用和区别吧. 1.改变函数内部的this指向的三种方法 ...

随机推荐

  1. Python之GUI用户界面Tkinter(一)

    Label Label(标签)组件用于在屏幕上显示文本或图像,仅能显示单一字体的文本 •参数 Label(master=None, **options) (class)**options 组件选项,下 ...

  2. pygame坦克大战前夕

    最近想自己写pygame版的坦克大战,今晚已经完成如下功能: 1,我方坦克,可手动移动:敌方坦克,自动转方向与移动 2,坦克颜色随机,坦克形态大小可调. 3,双方坦克速度可调. 4,刷新坦克的位置随机 ...

  3. Redis安装、说明、Python中使用

    Redis安装与简单使用 Redis说明 redis是完全开源免费的,遵守BSD协议,是一个高性能的key-value数据库 redis特点 Redis 支持数据的持久化,可以将内存中的数据保存在磁盘 ...

  4. 西门子S7-1200PLC不让下载一直报“模块具有激活的测试和调试功能,防止下载到设备”解决方法

    错误如图 这是因为PLC被强制了,导致下载会报这类错误.取消强制就可以下载. 或者将cpu重置为出厂设置,也能再次下载. 参考:https://www.ad.siemens.com.cn/servic ...

  5. Spring Boot 传参 序列化和反序列化

    序列化 反序列化

  6. String s = new String("xyz");创建了几个字符串对象?

    两个对象,一个是静态区的"xyz",一个是用new创建在堆上的对象.

  7. jpa CriteriaQueryNo explicit selection and an implicit one could not be determined

    java.lang.IllegalArgumentException: Error occurred validating the Criteria ... Caused by: java.lang. ...

  8. 什么是 Spring 引导的执行器?

    Spring Boot 执行程序提供了 restful Web 服务,以访问生产环境中运行应用程序 的当前状态.在执行器的帮助下,您可以检查各种指标并监控您的应用程序.

  9. Flask-Script使用教程

    Flask使用第三方脚本 一个干净的项目准备: 一个干净的Flask项目连接地址: https://pan.baidu.com/s/123TyVXOFvh5P7V8MbyMfDg 话不多说,上菜: 1 ...

  10. python中模块制作、发布、安装

    模块的发布 需要在当前目录下 模块的安装 真实制作发布一个包 包的制作 (1)将写好的包放在moudelTest目录下 (2)moudelTest目录下创建一个setup.py文件(格式上面有介绍) ...