Modèle répétitif en JavaScript
-
26-12-2019 - |
Question
Comment puis-je répéter le motif de transformation ci-dessous?
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)'
]
}}}
Fondamentalement, j'essaie d'avoir:
'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)'
Répétez la quantité Nombre de fois, nous pouvons dire que n aura 3, sans copier et le coller dans 3 fois.Y a-t-il un moyen de dupliquer un tableau?Je me sens comme si je pouvais être déroutant .. J'espère que je l'ai bien expliqué
La solution
Définissez simplement le tableau à l'extérieur
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
}}}
Les deux tableaux que vous n'êtes pas identiques, mais je suppose qu'ils pouvaient être, comme vous ne pouvez pas faire référence à un tableau deux fois et obtenir deux tableaux complètement différents?
Si vous avez besoin d'une nouvelle copie réelle de la matrice à chaque fois, vous pouvez faire
'next' : translate.slice(0)
au lieu de la place
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow