[javascript] 선택 날짜가 기간 사이에 있는지 체크하는 함수 localeCompare

 

 # 해당 날짜를 선택했을때, 선택된 날짜 기준으로 live 화면인 리스트 출력

 

로직구현

👉  reconstruction/filters

 

/**
 * 시작날짜와 종료날짜를 계산해 오늘날짜가 기간 상에 있는지는 반환해줍니다
 * live : 기간안에 오늘날짜가 있는 경우
 * finish : 종료된 경우
 * ready : 준비중인경우
 * @param {*} startDate 시작날짜
 * @param {*} endDate 종료날짜
 * @param {*} today 오늘날짜
 * @returns
 */
export const CheckRange = (startDate, endDate, today) => {
  let endValue = today.localeCompare(endDate);
  let startValue = today.localeCompare(startDate);

  if (today === startDate?.substr(0, 10)) {
    return "live";
  }

  if (endValue > 0) {
    return "finish";
  }

  if (startValue < 0) {
    return "ready";
  }

  return "live";
};

 

사용예시

👉  index.vue

  import moment from "momnet";
  import { Category, CheckRange } from "@/reconstruction/filters";
  
  
  ...
  
  //사용로직
  let live = CheckRange(
    item.display_started_at, 
    item.display_ended_at,
    moment(new Date()).format("YYYY-MM-DD")
  );

 

localeCompare을 사용하여 [live,finish,ready] 로 상태값을 출력했다.

 

 

 

# localeCompare

localeCompare는 첫째인자와 두번째 인자를 비교해 앞, 뒤에 또는 같은지 여부를 나타내는 정수를 반환 합니다.

• referenceStr(예시에서 today) 이전에 발생 하면 음수
• referenceStr(예시에서 today) 이후에 발생 하면 양성
• 0동등하면 반환

 

 

👉 localeCompare 에 대하여

 

String.prototype.localeCompare() - JavaScript | MDN