자바 스크립트에서 배열로 매개 변수 전달

Question

나는 여러 개의 슬라이더 인스턴스를 가지고 있으며 모든 매개 변수에 동일한 매개 변수를 전달해야합니다.

내가 배열이 필요하다고 가정하지만, JS에서 초보자이기 때문에 제대로 수행하는 방법을 잘 모르겠습니다.

spaceBetween: 20, 
slidesPerView: 5, 
breakpoints: { 
    600: { 
    slidesPerView: 2 
    }, 
    991: { 
    slidesPerView: 3 
    }, 
    1200: { 
    slidesPerView: 4 
    } 
} 

와 슬라이더 예 :

var swiper1 = new Swiper('.swiper1', { 
    prevButton: '.b-prev-1', 
    nextButton: '.b-next-1', 

    //here I need to get the rest of the parameters 

}); 

당신 :

Answer 1

안녕 당신이 쓸 수와 같은

var swiper1 = new Swiper('.swiper1', [ 
 
    prevButton: '.b-prev-1', 
 
    nextButton: '.b-next-1', 
 
    //here I need to get the rest of the parameters 
 
]);

아래에 감사

매개 변수는 다음과 같이 예를 들어 본다

Answer 2

시도가

function(arrayP){  
    for(var i = 0; i < arrayP.length; i++){ 
     alert(arrayP[i]); //no .value here 
    } 
} 

링크 : - Passing an array as parameter in JavaScript

Answer 3

당신이 사용할 수있는 jQuery의 $.extend() :

이

var extraDetails = { 
    spaceBetween: 20, 
    slidesPerView: 5, 
    breakpoints: { 
     600: { 
     slidesPerView: 2 
     }, 
     991: { 
     slidesPerView: 3 
     }, 
     1200: { 
     slidesPerView: 4 
     } 
    } 
}; 

var swiper1 = new Swiper('.swiper1', $.extend({ 
     prevButton: '.b-prev-1', 
     nextButton: '.b-next-1' 
    }, 
    extraDetails 
)); 

Answer 4

ES5에서이 일을 가장 웅변 방법은 만드는 것입니다 각 슬라이드에 대한 새 구성 객체이지만를 사용하여 공통 객체를 기반으로합니다.. 난 당신의 DOM 요소를 통해 당신은 루프 수 상상하고 각각에 대해이 온 - 더 - 플라이는 config를 만들 - 더 많은 코드를보고 멋있다고

var commonConfig = { spaceBetween: 20, slidesPerView: 5, breakPoints: { ... } }; 

var swiper1 = $.extend(true, {}, commonConfig, { 
    prevButton: '.b-prev-1', 
    nextButton: '.b-next-1' 
}); 

var swiper2 = $.extend(true, {}, commonConfig, { 
    prevButton: '.b-prev-2', 
    nextButton: '.b-next-2' 
}); 

(Object.assign()는 VanillaJS에서 유사하다). 뭔가 같은 :

$('.swiper').each(function(idx, el){ 
    $(this).swiper({ 
     spaceBetween: 20, 
     slidesPerView: 5, 
     breakPoints: { ... }, 
     prevButton: '.b-prev-'+(idx+1), 
     nextButton: '.b-next-'+(idx+1) 
    }); 
});