<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>new+call(this)组合应用再探讨实例</title>
<script type="text/javascript">
/***
*参数:
*imgArr:图片组
*container:轮播图的父容器
*arrow:左右箭头图片组
*/
//创建图片轮播基类
var LoopImages = function(imgArr,container){
this.imagesArr = imgArr;
this.container = container;
}
LoopImages.prototype = {
//创建轮播图片
createImage:function(){
console.log('createLoopImages');
},
//切换下一张图片
changeImage:function(){
console.log('changeLoopImages');
}
}
//创建上下滑动子类
var SlideLoopImg = function(imgArr,container){
//构造函数继承父类图片轮播类
LoopImages.call(this,imgArr,container);
}
SlideLoopImg.prototype = new LoopImages();//这句加上上面的call(this)就是组合式继承了
//先new继承父类原型,再创建子类的原型方法,这个顺序一定得这样写,否则报错
SlideLoopImg.prototype.changeImage = function(){
console.log('SlideLoopImg changeImages');
}
//创建渐隐渐显子类
var FadeLoopImg = function(imgArr,container,arrow){
LoopImages.call(this,imgArr,container);
this.arrow = arrow;
}
FadeLoopImg.prototype = new LoopImages();
FadeLoopImg.prototype.changeImage = function(){
console.log('FadeLoopImg changeImages');
}
//测试用例
var fadeimg = new FadeLoopImg(['01.jpg','02.jpg','03.jpg','04.jpg'],'slide',['left.jpg','right.jpg']);//'slide'是父容器名字
fadeimg.changeImage();
//本例已经通过验证
</script>
</head>
<body>
</body>
</html>