zoukankan      html  css  js  c++  java
  • 教你彻底弄懂JS中this的指向

    JS 中 this 机制

    • this 是什么
    • 调用的方法

    this 是什么

    理解this之前, 先纠正一个观点,this 既不指向函数自身,也不指函数的词法作用域。如果仅通过this的英文解释,太容易产生误导了。它实际是在函数被调用时才发生的绑定,也就是说this具体指向什么,取决于你是怎么调用的函数。也就是说谁调用的this,this就指向谁

    1.纯粹的函数调用

    这是函数的最通常用法,属于全局性调用,因此this就代表全局对象。请看下面这段代码,它的运行结果是1。

    来看这段代码:

    
    
           var a = 2; 

    function fun() {
                }       
          console.log( this.a );
               fun(); 

    此时的打印结果是2

    因为fun()是直接调用的(独立函数调用),没有应用其他的绑定规则,这里进行了默认绑定,将全局对象绑定this上,所以this.a 就解析成了全局变量中的a,即2。此时的this相当于Window

    2.作为对象方法的调用

    函数还可以作为某个对象的方法调用,这时this就指这个上级对象。

    function test() {
      console.log(this.x);
    }
    
    var obj = {};
    obj.x = 1;
    obj.m = test;
    
    obj.m(); 

    此时打印结果为1;this相当于obj对象

    3.作为构造函数调用

    所谓构造函数,就是通过这个函数,可以生成一个新对象。这时,this就指这个新对象。

    function test() {
     this.x = 1;
    }
    
    var obj = new test();

    4.call/apply 改变this的指向

     function Person(name,age){
                this.name = name;
                this.age = age
            }
            var person=new Person("xu",18);
            var obj = {}
            Person.call(obj,"liu",20)

    通过在控制台打印我们可以看出,this现在指的是obj对象,所以说call可以改变this的指向

    call与apply的不同在于传值时是以数组的方式

    Person.apply(obj,["liu",20] )

  • 相关阅读:
    JavaScrip中构造函数、prototype原型对象、实例对象三者之间的关系
    (字符缓冲流)文本排序案例
    Annotation注解的应用(打印异常信息)
    Annotation(注解)
    Java关键技术强化
    基本数据类型与引用数据类型的区别
    EKT反射
    bootstrap的概念
    Servlet强化
    java数据库连接池
  • 原文地址:https://www.cnblogs.com/xuhanghang/p/10155410.html
Copyright © 2011-2022 走看看