应用场景这样的:
var imgUrls = [ '1.jpg', '2.jpg', '3.jpg', '4.jpg' ]; 现在想做一个Carousel的插件,要求点击某个按钮的时候可以一直循环看图片: 1.jpg, 2,jpg, 3.jpg, 4.jpg,1.jpg,2.jpg.... 如此循环下去,反之亦然。。
怎么去做数据层面的处理,怎么判断是否到头了?容易想到的办法是:
var currentIndex = 0; // show next img if (currentIndex === imgUrls.length - 1) { currentIndex = 0; } else { currentIndex++; } // show previous img if (currentIndex === 0) { currentIndex = imgUrls.length - 1; } else { currentIndex--; }
这种写法最直接,逻辑也很清楚,一目了然。不过今天自己在写这段的时候突然脑袋抽了一下,换了一种写法:
var currentIndex = 0; // show next img currentIndex = ++currentIndex % imgUrls.length; // show previous img currentIndex = (--currentIndex + imgUrls.length) % imgUrls.length;
相比第一种写法,代码简洁了一些,但逻辑却不那么明显清晰了。
这让我想到了那个什么什么不可兼得。。。