JS—-this指向

箭头函数中this对象就是定义时所在的作用域，也就是说箭头函数本身没有this，内部的this就是外层代码块作用域中的this。

1、独立函数

var a = 0var test = ()=> {
    var a = 1
    console.log(this.a)}test()  //0

该箭头函数在全局环境中定义，即this指向window

2、对象的方法

var a = 0var obj = {
    a: 1,
    foo: ()=> {
        console.log(this.a)
    }}obj.foo()  //0即：var a = 0var obj = new Objectobj.a = 1obj.foo = ()=> {
    console.log(this.a)}obj.foo()

如上所示，foo在全局中定义,所以this指向window，那么如何使this指向obj?

根据上一篇介绍，当函数作为对象的方法调用时this指向该对象，可以这样改写：

var a = 0function foo(){
    var func = () => {
        console.log(this.a)
    }
    return func}var obj = {
    a : 1,
    foo:foo}obj.foo()()  //1

func在foo调用时定义，此时的foo所在作用域为obj，因此this指向obj

3、构造函数,因箭头函数没有this,固不能用作构造函数，否则会报错

var foo = ()=> {
    console.log(this)}var boo = new foo()  //foo is not a constructor

4、bind/call

var a = 0var func = ()=> {
    console.log(this.a)}var obj = {
    a: 1}func.call(obj)  //0

如上：func定义在全局，因此打印0，同对象方法，我们可以通过如下改写，打印出1

var a = 0var func = function() {
    var boo = ()=> {
        console.log(this.a)
    }
    return boo}var obj = {
    a: 1}func.call(obj)() //1

优质内容筛选与推荐>>
1、sed 查找文件的某一行内容
2、大型网站技术架构（3）：WEB 前端性能优化
3、有道桌面程序
4、函数注意事项
5、【原】用css让一个容器水平垂直

0 │ 收藏 │ 举报

朋友将在看一看看到

分享想法到看一看