看了jquery的animate动画函数，自己也用js写了一个，感觉还不错！

在JavaScript中实现类似jQuery的animate函数，你可以使用requestAnimationFrame来实现流畅的动画效果。以下是一个简单的实现例子：

function animate(element, to, duration, callback) {
  const start = performance.now();
  const from = Object.keys(to).reduce((acc, prop) => {
    acc[prop] = Number(element.style[prop] || 0); // 获取当前样式值
    return acc;
  }, {});
 
  const change = (time) => {
    if (time - start < duration) {
      const progress = (time - start) / duration;
      Object.keys(to).forEach(prop => {
        element.style[prop] = (to[prop] - from[prop]) * progress + from[prop] + 'px'; // 计算当前值
      });
      requestAnimationFrame(change); // 递归调用
    } else {
      Object.assign(element.style, to); // 动画结束，应用最终样式
      if (callback && typeof callback === 'function') callback(); // 调用回调函数
    }
  };
 
  requestAnimationFrame(change); // 开始动画
}
 
// 使用例子
const element = document.getElementById('myElement');
animate(element, { width: '200px', height: '100px' }, 1000, () => console.log('Animation completed'));

在这个例子中，animate函数接受四个参数：element是要应用动画的DOM元素，to是一个对象，包含了动画结束时想要设置的CSS样式属性和值，duration是动画持续的时间（单位是毫秒），callback是动画结束时调用的回调函数。函数内部使用requestAnimationFrame来实现每帧动画的更新，并在动画结束时应用最终的样式并调用回调函数。