JS 오목 게임 디스코드봇 만들기- 4

오늘은 오목판을 만들고, 그 오목판과 5줄을 확인하는 함수를 이용해서 5줄 확인하는 코드까지 짜보도록 하겠습니다.

일단, 오목판 만드는 코드를 미리 짜둔게 있는데요, 원리를 간단하게 설명하려고 썼는데, 설명을 뭐라할지 모르겠어서 그냥 올리겠습니다.

function makeSheet(x, y){
  let originalSheet = Array(y).fill("");

  for (let Y = 0; Y < y; Y++) {
    let u = ""

    for (let X = 0; X < x; X++) {
      if (Y == 0) {
        u += ((X == 0) ? ("┏") : (
          (X == x-1) ? "┓" : "┳"
        ))
      }

      else if (Y == y-1) {
        u += ((X == 0) ? "┗": (
          (X == x-1) ? ("┛") : "┻"
        ))
      }

      else {
        if (X == 0) u += "┣"
        else if (X == x-1) u +="┫"
        else u += "╋"
      }
    }

    originalSheet[Y] = u
  }

  return originalSheet.join("\n")
}

이런 코드인데요. 굉장히 드러워보여도 잘만 보면 해석 가능하십니다.

형성된 오목판은

makeSheet(19, 19) result

┏┳┳┳┳┳┳┳┳┳┳┳┳┳┳┳┳┳┓
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┗┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┛

// 아마도 블로그 글 상에서는 이상하게 보일껍니다...원래는 거의 정사각형 모양입니다.

이런식으로 출력하게 됩니다. 그리고 이 오목판은 [ [0,0,0,0,0,0,0,0,0.....], [0,0,0,0,0,0,0,0,0.....], [0,0,0,0,0,0,0,0,0.....], [0,0,0,0,0,0,0,0,0.....] .... ]
이런식으로 2차원 0과 1로 이루어진 배열을 만들어야하는데요, 그래서 짜봤습니다. 아주 간단하게 그냥 오목판을 split한다음 split된 각 오목판의 한 줄을 한 글자로 split 해버려서 map을 이용해서 타겟 돌과 문자열이 일치하면 1, 아니면 0으로 return 해서 다시 하도록 했습니다. 코드는

function makeOmokArray(omokSheet, dol) {
  return omokSheet.split("\n").map(a=>a.split("").map(a=>(a==dol)?"1":"0").map(Number))
}

이렇게 됩니다.

그러면 이제 테스트를 하기 위해서 아래와 같이 코드를 작성 후 코드를 돌려보겠습니다.

const omokSheet = 
`┏┳┳┳┳┳┳┳┳┳┳┳┳┳┳┳┳┳┓
┣╋╋╋╋╋╋╋╋╋○╋╋╋╋╋╋╋┫
┣╋╋╋╋●╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋○╋●╋╋╋○╋╋╋╋╋╋╋┫
┣╋╋╋○╋╋●╋○╋○╋╋╋╋╋╋┫
┣╋╋╋○╋○╋●○╋╋╋╋╋╋╋╋┫
┣╋╋╋╋○╋╋╋●╋○╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋○╋╋╋╋╋╋╋╋┫
┣╋╋╋○○○╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┣╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋╋┫
┗┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┻┛`

function makeOmokArray(omokSheet, dol) {
  return omokSheet.split("\n").map(a=>a.split("").map(a=>(a==dol)?"1":"0").map(Number))
}

function checkFulfill(omokTwoArray) {
  let result = false
  for (let omokArrayIndex in omokTwoArray) {
    omokArrayIndex = Number(omokArrayIndex)
    let omokArray = omokTwoArray[omokArrayIndex];
    for (let omokIndex in omokArray) {
      omokIndex = Number(omokIndex)
      let parsedOmok = {
        lr: [],
        rl: [],
        vertical: [],
        horizontal: omokArray
      };
      for (let i = 0; i < 5; i++) {
        const nowOmok = omokTwoArray[omokArrayIndex + i];
        parsedOmok.lr.push(nowOmok ? nowOmok[omokIndex + i] : 0);
        parsedOmok.rl.push(nowOmok ? nowOmok[omokIndex - i] : 0);
        parsedOmok.vertical.push(nowOmok ? nowOmok[omokIndex] : 0);
      }
      if (parsedOmok.lr.join("").includes("1".repeat(5))) {
        result = "lr";
      }
      if (parsedOmok.rl.join("").includes("1".repeat(5))) {
        result = "rl";
      }
      if (parsedOmok.vertical.join("").includes("1".repeat(5))) {
        result = "vertical";
      }
      if (parsedOmok.horizontal.join("").includes("1".repeat(5))) {
        result = "horizontal";
      }
    }
  }
  return result
}

console.log(checkFulfill(
  makeOmokArray(omokSheet, "●")
))

// result : "lr"

console.log(checkFulfill(
  makeOmokArray(omokSheet, "○")
))

// result : false

네 정상적으로 원하는 값이 나옵니다.

이제 함수를 이용해서 x, y값과 돌 값을 이용해서 원하는 칸에 돌을 두는 함수를 구현해보겠습니다.

이처럼 x값과 y값을 받도록 하겠습니다. 이게 배열 인덱스 값을 하나하나 표현하면 위 그림과 같이 나와서 코드 짜기도 편합니다(?)
이를 이용해서 함수를 구현해보면,

function addDol({
  omokSheet,
  x,
  y,
  dol
}) {
  const omokSheetArray = omokSheet.split("\n");
  const xArray = omokSheetArray[y].split("")
  xArray[x] = dol 
  
  omokSheetArray[y] = xArray.join("")
  
  return omokSheetArray.join("\n")
}

정상적으로 작동합니다. 오늘은 여기까지.