jQuery 1.9.1动画缓动核心：Tween函数详解

在jQuery 1.9.1的源码分析中，我们深入探讨了动画处理的核心部分——缓动动画的创建。动画是通过`Animation`内部的`createTweens()`函数实现的，该函数负责根据传入的`props`参数构建一系列的原子动画。这些原子动画由`tweeners["*"]`数组中的函数逐个处理，实际上数组中只包含一个元素。 `createTweens()`函数通过`jQuery.each()`方法遍历`props`对象，对每个属性执行操作。数组中的每个元素（这里称为`tweener`）实际上是回调函数，它会根据给定的`prop`和`value`值来决定是否应为该属性创建动画。如果`tweener`函数返回`true`，则表示对当前属性的处理结束。 核心的`tweener`函数，即`tweeners["*"][0]`，在这个过程中起到了关键作用。它首先解析CSS属性值，如`rfxnum.exec(value)`用于获取动画的起始值、结束值以及可能的单位。对于非像素单位，函数会进行单位转换，并设置迭代次数（默认为20次）。在每次迭代中，函数会计算并应用缩放因子（scale），确保动画的平滑过渡。 在处理过程中，函数还会检查起始值是否为0，如果是，则会将初始步长翻倍，直至找到一个非零起点，以避免动画一开始就过于突兀。这个机制保证了缓动动画在非零起点上的连续性。 jQuery 1.9.1的动画处理机制通过精心设计的`createTweens()`函数，结合`tweeners["*"]`数组中的自定义回调函数，实现了对不同属性的细致动画控制，确保了动画的平滑度和性能。理解这些源码细节对于开发者来说，能够帮助优化动画效果，提升用户体验。