为什么我这样写,会出现原型上没有定义的这个问题

按照老师的方法写的,为什么我这个会出现这样的问题;
var ball1 = document.querySelector('.ball1');
var ball1 = document.querySelector('.ball2');
var ball1 = document.querySelector('.ball3');
var Promise = window.Promise;
//
//
// function animation(ball, distance,cb) {
// setTimeout(function() {
// var marginleft = parseInt(ball.style.marginLeft,10);
// if (marginleft === distance) {
// cb&cb()
// } else {
// if (marginleft > distance) {
// marginleft--;
// } else {
// marginleft++;
// }
// ball.style.marginleft = marginleft;
// animation(ball, distance,cb);
// }
//
// }, 13);
// };
// animation();
//
// animation(ball1,200,function(){
// animation(ball2,300,function(){
// animation(ball3,400,function(){
// animation(ball3,250,function(){
// animation(ball2,250,function(){
// animation(ball1,250)
// })
// })
// })
// });
// });
//
function promiseAnimation(ball, distance) {
return new Promise(function(resole, reject) {
function animation(ball) {
setTimeout(function() {
var marginLeft = parseInt(ball.style.marginLeft,10);
if (marginLeft === distance) {
resole();
} else {
if (marginLeft > distance) {
marginLeft--;
} else {
marginLeft++;
}
ball.style.marginLeft = marginLeft;
animation();
}
}, 13);
};
animation();
});
};
promiseAnimation(ball1, 100)
.then(function() {
return promiseAnimation(ball2, 200)
})
.then(function() {
return promiseAnimation(ball3, 300)
})
.then(function() {
return promiseAnimation(ball3, 150)
})
.then(function() {
return promiseAnimation(ball2, 150)
})
.then(function() {
return promiseAnimation(ball1, 150)
})