防抖和节流的真实使用场景，和代码怎么写

防抖和节流都是为了优化前端页面性能而出现的技术。

防抖是指在短时间内多次触发同一个事件，只执行一次函数，常用于输入框输入事件和按钮点击事件，以避免用户频繁触发事件造成性能浪费。例如，用户在输入框中输入内容，我们可以设置一个时间阈值，只有当用户输入完成并在规定时间内没有再次输入时才会触发相应事件。

节流是指在一定时间内只执行一次函数，常用于滚动事件和窗口调整事件，以避免事件被频繁触发造成页面卡顿。例如，我们可以设置一个时间阈值，在规定时间内只执行一次函数，这样可以有效减少事件被触发的次数。

下面是一个防抖的实现代码：

function debounce(func, delay) {
  let timer = null;

  return function() {
    const context = this;
    const args = arguments;

    clearTimeout(timer);
    timer = setTimeout(() => {
      func.apply(context, args);
    }, delay);
  };
}

下面是一个节流的实现代码：

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

  return function() {
    const context = this;
    const args = arguments;

    if (!timer) {
      timer = setTimeout(() => {
        func.apply(context, args);
        timer = null;
      }, delay);
    }
  };
}

以上代码是基于原生 JavaScript 实现的，你可以根据自己的需要进行调整。