13th of 19 Questions.
How do React class components use this, and why did binding in the constructor become a common pattern? How did arrow function class fields solve it?
React class components use this to access props, state, and methods. Binding in the constructor was common to preserve this in callbacks. Arrow function class fields solve it by automatically binding this lexically.
In React class components, this is required to access this.props, this.state, and class methods. When passing a method as a callback (e.g., onClick={this.handleClick}), the method loses its binding, causing this to be undefined. Developers solved this by binding methods in the constructor: this.handleClick = this.handleClick.bind(this);. Arrow function class fields provide a cleaner solution: handleClick = () => { ... } — arrow functions capture this lexically from the class instance, eliminating the need for explicit binding.