Passing array from Visualforce Javascript to apex class

Before posting this question let me tell you all i have already referred below posts for reference

Post1

Post2

But was unable to proceed with the solutions provided.So posting my query here

As my title suggests i am passing Array from JS to Apex controller but initially its throwing me a exception when i am declaring the passed variable as array and when i am declaring it as String i am only getting the first value of array.

Even tried to de-serialize the array as mentioned in this Post

Posting the needed code below.

<input type='checkbox' id="{!devMaster.Deviation_Id__c}" class="slds-input"
    onchange="selectedDeviations('{!devMaster.Deviation_Id__c}')"/>
    <apex:actionFunction action="{!sendSelectedDevs}" name="passSelectedDeviations" reRender="deviationMaster">
                                                        <apex:param name="devId" value=""/>
                                                    </apex:actionFunction>
    <div class="slds-modal__footer">
                                <apex:commandButton value="Ok" styleClass="slds-button slds-button--destructive" onClick="getCheckedValues()" reRender="none"/>
                                <!--<button class="slds-button slds-button--brand" onClick="getCheckedValues();return false;">Ok</button>-->
                                <button class="slds-button slds-button--destructive" onClick="closeDeviationPopup();return false;">Close</button>
                                <div> 
                                    <center>
                                        <apex:commandButton value="<<" rerender="modalPopup" action="{!beginning}" disabled="{!prev}"/>&nbsp;&nbsp;
                                        <apex:commandButton value="Previous" rerender="modalPopup" action="{!previous}" disabled="{!prev}"/>&nbsp;&nbsp;
                                        <apex:commandButton value="Next" rerender="modalPopup" action="{!next}" disabled="{!nxt}"/>&nbsp;&nbsp;
                                        <apex:commandButton value=">>" rerender="modalPopup" action="{!end}" disabled="{!nxt}"/> 
                                    </center>
                                </div>
                            </div>

Js code

var chkArray = [];
        function selectedDeviations(devMasterId){     
            var checkedValue = document.getElementById(devMasterId).checked;
            //alert(checkedValue);
            if(checkedValue){
                //alert(devMasterId);
                chkArray.push(devMasterId);
            }
            else{
            chkArray.splice(chkArray.indexOf(devMasterId),1);
            }


        }
        function getCheckedValues(){
            alert(chkArray);                //Here the array is properly getting printed
            passSelectedDeviations(chkArray);
        }




//Apex Controller

 Public  String deviationId {get;set;}
 Public void sendSelectedDevs(){
        deviationId = apexpages.currentPage().getParameters().get('devId');
        List<String> splitDeviationId = deviationId.split(',');

        //tried the Deserialilze method.But was facing with malformed-json-expected-at-the-beginning-of-list-set EXCEPTION
      //deviationId = (TWL_CreditManagerCtrl )JSON.deserialize( Apexpages.currentPage().getParameters().get('deviationId'), List<string>.class ) ;
      system.debug('splitDeviationId '+splitDeviationId);  
        try{
            if(deviationId != null){
      deviationsList = [SELECT Deviation_Id__c,Deviation_Description__c,Priority__c,Nature_Of_Deviation__c,Loan_Application__r.Contact__r.Name FROM Deviation_Master__c
                            where Deviation_Id__c =: deviationId]; 
            }

        }
       catch(Exception ex){ 
            ApexPages.addMessage(new ApexPages.Message(ApexPages.Severity.ERROR,'Some error occured. Please contact Administrator.'));
            system.debug('Exception at Line '+ex.getLineNumber()+' '+ex);
        } 


    }   

Any help would be appreciated.