记录下 typescript 中 使用 removeEventListener 时无法去除事件句柄，导致 removeEventListener 失效

之前在写utils的时候遇到个问题，在ts中定义一个类里面使用 addEventListener 添加事件句柄，但是 removeEventListener的时候失效了。无法移出事件句柄，所以记录下 解决办法

interface Position {x: number, y: number}
class Test {
	private position: Position = {x: 0, y: 0}
	constructor () {
		this._init()
	}
	// 初始化移动事件
	private _init () {
		// 鼠标按下的时候增加事件句柄
		document.addEventListener('mousedown', () => {
			document.addEventListener('mousemove', this._dragMoving.bind(this))
		})
		// 鼠标松开的时候移出事件句柄
		document.onmouseup = (ev: MouseEvent) => {
            document.removeEventListener('mousemove', this._dragMoving.bind(this))
        }
	}
	// 移动事件逻辑
	private _dragMoving (e: MouseEvent) {
		this.position.x = e.clientX
		this.position.y = e.clientY
	}
}

运行之后发现，鼠标按下之后，开始记录坐标，松开之后坐标还在继续记录。removeEventListener 失效了

解决办法～

// ...省略
	private _init () {
	
		// 将事件提取出来即可
		const _dragMoving = this._dragMoving.bind(this)
		
		// 鼠标按下的时候增加事件句柄
		document.addEventListener('mousedown', () => {
			document.addEventListener('mousemove', _dragMoving)
		})
		// 鼠标松开的时候移出事件句柄
		document.onmouseup = (ev: MouseEvent) => {
		          document.removeEventListener('mousemove', _dragMoving)
		      }
		}
// ...

我们需要在绑定事件之前将事件提取出来，如果需要使用 this，需要使用bind修改this指向