26秋招前端 京东 1面

时长1h

• 自我介绍
• JS 有几种声明变量的方法？
• var、let、const 有什么区别？
• 什么是块级作用域？
• ES6 之前是否有块级作用域？如何用函数作用域模拟块级作用域？
• IIFE 的作用是什么？有什么优缺点？
• Promise 有哪些常用方法？
• Promise.all 的作用是什么？
• 如果其中一个 Promise 失败，其他 Promise 的结果能否拿到？
• 如何实现无论成功失败都拿到所有 Promise 的结果？
• Promise.race 的应用场景是什么？
• async/await 和 Promise 的关系？
• async/await 异常捕获有几种方式？
• await 等待的是什么？
• 为什么 async/await 可以写成同步风格？（生成器的原理）
• for 循环和 forEach 的区别？
• forEach 能否中断？
• for 循环中修改索引是否有效？
• for 和 forEach 处理异步函数的区别？
• 项目如何解决跨域问题？
• Nginx 代理的缺点？
• CORS 的完整流程？
• CORS 预检请求（OPTIONS）的作用？
• 什么情况下会发 OPTIONS 请求？每个跨域请求都会发吗？
• OPTIONS 请求检查哪些内容？
• Flex 布局默认主轴方向？
• flex: 1 的含义？
• flex-basis 可设置哪些值？
• 同时设置 width 和 flex-basis 哪个优先级高？
• max-width 和 flex-basis 的优先级？
• Vue 的 v-for 是否需要 key？
• 不设置 key 可能导致什么问题？除了性能问题？为什么数组会渲染错乱
• 能否用 index 作为 key？
• React 函数组件和类组件的区别？
• useEffect 空依赖数组模拟哪个生命周期？
• useEffect 无依赖数组时执行时机？
• 手写
• 实现一个 Hook：监听窗口尺寸变化并返回宽高，考虑性能优化

// 返回当前窗口的宽度和高度,考虑性能（节流）
const useGetClient = () => {
  const [width, setWidth] = useState(getClient().width);
  const [hight, setHight] = useState(getClient().hight);

  const handleResize = useCallback(
    throttle(() => {
      setWidth(getClient().width);
      setHight(getClient().hight);
    }, 300),
    []
  );

  useEffect(() => {
    window.addEventListener("resize", handleResize);

    return () => {
      window.removeEventListener("resize", handleResize);
    };
  }, [handleResize]);

  return {
    width,
    hight,
  };
};

function throttle(fn, delay) {
  let timer = null;

  return function (...args) {
    if (!timer) {
      timer = setTimeout(() => {
        fn.apply(this, args);
        timer = null;
      }, delay);
    }
  };
}

• 为什么用节流而非防抖？
• 反问