Повторяющийся шаблон в JavaScript
-
26-12-2019 - |
Вопрос
Как бы я повторил рисунок преобразования ниже?
BoxesFx.prototype._setTransforms = function() {
this.transforms = {
'effect-1' : {
'next' : [
'translate3d(0, ' + (win.height/2+10) + 'px, 0)',
'translate3d(-' + (win.width/2+10) + 'px, 0, 0)',
'translate3d(' + (win.width/2+10) + 'px, 0, 0)',
'translate3d(0, -' + (win.height/2+10) + 'px, 0)',
],
'prev' : [
'translate3d(' + (win.width/2+10) + 'px, 0, 0)',
'translate3d(0, ' + (win.height/2+10) + 'px, 0)',
'translate3d(0, -' + (win.height/2+10) + 'px, 0)',
'translate3d(-' + (win.width/2+10) + 'px, 0, 0)'
]
}}}
.
в основном, я пытаюсь иметь:
'translate3d(0, ' + (win.height/2+10) + 'px, 0)',
'translate3d(-' + (win.width/2+10) + 'px, 0, 0)',
'translate3d(' + (win.width/2+10) + 'px, 0, 0)',
'translate3d(0, -' + (win.height/2+10) + 'px, 0)'
.
Повторяйте количество раз, мы можем сказать, что будет 3, без копирования и вставки в 3 раза.Есть ли способ дублировать массив?Я чувствую, что я могу запутать .. Надеюсь, я хорошо объяснил это хорошо
Решение
Просто определите массив снаружи
var translate =[
'translate3d(0, ' + (win.height/2+10) + 'px, 0)',
'translate3d(-' + (win.width/2+10) + 'px, 0, 0)',
'translate3d(' + (win.width/2+10) + 'px, 0, 0)',
'translate3d(0, -' + (win.height/2+10) + 'px, 0)',
];
BoxesFx.prototype._setTransforms = function() {
this.transforms = {
'effect-1' : {
'next' : translate,
'prev' : translate
}}}
.
Две массивы, которые вы одинаковы, но я предполагаю, что они могут быть, так как вы не можете ссылаться на массив дважды и получить две совершенно разные массивы?
Если вам нужна фактическая новая копия массива каждый раз, вы можете сделать
'next' : translate.slice(0)
.
вместо этого
Не связан с StackOverflow