【JS / TS】函数 this 丢失问题

今天在写一个显示当前时间的网页，用了一个回调，来每秒更新时间。
但是实际运行时，时间并没有动态更新。

原因

仔细查了一下，原来是 Javascript 函数的 this 是在调用函数时确定的。

foo.call(this,args...);

观察一下函数的call函数的签名，可以发现第一个参数传入了 this 的值，函数运行时的 this 就是调用时传入的 this。
而回调函数被执行时，this已经不是我们原来预想的this了，所以变量没有被更改。

解决

那么如果要用回调函数，使用原来的this，该怎么办呢？
函数里提供了bind函数，可以用来内定函数调用时this的值和参数。

foo.bind(this,args...);

而在bind时写的参数，在执行时就会被插入到参数列表的最前面，可以用来内定前几个参数的值。
调用了bind之后，返回的是一个新的函数，它的this和前几个参数已经被内定死了。
之后函数被调用时无论传入的this是什么，实际执行时的this始终都是bind时内定好的this。