L'affectation à un tableau à tranches variables permet de modifier le tableau d'origine

Question

Nous avons une classe qui possède un tableau privé.

class BookService{ 
    private booksList: Book[]; 

    constructor(){ 
     this.booksList = [ 
     new Book('Tales', true), 
     new Book('Novels', false), 
     new Book('Dictionary', false) 
     ]; 
    } 

    getBooks(){ 
     return this.booksList; 
    } 

} 

class Book{ 
    constructor (public name: string, public isRead: boolean){} 
} 

export const bookService = new BookService(); 

Nous avons également une implémentation.

import {bookService} from './book-service'; 

//get copy of original array which is not by reference 
let books: any = bookService.getBooks().slice(0); 
//log local array 
console.log(books); 

// modify local array 
books[1].isRead = true; 

//log original array 
console.log(bookService.getBooks()); 

Nous avons obtenu la copie du tableau d'origine. Puis nous avons modifié le tableau local (copie du tableau d'origine). Nous avons un tableau d'origine qui a été modifié.

Je n'arrive pas à comprendre pourquoi la matrice privée d'origine a été modifiée?

Si je modifie getBooks à

getBooks(){ 
    return this.booksList.slice(0); 
    } 

il ne sera pas utile.

Si je modifie getBooks en utilisant la méthode lodash _.cloneDeep Method description

getBooks(){ 
    return _.cloneDeep(this.booksList); 
    } 

le tableau original ne sera pas modifié. Pourquoi? Comment éviter les erreurs liées à ce genre de situations?

Answer 1

Lorsque vous clonez le tableau avec slice, les objets à l'intérieur restent les mêmes.

Si vous avez trois objets, a, b et c dans un tableau arr et vous clonez, le nouveau tableau contiendra toujours des références à a, b et c, plutôt que de nouveaux objets qui ont le même aspect.

var arr = [ a, b, c ]; 
var arr2 = arr.slice(0); // [ a, b, c ]; 

arr === arr2; // false - they are not the same array 

arr[0] === arr2[0]; // true - they contain the same a object 

Cela signifie que si vous obtenez a de arr2, il est le même objet a qui est en arr - afin de modifier une fois modifie.