Array map calls the constructor of a class that extends Array instead of calling Array constructor

Question

Calling map() on an instance text of ConsoleText class that extends Array results in a ConsoleText(text.length) call (constructor input: 2 in the last line).
How to fix it so that text.map() calls Array constructor instead? Or it is a feature of inheritance?

EDIT: found an answer here

'use strict'

let initializingText = true;

class ConsoleText extends Array {
  constructor(strings) {
    console.log('constructor input:', strings);
    if (initializingText) {
      super(...strings);
    } else {
      super('item1', 'item2', 'item3', 'item4', 'item5');
    }
  }
}

let text = new ConsoleText(['a', 'b']);   // constructor input: (2) ['a', 'b']

console.log('text:', text);   // text: ConsoleText(2) ['a', 'b']

initializingText = false;   // switch to escape error destructuring a number

console.log(text.map(() => 'q'));   // constructor input: 2
                                    // ConsoleText(5) ['q', 'q', 'item3', 'item4', 'item5']

I can confirm this in Firefox. My guess is the map method calls its own classes constructor instead of using a hardcoded Array one. You can simply overwrite Array.prototype.map with your own implementation, it's a really simple method anyway. — user5734311
– user5734311, Commented Aug 22, 2022 at 20:06
developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… — gog
– gog, Commented Aug 22, 2022 at 20:22
Does this answer your question? Why in javascript filtering an object of a class that extends an Array calls it's constructor? — gog
– gog, Commented Aug 22, 2022 at 20:23

KiraLT · Accepted Answer · 2022-08-22 20:13:18Z

3

Array.constructor accepts two different types of arguments:

new Array(element0, element1, /* … ,*/ elementN) - list of elements to create new array
new Array(arrayLength) - array length, it will create an empty array then.

So when you call Array.map, it will create a new array with the same instance class, pass array length into constructor and then will use Array.push to update that array. That is the reason why map logs array length in your case.

Furthermore, I do not recommend extending default data structure cause it can be really confusing. Maybe in your case you can just create a simple function, that returns generated array?

answered Aug 22, 2022 at 20:13

KiraLT

2,6371 gold badge26 silver badges38 bronze badges

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

Collectives™ on Stack Overflow

Array map calls the constructor of a class that extends Array instead of calling Array constructor

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related