Как создать свой класс

[slark]

Добрый день, создал свой небольшой класс который вешает событие "клик" на свои объекты, в моем случае на кнопки. CSS-класс кнопки передается при создании объекта.

class btn {
    constructor (className) {
        this.className = className
        this.btn = document.querySelector(className)
    }

    btnClick () {
        this.btn.addEventListener('click', function () {
            console.log('Привет: ' + this.className)
        })
    }
}

let btn1 = new btn('.btn-1')
btn1.btnClick()

let btn2 = new btn('.btn-2')
btn2.btnClick()

Вопрос , допустим у меня будет 10 методов, что делать чтобы их постоянно не вызывать для каждого объекта? Можно ли сделать так, чтобы эти методы автоматически запускались при создании объекта?

[Aetae]

constructor (className) {
  this.className = className
  this.btn = document.querySelector(className)
  this.btnClick()
}

0_o

[slark]

спасибо , вроде работает
не знал что в конструктор можно вызовы запихивать

[рони]

slark,

class btn {
            constructor(className) {
                this.className = className;
                this.btn = document.querySelector(className);
                this.btn.addEventListener('click', this.btnClick.bind(this));
                this.btnClick()
            }

            btnClick() {
                console.log('Привет: ' + this.className)
            }
        }

        let btn1 = new btn('.btn-1')

        let btn2 = new btn('.btn-2')

[slark]

жесть круто спс, буду допиливать

[Aetae]

Это ещё не круто, круто вот так) :

class btn {
  constructor(className) {
    this.className = className;
    this.btn = document.querySelector(className);
    this.btn.addEventListener('click', this);
    this.btnClick()
  }
  
  handleEvent(event) {
    const { type: [firstLetter, ...rest] } = event;
    return this[`btn${firstLetter.toUpperCase()}${rest.join('')}`](event);
  }

  btnClick() {
    console.log('Привет: ' + this.className)
  }
}

[slark]

ну всё поплыл

[рони]

Aetae,