题主可以试着用Chrome断点调试试试,在timer部分。

1.前面的第1,第2图片都是每隔3s以后,执行start函数中的for循环。
2.当到了第3张图片,index=3的时候,在for循环中图片的偏移距离为3*length(一张图片的宽度),第四张图片出现，且第四个按钮为红色。之后index为4。
3.此时隔了3s以后,进入函数里面,在if判断中index为4,index被替换为0,跳出函数。
4.再隔了3s以后,进入函数里面,由于index为0,所以图片的偏移距离为0*length(一张图片的宽度),第一张图片出现,且第一个按钮为红色.

所以第四张图片跳到第一张图片的时候,实际上间隔了6s多。其他的都是3s多左右。

在题主的基础上修改了一下。原理就是当index为4的时候,不直接跳出去,而是直接变为0,这样再隔3s进来的时候,就不用判断可以直接处理index为0的状态了。

timer = setInterval(function () {
    img.style.left = -(imgs[0].offsetWidth * index) + 'px';
    for (var k = 0; k < nums.length; k++) {
        if (nums[k].index === index) {
            nums[k].className = 'a';
        } else {
            nums[k].className = 'b';
        }
    }
    index += 1;
    if(index == 4){
        index = 0;
    }
    }, 3000);