Почему не редактируется объект?

// create table     
load() { 
        let tBody = document.querySelector('tbody'); 
 
        tBody.innerHTML = ''; 
 
        for (let i = 0; i < this.items.length; i++) { 
            let tr = document.createElement('tr'); 
            tr.classList.add('data'); 
            tr.dataset.id = i; 
            tr.innerHTML = ` 
                                <th scope="row" class="checkBox"><input type="checkbox" class="form-check-input" bid ="${i}"></th> 
                                <td>${this.items[i].fname}</td> 
                                <td>${this.items[i].phone}</td> 
                                <td>${this.items[i].email}</td> 
                                <td ><i class="far fa-edit" data-id="edit"></i> | <i class="far fa-trash-alt"  data-id="rubbish"></i></td> 
                            `; 
            tBody.append(tr); 
        } 
 
        this.list = []; 
        this.checkedList = []; 
        this.multiSel(); 
    } 
 
// edit contact  
 
    edit(i) { 
 
        const d = document; 
 
            const fname = d.querySelector('#Edname').value; 
            const phone =  d.querySelector('#Edphone').value; 
            const email =  d.querySelector('#Edemail').value; 
            this.items[i] = new BookItem(fname,phone,email); 
 
        this.save(); 
        this.load(); 
 
    } 
 
btnS.addEventListener('click', (e) => { 
 
        app.UserBook.edit(+e.target.closest('tr').dataset.id); 
},false);