Code reduction and variable declaration

0

Good morning. I have 8 different variables with the same functions.

However, the functions assigned to these variables are the same.

I feel like I'm being repetitive in the code.

Is there any way to declare them all at once and the function be written only once, but equivalent to all 8 Variables?

<script>
         $(document).ready(function() {
         
           var owl = $("#owl-demo");
         
           owl.owlCarousel({

               [700, 7],
               [1000, 8],
               [1200, 8],
               [1400, 8],
               [1600, 8]
             ],
             
         
           });
         
         var owl = $("#owl-demo2");
         
           owl.owlCarousel({
     
             
               [600, 5],
               [700, 7],
               [1000, 8],
               [1200, 8],
               [1400, 8],
               [1600, 8]
             ],
             
         
           });
           var owl = $("#owl-demo3");
         
           owl.owlCarousel({
       
      
               [700, 7],
               [1000, 8],
               [1200, 8],
               [1400, 8],
               [1600, 8]
             ],
             
         
           });
         
           var owl = $("#owl-demo4");
         
           owl.owlCarousel({
         
          
           
               [1400, 8],
               [1600, 8]
             ],
             
         
           });
         
         
           var owl = $("#owl-demo5");
         
           owl.owlCarousel({
         
   
  
               [1200, 8],
               [1400, 8],
               [1600, 8]
             ],
             
         
           });
         
         
           var owl = $("#owl-demo6");
         
           owl.owlCarousel({
         
      
    
               [1600, 8]
             ],
             
         
           });
         
         
           var owl = $("#owl-demo7");
         
           owl.owlCarousel({
  
             

           });
         
         
           var owl = $("#owl-demo8");
         
           owl.owlCarousel({


               [1200, 8],
               [1400, 8],
               [1600, 8]
             ],
             
         
           });
         
           var owl = $("#owl-demo9");
         
           owl.owlCarousel({
    
               [450, 4],
               [600, 5],
               [700, 7],
               [1000, 8],
               [1200, 8],
               [1400, 8],
               [1600, 8]
             ],
             
         
           });
         
         
         });
      </script>
    
asked by anonymous 30.08.2016 / 19:55

1 answer

0

Yes, with a loop. Note: You may need to create a list to represent the objects with the numbers (I still have no idea what an "owlCarousel" and "owl" would look like.)

In this code I do not create a variable for every #owl-demo , I just store it in a Array object and then use it.

Note: There is a code error in the code, because in an object constructor you can not declare unnamed properties, or unless you are in the next generation JavaScript.

var owlsData = [

    [[700, 7],
    [1000, 8],
    [1200, 8],
    [1400, 8],
    [1600, 8]],

    [[1400, 8],
    [1600, 8]],

    [[1200, 8],
    [1400, 8],
    [1600, 8]],

    [[1600, 8]],

    [[1200, 8],
    [1400, 8],
    [1600, 8]],

    [[450, 4],
    [600, 5],
    [700, 7],
    [1000, 8],
    [1200, 8],
    [1400, 8],
    [1600, 8]]

];

for (var i = 1, o, owls = [];
    i++ <= 9 && owls.push(o = $("#owl-demo" + (i === 1 ? "" : i)));)
    o.owlCarousel(owlsData[i - 1]);

You can now access each element in owls .

    
30.08.2016 / 21:51