容易忽略的this - bug
1、 this 作为参数 或 this.val 作为参数的时候
初始化时: var _scope = this;
虽然在最开始初始化的时候, this === _scope, 所以效果一样。
但是当this 或 this.val 作为参数或间接参数被传入到函数中时,就会出现this值动态改变的问题,从而导致this.val 为undefiend的情况。
常常出现的情况:
回调函数内的this,或者说实质上就是该函数被调用的父对象会改变。这时候该函数内的this值就会改变。
解决方法:
方法一:
()=>{} 箭头函数, 其实质是 从es6 的箭头函数转为 es5 的 语法时候, 箭头函数内的this,都是外部的_this。
JavaScript es6 和 es5 语法转化的网站:https://babeljs.io/
方法二:
同理,对于传递给函数的参数时,不能用 fun(this.val) ,
可以用 var a = this.val; fun(a) 的形式。 或 var _scope = this, fun(_scope.val) 。
理由: this.val 会被整体作为参数传给函数,等价于函数内含有this 这个东西。 而一但在var a = this.val ,fun(a)的时候,a 就是之前初始化时this.val的地址(引用) ,之后this改变了,但a依旧时那个地址。
这次的bug:
因为
cesium 中的requestAnimationFrame()中会调用到这个函数,从而出现 this.val值为undifined的报错。