es6 解构赋值 使用方法的时候，会导致丢失this

Question

今天在使用es6 解构赋值 引入方法的时候，发现在方法里获取不到this，具体详情我贴图吧先贴代码：    /*mainVM文件里的方法*/    @observable planDetailList = [];    @action    ajaxPlanDetailList(id,callback){        Helper.ajax(Api.planList+'/'+id,{            method:'GET'        }).then(res => {            console.log(this);        })    }    /*在componentDidMount时调用mainVM里的方法*/    componentDidMount() {        const { ajaxPlanDetailList } = this.props.mainVM;        ajaxPlanDetailList(this.props.id);    }会显示以下错误换一种方式，直接调用mainVM里的方法，    componentDidMount() {        this.props.mainVM.ajaxPlanDetailList(this.props.id);    }拿到了this不是很懂其中的缘由，请大神详解，跪谢

Answer 1

两种思路
1 把ajaxPlanDetailList写成箭头函数
2 ajaxPlanDetailList绑定一下this 类似 ajaxPlanDetailList.bind(this)

Answer 2

你不解构赋值也会丢失，this上下文是谁调用它就是谁的，比如obj.ajaxPlanDetailList()，那this就是obj，你直接ajaxPlanDetailList()的话this就是全局对象window。

function fun() {

  console.log(this.a);

}

let obj1 = {

  a: 1,

  fun: fun

};

let obj2 = {

  a: 2,

  fun: fun

};

let a = 3;

obj1.fun();  // 1

obj2.fun();  // 2

fun();  // 3