Как сделать рефакторинг кода?

Question

[Kusmich]

Есть код в котором меняются только имена класса и переменные с счётчиком . Но он трижды повторяет себя . Можно можно ли его сократить до одной красивой функции ?

код:

var itt = 0;
var itt_2 = 0;
var itt_3 = 0;

$('.first_div > img').each(function(i, elem) {
	itt++;
	console.log(itt);
	var lefted = -20 * itt;
	$('.first_div > img').eq(itt).css({
		'left': lefted + 'px'
	});
	//console.log(lefted)  
});

$('.sekond_div > img').each(function(i, elem) {
	itt_2++;
	console.log(itt_2);
	var lefted = -20 * itt_2;
	$('.sekond_div > img').eq(itt_2).css({
		'left': lefted + 'px'
	});
	//console.log(lefted)  
});



$('.sird_div > img').each(function(i, elem) {
	itt_3++;
	console.log(itt_3);
	var lefted = -20 * itt_3;
	$('.sird_div > img').eq(itt_3).css({
		'left': lefted + 'px'
	});
	//console.log(lefted)  
});								

});

Answer 1

[Alecxandrys]

$('.first_div > img').each(function(i, elem) {
ref('.first_div > img',  0)
  //console.log(lefted)  
});

$('.sekond_div > img').each(function(i, elem) {
ref('.sekond_div > img',  0)
  //console.log(lefted)  
});



$('.sird_div > img').each(function(i, elem) {
ref('.sird_div > img',0)
  //console.log(lefted)  
});								

});

function ref(name,itt){
  itt++;
  console.log(itt);
  var lefted = -20 * itt;
  $(name).eq(itt_3).css({
    'left': lefted + 'px'
  });
}

Scope, замыкания и области видимости наше все.

Comments

[Yaroslav Lyzlov]

зачем each 3 раза, если это можно сделать в той же функции ref?

[Yaroslav Lyzlov]

и причём тут замыкание и область видимости, если по сути вы их никак не используете. ну вызвали функцию в функци.. и что? где что замкнулось то у вас?

Answer 2

[andreyqin]

$.fn.setImagesIndent = function() {
    var INDENT_FACTOR = -20;
    
    return $(this).each(function() {
        $(this).css('left', INDENT_FACTOR * ++$(this).index());
    });
};

$('.first_div > img').setImagesIndent();