1.钩子函数

  1. 是一个函数,在系统消息触发时被系统调用
  2. 不是用户自己触发的
  3. 使用时直接编写函数体
  4. 钩子函数的名称是固定的,也就是语言自带的
  5. 例如react的生命周期函数,vue生命周期函数

2.回调函数

<body>
  <div id="test"></div>
  <script type="text/babel">
    "use strict";
    class Person extends React.Component {
      state = {
        persons: [
          { id: 1, name: "小李", age: 18 },
          { id: 2, name: "小张", age: 20 },
        ],
      };
      addXiaoWang = () => {
        let { persons } = this.state;
        persons = [{ id: 3, name: "小王", age: 30 }, ...persons];
        this.setState({ persons });
      };
      render() {
        return (
          <div>
            <h2>展示人员信息</h2>
            <button onClick={this.addXiaoWang}>添加一个小王</button>
            <ul>
              {this.state.persons.map((personObj) => {
                return (
                  <li key={personObj.id}>
                    {personObj.name}----{personObj.age}
                    <input type="text" />
                  </li>
                );
              })}
            </ul>
          </div>
        );
      }
    }
    ReactDOM.render(<Person />, document.getElementById("test"));
  </script>
</body>

如以上代码,addXiaoWang就是一个回调函数。
当函数A作为一个参数传给函数B并使用时,函数B被调用时,在函数B的函数体中则会调用函数A,就称函数A是一个回调函数。

更多推荐