끄적끄적

재귀 함수 + 비동기

  const onSubmit = async () => {
    let response = await create_customer();
    if (response.status !== 200) {
      return onComplete(false, '수집 되지 않은 좌표가 있습니다');
    }

    const invalidMutualDistanceCustomers = response.data;
    response = await getMutualDistanceByTmapRecursive(invalidMutualDistanceCustomers);

    try {
      response = await create_route();
    } catch (error) {
      return onComplete(false, '경로 생성 실패');
    }

    return onComplete(true, '배차 완료');
  };

위의 코드는 submit 버튼을 누르면 동작하는 async 함수다.

고객을 생성하고 유효하지 않은 고객들(invalidMutualDistanceCustomers 배열)을 재귀 + 비동기 함수로 처리 하려한다.

setTimeout 대신 사용할 비동기 sleep 함수

const timeout = ms => new Promise(resolve => setTimeout(resolve, ms));

재귀 함수

  const getMutualDistanceByTmapRecursive = async (invalidMutualDistanceCustomers: Array) => {

    const customer: Array = invalidMutualDistanceCustomers.pop();

    if (customer === undefined) {
      return;
    }

    await timeout(800);

    const response = await getMutualDistanceByTmap(customer[0], customer[1]);
    const totalDistance = response.data.features[0].properties.totalDistance;
    const jsonMap = JSON.stringify(response.data);
    await save(customer[0], customer[1], totalDistance, jsonMap);
    await getMutualDistanceByTmapRecursive(invalidMutualDistanceCustomers);

  }

1. 배열을 하나씩 pop 해주고 배열이 하나도 없으면(customer === undefined) 재귀 함수 종료

2. await timeout(800) : 0.8초 뒤에 api를 호출해라(api 초당 제한)

3. tmap api 호출하고 저장한 다음 다시 재귀 함수(getMutualDistanceByTmapRecursive) 호출

결론 : 비동기 처리는 까다로우니 async, await를 많이 박자