请各位大佬帮小白看下（关于JS执行顺序问题。。。）

Question

（下面是实例网站）
https://plnkr.co/edit/Y4bQEBC...

1.点击第3个TD（图1）

2.打印的结果中为什么会有 '.edit-td'这个class呢？（图2）

html中没有这个class,只有在js中的 makeTdEditable，和finishTdEdit这两个函数才涉及到。

这样的话，只能说明刚一点击 第3个TD时，马上就执行了makeTdEditable，和finishTdEdit 中 某个函数。
之后，才走了 console.log(target); 这个语句。
跟函数提升有关系吗？

如果有的话，我又分别在 .onclick时间里，还是 makeTdEditable，和finishTdEdit函数里 分别打印了。
但打印的顺序，第一个先执行的却是 .onclick事件里的console.log内容。

请大神指教下。

谢谢。

Answer 1

第一点击执行了makeTdEditable，给td加上了edit class

至于为什么打印target的时候就看了这个class，是因为控制台打印出来的是对象的引用，实时变化的

你可以这样打印看一下区别

console.log(JSON.parse(JSON.stringify(event.target.classList)))
console.log(event.target.classList)

Answer 2

console.log 打印的是快照

---

和下面这个图的意思差不多。只是在显示的时候拿了一下快照。