lodash

중복되는 데이터를 처리할 때 쓴다고 함.

 

node js 말고도 cdn으로 사용 가능.

 

window.addEventListener('scroll', (e)=>{
  console.log(window.scrollY);
});

이거 스크롤 할 때 너무 실행주기가 짧아서

몇초마다만 실행시키게 지연 시키려고

 

로우대시, _ 말 그대로 로우대시의 기능 중 하나인데,

throttle() 직역으로 조절판이라는 뜻 인데 특정 시간마다만 실행되도록 조절해 주는 듯.

window.addEventListener('scroll', _.throttle(()=>{
  console.log(window.scrollY);
},1000));

이렇게 하면 아무리 호출해도 1초마다만 실행.

 

 

근데 난 이거 구현할 수 있을 듯

 

 

let isEventing = false;

window.addEventListener('scroll', ()=>{
  if(!isEventing){
    console.log(window.scrollY);
    isEventing = true;
    setTimeout(()=>{
      isEventing = false;
    },300);
  }
});

 

 

 

 

window.addEventListener("scroll", () => {
  if (!isEventing) {
    isEventing = true;


    console.log(window.scrollY);
    if (window.scrollY > 200) {
      gsap.to($badges, .3, {
        opacity : 0,
        display : 'none'
      })
    } else {
      gsap.to($badges, .3, {
        opacity : 1,
        display : 'block'
      })
    }



    setTimeout(() => {


      console.log(window.scrollY);
      if (window.scrollY > 200) {
        gsap.to($badges, .3, {
          opacity : 0,
          display : 'none'
        })
      } else {
        gsap.to($badges, .3, {
          opacity : 1,
          display : 'block'
        })
      }

	isEventing = false;
    }, 300);
  }
});

타임아웃 안에도 한번 실행해야 마지막으로 움직였을 때 스크롤값 가져와서 로직 할 수 있음..

 

lodash가 이런 식 인듯.