zoukankan      html  css  js  c++  java
  • js中this的指向

    在js中this的指向对于新手来说一定是个难题,但是如果你真正理解了的话,也就没什么问题啦,下面就来讲讲this吧。

    JS中,this的值取决于调用的模式(调用对象),而JS中共有4种调用模式:

    1.函数调用模式

    当一个函数不是一个对象的属性时,当作函数俩调用,这时函数内的this指向全局对象(大对数情况下是window)

    window.value=1;
    function getValue(){
     console.log(this.value);
    }
    getValue();//输出1,此时的this指向window

    2.方法调用模式

    当一个函数是一个对象的属性时,我们称它为该对象的一个方法,当一个方法被调用时,this指向该对象

    var Obj={
        value:2,
        getValue:function(){
                  console.log(this.value);//输出2,this指向Obj
        }      
    }        

    !!!该模式中,this到对象的绑定发生在方法被调用时

    3.构造器调用模式

    使用new调用的函数称为构造器函数,此时的this指向该构造器函数实例出来的对象

    function main(val){
        this.value=val;
    }
    main.prototype.getValue=function(){
        console.log(this.value);
    }
    
    var fun=new main(3);
    fun.getValue();
    fun.value;//输出3,this指向main的实例对象fun

    4.apply/call调用模式以及bind

    apply、call、bind方法可以让我们设定调用者中的this指向谁

    function showValue(){
        console.log(this.value);
    }
    var obj={
        value:4
    }
    showValue.call(obj)//输出4,this指向了obj对象

    ECMA5中新增了bind方法,具体用法可以google一下,这里是演示this绑定的用法

    function showValue(){
        console.log(this.value);
    }
    var obj={
        value:4
    }
    var showValue2=showValue.bind(obj);
    showValue2()//输出4,this指向了obj对象

    bind有很多种用法,可以自己去查阅一下哦

  • 相关阅读:
    mybatis2入门程序
    mybatis1
    mybeats与jdbc问题分析
    mysqljdbc简单连接释放
    jdbc问题记录
    section,article,div
    HB调试前端开发移动
    HTML,XML,XHTML
    访问地图
    OAuth
  • 原文地址:https://www.cnblogs.com/jesse007/p/5629335.html
Copyright © 2011-2022 走看看