JAVASCRIPT :

import { LightningElement ,track,wire} from 'lwc';
import getAccountList from '@salesforce/apex/AccountContact.getAccountList';
export default class AccountAndContact extends LightningElement {
@track accounts;
@track error;
@wire(getAccountList)
wiredAccounts({error,data}){
if (data) {
this.accounts = data;
} else if (error) {
this.error = error;
}
}
downloadCSVFile() {  
let listOfAccountsFields = ['Id','Name','Type' ,'Rating' ,'Ownership' , 'Active__c'];
let listOfContactsFields = ['Id','LastName']; 
let rowEnd = '\n';
let listOfContact = [];
this.accounts.forEach(element => {
listOfContact.push(element.Contacts);
});
//console.log('contacts' +JSON.stringify(listOfContact));
let mapOfString = new Map();
listOfContact.forEach(element => {
    let text = listOfContactsFields.join(',')+'\n';
element.forEach(eachElement=>{
    listOfContactsFields.forEach(field =>{
        //console.log('checkfield' +JSON.stringify(field))
        text += '\"'+eachElement[field]+'\"';
        }); 
       });
       text += '\n';
       
       if(mapOfString.has(element.AccountId)){
           mapOfString.set(element.AccountId,mapOfString.get(element.AccountId)+text);
           } 
       else{
           let tempStr = text;
           mapOfString.set(element.AccountId,tempStr);
           }
    //console.log('text' +text);
    
});
const arr = Array.from(mapOfString);
console.log('elementmap-----------' +arr);
let rowData = new Set();
    rowData = Array.from(rowData);
    csvString += listOfAccountsFields.join(',') +rowEnd;
    this.accounts.forEach(element=>{
    listOfAccountsFields.forEach(field=> {
        csvString += '"'+element[field]+'",'
    });
    csvString += '\n';
    csvString += mapOfString.get(element.Id);
})  
console.log('csv----------' +csvString);
let downloadElement = document.createElement('a');
// This  encodeURI encodes special characters, except: , / ? : @ & = + $ # (Use encodeURIComponent() to encode these characters).
downloadElement.href = 'data:text/csv;charset=utf-8,' + encodeURI(csvString);
downloadElement.target = '_self';
// CSV File Name
downloadElement.download = 'Account Data.csv';
// below statement is required if you are using firefox browser
document.body.appendChild(downloadElement);
// click() Javascript function to download CSV file
downloadElement.click();
document.body.removeChild(downloadElement); 
//console.log(csvString);
}
}

HTML:

<template>
<div class="slds-box slds-theme_default">
    <div class="slds-p-around_medium lgc-bg-inverse">
        <p>Download data as a CSV &nbsp;
            <lightning-button icon-name="utility:download" 
                                label="Download as CSV" 
                                title="Download CSV File"
                                onclick={downloadCSVFile} variant="brand"></lightning-button>
        </p>
    </div>
    <table class="slds-table slds-table_cell-buffer slds-table_bordered slds-table_col-bordered">
        <thead>
            <tr>
                <th class="" scope="col">
                    <div class="slds-truncate" title="Account Name">Name</div>
                </th>
                <th class="" scope="col">
                    <div class="slds-truncate" title="Type">Type</div>
                </th>
                <th class="" scope="col">
                    <div class="slds-truncate" title="Rating">Rating</div>
                </th>
                <th class="" scope="col">
                    <div class="slds-truncate" title="Ownership">Ownership</div>
                </th>
                <th class="" scope="col">
                    <div class="slds-truncate" title="Active">Active</div>
                </th>
            </tr>
        </thead>
        <tbody>
            <template for:each={accounts} for:item="acc">
                <tr key={acc.Id}>
                    <td>{acc.Name}</td>
                    <td>{acc.Type}</td>
                    <td>{acc.Rating}</td>
                    <td>{acc.Ownership}</td>
                    <td>{acc.Active__c}</td>
                </tr>
                <tr key={acc.Id}>
                    <th class="" scope="col">
                        <div class="slds-truncate" title=""></div>
                    </th>
                    <th class="" scope="col">
                        <div class="slds-truncate" title="Contact Id">Contact Id</div>
                    </th>
                    <th class="" scope="col">
                        <div class="slds-truncate" title="LastName">LastName</div>
                    </th>
                </tr>
                <template if:true={accounts}>
                    <template for:each={acc.Contacts} for:item="con">
                        <tr key={con.Id}>
                            <td></td>
                            <td>{con.Id}</td>
                            <td>{con.LastName}</td>
                        </tr>
                    </template>
                </template>
            </template> 
        </tbody>
    </table>
</div>   
</template>



CLASS :

public with sharing class AccountContact {
    @AuraEnabled(cacheable=true)
    public static List<Account> getAccountList() {
        List<Account> acct= [SELECT Name,Type ,Rating ,Ownership , Active__c,(SELECT Id,LastName,AccountId FROM Contacts)
        FROM Account WHERE Name LIKE'Account%' LIMIT 10];
        return acct;
    }
}