this

作者: 楼水流云 | 来源:发表于2019-10-07 20:58 被阅读0次

    全局this: 代表window
    var a = 1
    var b = 100
    console.log(this)
    console.log(this.b) 这里等于100


    function函数this: 也是代表window
    function fn1(){
    console.log(this)
    }
    fn1()


    内部函数this: 代表window 从外面的作用域找 找不到再从外面外面的作用域找
    function fn1(){
    function fn(){
    console.log(this)
    }
    fn()
    }
    fn1()


    dom元素 事件this:这个函数事件this 代表添加事件的元素 如p1 但 setTimeout和setInterval的this是指的全局对象
    p1.addEventListener('click',function(e){
    console.log(this)
    setTimeout(function(){
    console.log(this)
    },200)
    },false)


    构造函数this: 这个this指新对象 如p1
    function Person(name){
    this.name = name
    }

    Person.prototype.printName = function(){
    console.log(this.name)
    }

    var p1 = new Person('ruoyu')
    var p2 = new Person('fangfang')


    对象方法this: 这个this代表这个对象 如obj1 谁去.fn就是谁 如 obj1.obj2.fn() 指的是obj2
    var obj1 = {
    name: 'ruoyu',
    fn: function(){
    console.log(this)
    }
    }
    obj1.fn()


    bind函数对象this:得到一个新的函数 这个函数的this 是我传递的对象 如obj3 任何函数都有bind方法
    var fn3 = obj1.fn.bind(obj1)
    fn3()


    call函数对象this: this是传入的第一个参数对象 如obj4 和bind类似 结果是207
    var obj4 ={
    value: 200
    }
    function fn4(a,b){
    console.log(this.value + a + b)
    }
    fn4.call(obj4,3,4)


    apply函数对象this: this是传入的第一个参数对象 如obj4 后面的参数是对应的数组[] 结果也是207
    var obj4 ={
    value: 200
    }
    function fn4(a,b){
    console.log(this.value + a + b)
    }
    fn4.apply(obj4,[3,4])


    函数的执行环境 局部变量 实例变量 静态变量

    function ClassA(){
    var a = 1 //局部变量 只有函数内部可以访问
    this.b = 2 //实例变量 只有实例可以访问
    }

    ClassA.c = 3 //静态变量 直接类型对象能访问到的变量 也就是属性

    console.log(a) //结果 errer
    console.log(ClassA.b) //结果 undefined
    console.log(ClassA.c) //结果 3

    相关文章

      网友评论

          本文标题:this

          本文链接:https://www.haomeiwen.com/subject/xiqcpctx.html