zeroCho 2강을 보며...

💡 배운 것 첫째, foreach와 return

끝말 잇기 프로그램을 만들다, 욕심이 생겨서 기능을 하나 추가했다.
바로, 이미 쓴 단어가 있으면 이를 처리해주는 기능이었는데,
python처럼 익숙하게 foreach문으로 썼는데 아무리 해도 true로만 반환되는 것이다!

⭐원인을 찾아보니 foreach문은 return을 하지 못한다는 것!⭐

역시, 욕심을 부리다 보면 남들보다, 더 좋은 것들을 알아갈 수 있다!😊

💡 배운 것 둘째, array[-1]

python처럼 array 배열의 마지막 원소를 이렇게 가져오려 했는데, 이 역시 안 되더라.
앞으로는 array[array.length - 1]의 형식으로 갖고 와야겠다.
(이는 상당히 많은 방식으로 구현할 수 있는데, 이 역시 포스팅 주제로 삼아야겠다)

이러한 깨달음 끝에, 오늘도 역시 동영상을 보지 않고 끝말잇기를 구현했다!

💡 순서도

💡 코드

const prevWord = document.querySelector(".prev-word");
const input = document.querySelector(".input-bar");
const btn = document.querySelector(".push-next-word-btn");
const result = document.querySelector(".result");
let wordArr = [];

/****** addEventListener Setting ******************/

input.addEventListener('keypress', (e) => {
    if (e.key === 'Enter') {
        inputValueHandler();
    }
})
btn.addEventListener('click',() => {
    inputValueHandler();
})

/**************************************************/


// 기존 단어가 이미 나왔는지 확인한다
function checkArr(val) {
    for (let each of wordArr) {
        console.log( each, val)
        if (each === val) return false;
    }
    return true
}

//기존 단어가 있으면 비교한다.
function checkCorrectWord(wordArr, val) {
    const arrLength = wordArr.length;
    if (!val.length) return -1;
    if (arrLength) {
        const lastWord = wordArr[arrLength-1];
        if (lastWord[lastWord.length-1] !== val[0]) return false;
    }
    if (checkArr(val) === false) return false

    wordArr.push(val);
    printLastWord();
    return true;
}

//게임을 종료 및 초기화시킨다.
function GameInitialization() {
    wordArr = [];
    printLastWord();
}

//event가 발생할 시 다음을 수행한다.
function inputValueHandler (e) {
    const check = checkCorrectWord(wordArr,input.value);
    if (!check) {
        alert("규칙에 어긋나는 단어입니다. 지셨습니다.");
        GameInitialization();
    } 
    else if (check === -1) {
        alert("입력하지 않으셨습니다. 다시 입력해주세요.")
    }
    input.value = '';
}

//시작 제시어 설정 및 기존 마지막 단어를 출력해준다.
function printLastWord() {
    const arrLength = wordArr.length;
    if (! arrLength) {
        prevWord.innerText = "시작할 단어를 입력해주세요!"
    } else {
        prevWord.innerText = `이전 단어: ${wordArr[arrLength - 1]}`
    }
}

//시작!
function Init() {
    console.log(wordArr);
    printLastWord();
}

Init();