GSAP - GSAP属性：gsap.utils

1.类型：Object

gsap.utils提供了对一些非常有用的实用程序函数的访问。注意，它们中的许多可以选择返回函数，以便可以直接插入到补间中，利用GSAP基于函数的功能。在这种情况下，它们将为每个目标调用一次，而不是对所有目标都使用相同的结束值。

2.方法集合

checkPrefix()：在必要时为所提供的CSS属性添加前缀(例如:checkPrefix("transform")——> "msTransform"当在IE9中运行时;如果根本不支持该属性则返回null)。

clamp()：钳制一个值以适应特定的范围(例如:clamp(0,100， -12)——> 0)。

distribute()：线性或根据对象在网格中的位置在对象数组中分配值，可选地应用了easing。

getUnit()：获取字符串的单位(例如:getUnit("30px")——> "px")。

interpolate()：在几乎任何两个值(数字，颜色，字符串，数组，复杂字符串，甚至具有多个属性的对象)之间进行插值(例如:Interpolate ("red"， "blue"， 0.5)——> "rgba(128,0,128,1)")。

mapRange()：将一个范围映射到另一个范围(例如:mapRange(-10,10,0,100,5)——> 75)。

normalize()：将范围内的数字映射到0到1之间的进度(例如:normalize(100,200,150)—> 0.5)。

pipe()：对多个函数调用进行排序，将每个函数调用的结果传递给下一个函数(例如:pipe(clamp(0,100)， snap(5))(8)——> 10)。

random()：根据参数生成随机数(例如:random(0,100,5)—> 65)或从提供的数组中随机选择一个元素(例如:random(["red"， "green"， "blue"])—> "red")。

selector()：返回一个范围为特定元素(或React ref或Angular ElementRef)的选择器函数。(例:选择器(myElement))

shuffle()：原地打乱数组的内容。(例:shuffle([1、2、3、4、5))- >(4、2、1、5、3))

snap()：将一个值固定到一个增量中(例如:Snap(5,13)——> 15)或数组中最接近的值(例如:Snap([0,5,10]， 7)——> 5)。

splitColor()：将任何颜色拆分为红色、绿色、蓝色(可选的alpha)组件。或者色相、饱和度和亮度。(例如:splitColor("red")——>[255,0,0])。

toArray()：将几乎所有类似数组的对象转换为数组，包括选择器文本!(例如:toArray(".class")——> [element1, element2])。

unitize()：包裹着另一个实用函数，允许它接受一个值，单位为例如“"20px”或者“50%”，去掉单位时，传送到包装实用功能，然后把它加回到结果中（例如：var wrap = gsap.utils.unitize( gsap.utils.wrap(0, 100) ); wrap("150px"); --> "50px"). 或者强制指定单位 (ex: unitize( gsap.utils.mapRange(-10, 10, 0, 100), "%"); --> 返回的结果总是带 "%"）

wrap()：将一个数字放入指定的范围内，当它超过最大值时，它会自动回换行到开始位置，如果小于最小值，则自动回换行到结束位置(例如wrap(5,10,12)—> 7)。或者在数组中循环，当提供的索引大于数组长度时，它会自动回换行到开始位置(例如:wrap([0,10,20]， 4)—> 10)。

wrapYoyo()：将一个数字放入一个指定的范围内，当它超过最大值时，它会绕回开始位置，如果它小于最小值，它会绕回结束位置(例如wrapYoyo(5,10,12)——> 8)。或者在一个数组中循环，当提供的索引大于数组长度时，它会绕回开始位置(例如:wrap([0,10,20,30]， 4)——> 20)

3.应用示例详解参考
示例详解