자바스크립트 코드리뷰

    this.raceParticipateCar = e.target[1].value.split(",");
    this.raceParticipateCar.forEach((element) => {
      if (!this.testCarNameSize(element)) {
        alert("5자 이하의 자동차 이름을 입력하세요.");
        return;
      }
    });

자동차명 배열을 순회하여 길이가 5를 초과하면 경고문을 띄우는 로직
그러나 return문이 동작하지 않는다. 왜그럴까??

바로 forEach에서 return은 현재 실행 중인 콜백 함수를 종료하는 것이고, forEach 자체를 종료시키진 않기 때문.

여기서 해결법 1.

    this.raceParticipateCar = e.target[1].value.split(",");
    for (const element of this.raceParticipateCar) {
      if (this.testCarNameSize(element)) continue;
      alert("5자 이하의 자동차 이름을 입력하세요.");
      return;
   }

for of를 사용한다.

더 좋은 해결법 2.

    const carNames = e.target[1].value.split(",");
    const invalidCarName = carNames.find(v => 			!this.testCarNameSize(v))
    if (invalidCarName) {
      alert("5자 이하의 자동차 이름을 입력하세요.");
      return;
    }
    this.raceParticipateCar = carNames;

find를 사용한다. -> 더욱 의미가 명확하며 코드가 깔끔해짐