js动画透明度Debug

项目场景：

js动画透明度

问题描述：

鼠标移动box区opacity向1渐变正常，鼠标移出box区发生闪烁现象。

当鼠标移入时，正常：

当鼠标移出时，闪烁bug：

以下是bug源码：

js:

  var box = document.querySelector('div');
            var timer;
            var timers;
            var num = 0.3;
            var num1 = 1;
            box.onmouseover = () => {
   
                clearInterval(timer);
                timer = setInterval(() => {
   
                    num += 0.1;
                    box.style.opacity = num;
                    if (num == 1) {
   
                        clearInterval(timer);