GSAP内置了很多工具函数，方便在动画中使用。具体地址在
checkPrefix函数可以看做是检测当前浏览器都某个css属性的支持属性。会返回对应的原本的字符串，或者加了前缀的css属性字符串。如果浏览器不支持该属性则返回null
const a = gsap.utils.checkPrefix("a") //null
const b = gsap.utils.checkPrefix("transform") //transform
clamp函数可以判断一个数字是否在给定范围内。如果在就返回原数字，否则小于就返回最小值，大于就返回最大值。它既可以传入三个参数，分别是最小值，最大值和待检测值，也可以接收返回的函数延迟执行
const a = gsap.utils.clamp(0, 1, 1.5) //1
const a = gsap.utils.clamp(0, 1)(-1) //0
distribute函数是依据元素的个数来分配值的方式，它的参数是一个拥有多个属性的对象。其中base，amount，each分别可以理解为基础值，最大值，每个元素值之间的差值。例如一共有三个元素，那第一个元素的值就是base，默认是0。如果设置amount，则第三个元素的值就是amount。剩下的元素会依据差值形成等差数列来平分。而each则是后一个元素的值比前一个增加each。amount的优先级比each高。
from是首个元素在这组元素中的位置，可以是数字，也可以是数字组成的数组来表示横纵坐标。还可以是关键字 "start" 、 、 "center" "edges" "random" 、 或 "end"。
grid是标明元素占据几行几列，默认为auto，由gsap自行判断。
axis是标明已列或已行为单位进行分配
ease可以设置值分配时的曲线，就不必是等差数列了
getUnit函数可以用来获取某个值的单位
gsap.utils.getUnit("50%"); // "%"
gsap.utils.getUnit("100vw"); // "vw"
interpolate函数，可以看作是从一个设定了最大值和最小值的数轴中取某一点的值。例如
gsap.utils.interpolate(0, 500, 0.5); // 250
最大值是500，最小值是0，取二分之一处的值，那就是250。
最大值最小值不仅可以是数字，还可以是字符串，颜色，对象等。
gsap.utils.interpolate("20px", "40px", 0.5); // "30px"
gsap.utils.interpolate("red", "blue", 0.5); // "rgba(128,0,128,1)"
gsap.utils.interpolate(
{ a: 0, b: 10, c: "red" },
{ a: 100, b: 20, c: "blue" },
0.5
); // {a: 50, b: 15, c: "rgba(128,0,128,1)"}
当然也可以用一个数组来代替最大值和最小值
// an array of numbers
gsap.utils.interpolate([100, 50, 500], 0.5); // 50
gsap.utils.interpolate([100, 50, 500], 0.75); // 275
// colors
gsap.utils.interpolate(["red", "green", "blue"], 0.5); // "green"
gsap.utils.interpolate(["red", "green", "blue"], 0.25); // "rgba(128,64,0,1)"
interpolate同样也可以延迟调用
var interp = gsap.utils.interpolate(0, 100)(0.5); //50
mapRange函数，可以理解为给定两个不同的数轴，第一个数轴某个值的位置，在第二个数轴中会是什么值。例如
gsap.utils.mapRange(-10, 10, 100, 200, 0); // 150
0是-10到10的中间位置，那么100到200的中间位置是150。mapRange函数同样支持延迟执行。
var mapper = gsap.utils.mapRange(0, 100, 0, 250)(50); //175
normalize函数可以返回某个值在数轴中的位置，以0到1来表示。例如
gsap.utils.normalize(-10, 10, 0); // 0.5
同样支持延迟执行
gsap.utils.normalize(-10, 10)(0); // 0.5
pipe函数可以接收n个函数，这些函数将按顺序执行，并且前一个函数的返回值传入下一个函数。类似于一个简化版的链式调用
random函数可以获取某个范围内的随机数
const random = gsap.utils.random(-200, 500, 10, true);
其中第一个参数是最小值，第二个参数是最大值，第三个参数可以省略，可以理解为数字间隔。比如0.01就是要有两位小数，5则是每次的数字以5为单位变化。第四个参数可以省略，表示返回的是一个延迟执行函数。除此之外还可以用数组来代替最大值和最小值
var random = gsap.utils.random(-10, 50, true);
var random2 = gsap.utils.random([0, 100, 200], true);
selector函数是一个限定范围的元素查找器。例如
let q = gsap.utils.selector('.class'); let boxes = q(".box");
表示只查找class下的所有box，返回的是一个数组。除此之外还可以传入react和vue组件。
shuffle函数，打乱原数组并返回。例如
var array = [1, 2, 3, 4, 5];const a = gsap.utils.shuffle(array);
array === a //true
splitColor函数，将颜色值的字符串，分解成由rgba数字组成的数组。例如
gsap.utils.splitColor("red"); // [255, 0, 0]
gsap.utils.splitColor("#6fb936"); // [111, 185, 54]
gsap.utils.splitColor("rgba(204, 153, 51, 0.5)"); // [204, 153, 51, 0.5]
gsap.utils.splitColor("#6fb936", true); // [94, 55, 47]
第二个参数表示有hsl代替rgb
toArray函数，将类数组转为一维数组。
// these all return the corresponding elements wrapped in a flat Array:
// selector text (returns the raw elements wrapped in an Array)
let targets = gsap.utils.toArray(".class");
// raw element/object
let targets = gsap.utils.toArray(myElement);
// Array of selector text (same result as ".class1, .class2")
let targets = gsap.utils.toArray([".class1", ".class2"]);
// Only descendant elements of myElement
let targets = gsap.utils.toArray(".class", myElement);
第二个参数表示在某个元素范围下查找
wrap函数，取到范围内的第n个值，从0开始计数。超出个数范围后则继续从头开始计数。
let num = gsap.utils.wrap(5, 10, 4) //9
let num = gsap.utils.wrap(5, 10, 12) // 7
5，6，7，8，9 所以返回9。5，6，7，8，9，10，5，6，7，8，9，10，5，6，7，第12位是7。如果给的参数是数组，
let num = gsap.utils.wrap([5, 10], 4) //5
那就是5，10，5，10，5 。所以返回5
wrapYoyo函数与wrap函数一样，但是循环方向相反。像回文一样，从前到后再从后到前。例如
let color = gsap.utils.wrapYoyo(["red", "green", "yellow"], 5); // "red"
顺序就是 red green yellow yellow green red ，所以返回red。wrap和wrapYoyo都可以只返回延迟函数。
unitize函数接收两个参数，第一个是原始函数，第二个是单位。并返回处理函数。传入处理函数的值会先经过原始函数的计算，最后把单位加上并返回。例如
var clamp = gsap.utils.unitize(gsap.utils.clamp(0, 100), "px");
clamp(132); // "100px"
clamp("-20%"); // "0px" (notice the unit change)
clamp(50); // "50px"
132，-20和50 去掉单位后，经过clamp函数计算把px单位加上就是最后返回结果。
也可以不传入单位参数，依然使用原始单位
var wrap = gsap.utils.unitize(gsap.utils.wrap(0, 100)); wrap("150px"); // 50pxwrap("130%"); // 30%
以上就是gsap中的所有工具函数。
工具函数的使用可以看官网中的相关示例
