Cannot found the parent class method

Question

Here is the parent class:

    export default class RosterTableUtil{
    constructor() {
        let highLightCellIndex = -1, highLightRowIndex = -1;
        ................
        this.updateUI = (cellIndex, rowIndex) => {
            highLightCellIndex = cellIndex;
            highLightRowIndex = rowIndex;
        }
      }
   }

Here is the child class:

import RosterTableUtil from "./RosterTableUtil";
export default class RosterSchedulerTableUtil extends RosterTableUtil{
  constructor(){
    super();
    .............

    this.updateUI = (cellIndex, rowIndex) => {
        super.updateUI(cellIndex, rowIndex);
        updateSelectRegion(cellIndex, rowIndex);
    }  
  }
}

When the RosterSchedulerTableUtil.updateUI function is called, I got the following error:

Uncaught TypeError: (intermediate value).updateUI is not a function

How can I fix the problem?

https://stackoverflow.com/questions/42036349/uncaught-typeerror-intermediate-value-is-not-a-function — JASBIR SINGH, May 12 '23 at 06:04
you need define updateUI in class body instead of in constructor — 0day, May 12 '23 at 06:14

ray · Accepted Answer · 2023-05-12T06:38:35.010

0

Updated to use private fields.

It's not obvious to me why you'd want to do all of that within the constructor. Seems like that's what instance methods are for. You could move it out of the constructor like this:

class RosterTableUtil {
  #highLightCellIndex = -1
  #highLightRowIndex = -1;
  
  updateUI (cellIndex, rowIndex) {
    this.#highLightCellIndex = cellIndex;
    this.#highLightRowIndex = rowIndex;
    console.log(`RosterTableUtil row ${this.#highLightRowIndex}, cell ${this.#highLightCellIndex}`);
  }
}

class RosterSchedulerTableUtil extends RosterTableUtil {
  updateUI (cellIndex, rowIndex) {
    super.updateUI(cellIndex, rowIndex);
    // do other stuff
  }
}

const util = new RosterSchedulerTableUtil();
util.updateUI(1,2);
util.updateUI(3,4);

edited May 12 '23 at 06:38

answered May 12 '23 at 06:11

ray

26,557
5
28
27

I want to make all variables to be private, so I put everything in the constructor. – The KNVB May 12 '23 at 06:21
@TheKNVB Then you should use private fields, or not use `class` syntax at all – Bergi May 12 '23 at 06:27
What should I use? function? – The KNVB May 12 '23 at 06:29
Updated answer to use [private fields](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/Private_class_fields#private_fields) (and removed the constructor altogether because it's not needed for this example). – ray May 12 '23 at 06:31
@TheKNVB Yes, you'd use a plain object-returning `function`, and [parasitic inheritance](https://stackoverflow.com/questions/9649077/using-super-methods-in-javascript-based-on-crockfords-functional-inheritance) instead of the `super` keyword – Bergi May 12 '23 at 06:38

score -1 · Answer 2 · edited May 12 '23 at 06:21

-1

To fix the problem, you need to add a super() call to the beginning of the updateUI function in the child class.

export default class RosterSchedulerTableUtil extends RosterTableUtil {

  constructor() {

    super();
    // Additional constructor logic for the child class
  }

  updateUI(cellIndex, rowIndex) {

    super.updateUI(cellIndex, rowIndex); // Call the parent class method
    updateSelectRegion(cellIndex, rowIndex);

  }
}

edited May 12 '23 at 06:21

The KNVB

3,588
3
29
54

answered May 12 '23 at 06:08

Yash Mehta

1
1

I have tried this one, the error message is : `RosterSchedulerTableUtil.js:163 Uncaught ReferenceError: Super constructor may only be called once` – The KNVB May 12 '23 at 06:10
super call in the constructor first then use it. – Yash Mehta May 12 '23 at 06:18
I have called super() in the constructor. – The KNVB May 12 '23 at 06:19
try to call the function by this. this.updateUI(cellIndex, rowIndex); – Yash Mehta May 12 '23 at 10:08

Cannot found the parent class method

2 Answers2