Каковы плюсы / минусы и лучшие практики для создания функций для класса React Component?
Оба эти класса делают одно и то же, но ClassA кажется избыточным из-за привязки, которую вы должны выполнять каждый раз, когда объявляете функцию, а ClassB не выглядит таким же чистым, как ClassA, из-за различий в типах создания функций.
class ClassA extends React.Component {
constructor() {
super();
this.state = { message: "bar" };
this.foo = this.foo.bind();
}
foo() {
console.log(this.state.message);
}
render() {
return <SomeComponent foo={this.foo} />;
}
}
class ClassB extends React.Component {
constructor() {
super();
this.state = { message: "bar" };
}
foo = () => {
console.log(this.state.message);
}
render() {
return <SomeComponent foo={this.foo} />;
}
}
Чтобы избавиться от различий создания функций в ClassB, вы, вероятно, можете сделать что-то вроде этого, где все является выражением.
class ClassC extends React.Component {
state = { message: "bar" }
foo = () => {
console.log(this.state.message);
}
render = () => {
return <SomeComponent foo={this.foo} />;
}
}
Каковы плюсы и минусы между объявлениями функций и выражениями в этом случае? Есть ли различия в производительности, памяти или даже в удобстве обслуживания?
Редактировать: я думаю, с сегодняшней стандартной технологией разница в производительности не очень заметна. Я думаю, что я действительно хочу из этого вопроса, что является лучшей практикой для создания функций для класса (особенно компонент React)