面试题

275 阅读1分钟

1、将后端⽤户列表转换成前端⽤户列表,但只保留启⽤状态的⽤户。

function transform(users?: BackendUser[]): FrontendUser[] {
  if (!users) {
    return [];
  }


  const frontendUsers: FrontendUser[] = users
    .filter(user => user.disabled === false)
    .map(user => ({
      value: user.id,
      label: user.name,
    }));

  return frontendUsers;
}

2、利⽤弹窗 API Modal.confirm({ onOk: Function, onCancel: Function }) 封装⼀个 confirm 函数, 满⾜以下使⽤条件

type ConfirmOptions = {
  onOk?: () => void;
  onCancel?: () => void;
};

function confirm(options: ConfirmOptions): Promise<boolean> {
  return new Promise((resolve, reject) => {
    Modal.confirm({
      onOk: () => {
        if (options.onOk) {
          options.onOk();
        }
        resolve(true);
      },
      onCancel: () => {
        if (options.onCancel) {
          options.onCancel();
        }
        reject(false);
      },
    });
  });
}

3、实现⼀个计数器 hooks,执⾏该 hooks 返回 increase ⽅法和 count 状态,调⽤ increase 则 count ⾃增 1。在 MyComponent 组件中使⽤该⾃定义 hooks:点击 button 调⽤ increase,span 展示 count 值

// 自定义hooks
function useCounterCount() {
  const [count, setCount] = useState(0);

  const increase = () => {
    setCount(count + 1);
  };

  return { count, increase };
}