Get access to a nested object within object

JavaScript
#1

Hi, here is I got stuck a little. I don’t get why I can’t get access to a ‘cell’. I’ve tried it with ‘this’ and ‘grid.cell’ and it throws me an error ‘Uncaught TypeError: Cannot read property ‘value’ of undefined’, why the cell is undefined (of gridField array)?

let grid = {
    step: 16,
    width: 5,
    height: 10,
    cell: {
    x: 0 },
    gridField: [this.cell, this.cell,this.cell, this.cell],
    drawCell: function(){
         ctx.clearRect(20, y, 20, 20);
         ctx.fillStyle = 'black';
         ctx.fillRect(20, y, 20, 20,);
     },
    drawGrid: function(){
        this.gridField.forEach(cell =>{
            if (cell.value === 0){
                this.drawCell();
                
            }
        })

    }  
}
#2

Because this is referring to the array it’s inside of, and there is no member called cell inside of gridField.
https://www.w3schools.com/js/js_this.asp

#3