How to simplify the initialization of five swiper sliders?

Question

css

There is an initialization of the slider with breakpoints

spoiler

var swiper = new Swiper('.clients', {
  slidesPerView: 1,
  spaceBetween: 10,
  // init: false,

  // If we need pagination
  pagination: {
    el: '.swiper-pagination',
  },

  // Navigation arrows
  navigation: {
    nextEl: '.swiper-button-next',
    prevEl: '.swiper-button-prev',
  },

  // And if we need scrollbar
  scrollbar: {
    //el: '.swiper-scrollbar',
  },

  breakpoints: {
    640: {
      slidesPerView: 2,
      spaceBetween: 20,
    },
    768: {
      slidesPerView: 4,
      spaceBetween: 40,
    },
    1024: {
      slidesPerView: 5,
      spaceBetween: 50,
    },
  }
});

But there are 5 sliders and you have to write

var swiper = new Swiper()
var swiper2 = new Swiper()
...
var swiperN = new Swiper()

And in parentheses, repeat this whole story about breakpoints and arrows every time.
How to simplify the call, but so that the sliders (and their arrows and pagination) remain independent?

Answer 1

Lightbox gallery)

Answer 2

The constructor supports initialization of multiple instances at once, so just specify a selector as the first parameter that will match all five root elements of your sliders at once.