web前端：封装一个简单的动画函数
软工小能手
2024-04-23 22:53
封装，即隐藏对象的属性和实现细节，仅对外公开接口，控制在程序中属性的读和修改的访问级别;将抽象得到的数据和行为(或功能)相结合，形成一个有机的整体，也就是将数据与操作数据的源代码进行有机的结合，形成"类"，其中数据和函数都是类的成员。
functionainmate(obj,target,callback){
//清除定时器，是指清除谁的定时器，这里是轮播图，所以清除元素的定时器
clearInterval(obj.timer);
//创建定时器，清除定时器，页面中就没有定时器，每轮播一次创建一个定时器，
//使其页面中只保留一个定时器,同理元素的定时器
obj.timer=setInterval(function(){
//定义步长值变量，用来接收走的步数
//步长值=（距离-元素距离左边的距离）除10;//10代表分成几份，可以更多，可以更少，看个人审美
varstep=(target-obj.offsetLeft)/10;
//三元表达式,当step的距离是向右移动是整数，会有一点误差，所以天花板函数取大，取整相反往左移动会出现小数，则地板函数取小，取整
step=step>0?Math.ceil(step):Math.floor(step);
//轮播一周后，清除定时器
if(obj.offsetLeft==target){
clearInterval(obj.timer);
//回调函数，判断是否有回调函数,如果有调用,如果没有不调用
if(callback){
callback();
}
//简写方法
//callback&&callback();
}
//轮播的元素需要有css里定位
//轮播的运算
obj.style.left=obj.offsetLeft+step+'px';
},30)
}
在面向对象编程中，封装(encapsulation)是将对象运行所需的资源封装在程序对象中--基本上，是方法和数据。对象是"公布其接口"。其他附加到这些接口上的对象不需要关心对象实现的方法即可使用这个对象。这个概念就是"不要告诉我你是怎么做的，只要做就可以了。"对象可以看作是一个自我包含的原子。对象接口包括了公共的方法和初始化数据。
免责声明：
① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的，并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据，供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。
② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
