this指向问题(1)

在JS中,this一般有四种绑定的方式,但是在确定到底是哪种绑定之前必须先找到函数的调用位置。接下来先介绍其中的三种:

1、默认绑定

  其实所谓的默认绑定就是函数直接调用(前面没有什么东西来点它),在默认绑定的非严格模式中,this 指向 window 

function test(){
        console.log(a)  // 1
    }
var a = 1
test()

在这个地方可能会有人想问,如果是在另一个函数 foo 中调用函数 test 呢 ? 其实 this 指向的还是 window 。可以这样想  

test()=window.test()

2、隐士绑定

  故名思意“你没有看到在哪绑定的”,在这里要考虑的是调用的位置有没有上下文对象,或者是被对象包含之类的

function test(){
        console.log(this.a)
}
var obj = {
    a:1,
    text:test
}
test()  // undefined
obj.text()   // 1

在这个地方可能有人会想不通了。为什么 obj.text() 之后执行的确实函数 test ,其实在这个地方 属性 text 里面放的是函数 test 的引用。在这因为函数调用的上下文对象是 obj ,所以this 指向了 obj。如果有很多层引用,那么this 就是指向最后一个

var b = obj.text
var a = 2
b() // 2

在这个地方 b 其实是拿到了函数 test 的引用,所以还是遵循默认绑定。还有一个值得一提的地方是:向函数传递参数其实是一种隐形赋值,感兴趣的可以去试试

3、new 绑定

  说到 new 了解过 Java 的人应该都知道,但是 JS 中的 new 和 Java 中的不是一个东西。

new 的作用:

      1、构建一个全新的对象(注意是全新)

      2、新对象会绑定到函数调用的 this

      3、如果 new 的这个函数没有返回对象,那么new之后就会自动返回这个对象

        function test(a){
            console.log(this)   // test{}
            this.a=a
            console.log(this)   // test{a:2}

        }
        console.log(test) // f test(){}
        var b = new test(2)
        console.log(b.a)  //2

其实还可以在 test 函数里面返回一个对象,那样在 b 里面保存的就是这个返回对象

在这里涉及到了原型链就不讲了,等后面专门挑个时间好好写写原型链

其实关于 this 还有 call、apply、bind、箭头函数可写,但是在这就不写了。这个礼拜好好梳理一下这些东西,然后再分享出来,顺便会写到优先级的问题。

第一次写,不喜欢勿喷,如果有什么问题可以留言。我学JS是也从别人那学了很多东西,所以现在把我知道的分享出来,共同进步。2018年加油吧

 

posted @ 2018-01-01 17:05  大圆圈  阅读(166)  评论(0编辑  收藏  举报