上一节的写法是标准的写法，但是实际开发中那样写是过于繁琐的，因而我们需要简化代码。
之前的代码：
class Weather extends React.Component {
constructor(props) {
super(props);
this.state = {isHot: true};
this.changeWeather = this.changeWeather.bind(this);
}
render() {
const { isHot } = this.state;
return <h1 onClick={this.changeWeather}>今天天气非常的{isHot ? '炎热' : '凉爽'}</h1>
}
changeWeather() {
this.setState({isHot: !this.state.isHot})
}
}
ReactDOM.render(<Weather />, document.getElementById('app'));
我们把state写在构造方法中就是为了那个this，那可不可以提出来？类中不能写let等等语句，但是是可以写赋值语句的，所以我们可以提出来直接写成state = {}，那函数呢？我们现在的函数是在类的原型对象上，那我们能不能用赋值语句的写法把这个函数拿出来变成类自己的方法呢？当然可以，但是变成了赋值语句其中的this问题还是没有解决呀。
等等，函数，this，this，函数，箭头函数！！！
一下子通透了对吧，箭头函数指向的是其最近作用域的this指向，那函数外的this是什么呢？当然是类的实例了，所以经过修改之后我们的代码已经简化了。
class Weather extends React.Component {
state = {isHot: true};
render() {
const { isHot } = this.state;
return <h1 onClick={this.changeWeather}>今天天气非常的{isHot ? '炎热' : '凉爽'}</h1>
}
changeWeather = () => {
this.setState({isHot: !this.state.isHot})
}
}
ReactDOM.render(<Weather />, document.getElementById('app'));
