OO Javascript: array not getting initialized

Question

I'm programming a library (in ES6 Javascript) with three classes: opening hours, book, books. And the "main" class library (which consists of the previous classes).

The console error I'm getting is the following: Uncaught TypeError: Cannot set property 'undefined' of undefined at Books.set books [as books].

The error is in the Books class in the setter.

Here is the code:

'use strict';
//OO library (Classes: Libary, Book, WorkingHours)
class WorkingHours{
    constructor(open, close, lunch){
        this.open = open;
        this.close = close;
        this.lunch = lunch;
    }
}
class Book {
    constructor(title, category, author){
        this.title = title;
        this.category = category;
        this.author = author;
    }
}
class Books {
    constructor(){
        this.books = [];
        //let books = new Array();
        //let books = [];
        var bookAmount = 0;
    }
    set books(book){
        //this.books.push(book);
        this.books[this.bookAmount] = book;
        this.bookAmount++;
    }
}
class Library { 
    constructor(workingHours, booksIn){
        this.workingHours = workingHours;
        this.booksIn = booksIn;
    }

    get workingHours() {
        return this.workingHours;
    }
    get booksIn() {
        return this.booksIn;
    }
}

var workHour = new WorkingHours(900,1700,false);
var bookColl = new Books();
var newBook = new Book("Mastery", "Real Stories", "Robert Greene");
bookColl.books = newBook;
newBook = new Book("48 Laws of Power", "Slef-teaching", "Robert Greene");
bookColl.books = newBook;
var newLib = new Library(workHour, bookColl);
console.log(newLib);

You cannot have two properties with the same name. .books can't be both a (setter) method and an array, .workingHours and .booksIn can't be set if they only have getters and also are infinitely recursive — Bergi
– Bergi, Commented May 7, 2018 at 10:16
estus answer is correct. note that you had 2 different problems there. Try this tutorial, it explains Javascript OOP very clearly. youtube.com/watch?v=PFmuCDHHpwk&t=3252s — yuval.bl
– yuval.bl, Commented May 7, 2018 at 10:27

Estus Flask · Accepted Answer · 2018-05-07 10:24:57Z

2

var bookAmount = 0 doesn't initialize a property. this.books = [] causes books array to be assigned through books setter the same way it would be assigned outside class, this.books[this.bookAmount] = ... is evaluated with both books and bookAmount being undefined.

It should be:

class Books {
    constructor(){
        this._books = [];
        this.bookAmount = 0;
    }
    ...
}

bookAmount value is redundant, because it's already available as this._books.length. The proper way to do that is:

set books(book){
    this._books.push(book);
}

get books(){
    return this._books;
}

edited May 7, 2018 at 10:24

answered May 7, 2018 at 10:15

Estus Flask

226k79 gold badges478 silver badges620 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

martini21 Over a year ago

Thank you very much, it is now working as I expected :)

Collectives™ on Stack Overflow

OO Javascript: array not getting initialized

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related