Nullish Coalescing을 사용하여 자바스크립트에서의 캐싱 처리하기

캐싱은 웹 개발에서 성능을 향상시키고 데이터 요청을 줄이는 데 중요한 요소입니다. 자바스크립트에서는 Nullish Coalescing 연산자를 사용하여 캐싱 처리를 간편하게 할 수 있습니다.

Nullish Coalescing 연산자는 ??로 표시되며, 왼쪽 피연산자가 null 또는 undefined인 경우에만 오른쪽 피연산자를 반환합니다. 이를 이용하여 캐시를 확인하고 데이터를 가져오는 부분을 간단하게 처리할 수 있습니다.

const cache = {
  data: null
};

function getData() {
  // 캐시된 데이터가 있는 경우, 캐시를 반환
  if (cache.data ?? false) {
    return cache.data;
  }
  
  // 캐시된 데이터가 없는 경우, 데이터를 가져와서 캐싱
  const newData = fetch("https://example.com/api/data");
  cache.data = newData;
  
  return newData;
}

위의 예제에서는 cache라는 객체를 생성하고, getData 함수에서 캐시된 데이터를 확인하고 캐싱되지 않은 경우 데이터를 가져와서 캐시에 저장합니다. ?? 연산자를 사용하여 cache.datanull 또는 undefined인 경우에만 newData를 반환하도록 처리하였습니다.

이렇게 구현하면 매번 데이터를 요청할 때마다 API 호출을 하지 않고, 캐시된 데이터를 사용하여 성능을 향상시킬 수 있습니다.

#캐싱 #JavaScript