setTimeout传递对象参数问题

Question

使用vue，SelectItem是绑定的click事件的处理函数，获取当前点击的事件对象e，然后传到setTimeout里给doSomeThing去使用，但是doSomeThing拿到e后输出的e.currentTarget却是null。于是我在SelectItem里console.log了一下，在传入定时器前，target1能够输出正确的currentTarget，但在定时器里面，target2输出为null。如果我先在外面用一个变量保存e.currentTarget，然后在定时器里面输出这个变量却可以了。请问这是为什么？SelectItem: function(e){    e.stopPropagation();    clearTimeout(this.timer);    var _this = this;    //var target = e.currentTarget;    console.log("target1: ", e.currentTarget);    //console.log("target1: ", target);    this.timer = setTimeout(function(){        console.log("target2: ", e.currentTarget);        //console.log("target2: ", target);        _this.someData = _this.doSomeThing(e);    }, 300);}此外我试了两种方法传递e，一种是在毫秒数后面写参数，即：this.timer = setTimeout(function(){    //_this.doSomeThing(e);}, 300, e);另一种是用一个函数把doSomeThing包起来，在setTimeout里调用这个函数：this.timer = setTimeout(function(){    this.foo(e);}, 300);foo: function(e){    this.doSomeThing(e);}两种方法都不行。

Answer 1

要分清楚e和e.currentTarget的区别。

e是对象事件的属性的引用，它有一个叫currentTarget的值，结构大概如下：

e = {

    currentTarget: "A"

}

你把e传到函数里，相当于把引用传进去，但是e.currentTarget在后面时刻是会被重置的。过程和下面类似

var newE = e

console.log(newE.currentTarget)//有值

e.currentTarget = null // 重置，引用指向改变，但不会改变原来e.currentTarget指向的对像的值

console.log(newE.currentTarget)//null

而你直接保存e.currentTarget当然是有值的。

Answer 2

楼上兄弟回答基本上正确。

当你在的setTimeout里的函数执行的时候已经进入了下一个的事件循环“tick”中，e.currentTarget被置为了null。