Нужно ли биндить все методы?

Question

[User Unknown]

Нужно ли делать bind на все методы класса в конструкторе?

class Pet {
  constructor(name="Mister Anon") {
    this.name = name;
    this.sound = this.sound.bind(this);
  }
  
  sound() {
    console.log(`My name is ${this.name}`);
  }
}

let dog = new Pet("Bread");

let method = dog.sound;

method(); // My name is Bread

// а без бинда в конструкторе будет ошибка из-за то что this - undefined

Comments

[Negwereth]

А не расскажете, зачем вам такие сложные экивоки с методами? Зачем их отделять от экземпляра?

[User Unknown]

Negwereth: этим вопросом задался, потому что начал изучать реакт, а там хендлинг ивентс нужно делать с жёсткой привязкой к контексту

[Negwereth]

AndrewN1: и только потому, что у них через жопу компоненты на классах работают. И, кстати, там без бинда можно обойтись, через () =>

[User Unknown]

Negwereth: да, спасибо, уже в ответах написали

Answer 1

[Lynn «Кофеман»]

bind нужен если вы зачем-то хотите вызывать метод отдельно от объекта.
Делать его всегда не нужно, вы просто замедляете выполнение кода (bind далеко не бесплатен) и рассыпаете потенциальные грабли (иногда нужно вызывать методы в конексте других объектов).

И даже если надо bind, то лучше его делать в тот момент когда он реально необходим.

let method = dog.sound.bind(dog);
method();

Comments

[User Unknown]

понял, изучаю реакт, отлов событий, увидел там пример, что без привязки метода, ничего не получится, и задался вопросом нужно ли вообще использовать это вне реакта. Теперь все стало ясно, спасибо

Answer 2

[kulaeff]

Да, все верно. Но можно также использовать arrow functions и тогда не придется биндить:

sound = () => {
    console.log(`My name is ${this.name}`);
}

Comments

[User Unknown]

то есть это хорошая практика делать бинд? Спасибо, за arrow func знал, но как-то не сообразил

[kulaeff]

Да, это вполне нормальная практика.

[User Unknown]

kulaeff: все, спасибо

[User Unknown]

kulaeff: но ведь тогда этот метод сохраняется в экземпляре, а не в прототип.

class Bork {
    instanceProperty = "bork";
    boundFunction = () => {
      return this.instanceProperty;
    }
  }

  let myBork = new Bork;

  //Property initializers are not on the prototype.
  console.log(myBork.__proto__.boundFunction); // > undefined

[Lynn «Кофеман»]

AndrewN1:
А эта ваша строчка думаете куда сохраняет метод?
this.sound = this.sound.bind(this);

[kulaeff]

AndrewN1: если для вас это принципиально, если вам нужна возможность изменять метод вне класса, то тогда используйте bind().