① 전체 카드 수는 total 변수에, 카드 색은 colors 변수에 배열로 저장합니다. 2장씩 색이 같으므로 총 6가지 색이 필요합니다. 색은 마음대로 골라도 되지만, 여기서는 빨간색(red), 주황색(orange), 노란색(yellow), 초록색(green), 하얀색(white), 분홍색(pink)을 선택합니다. 6가지 색은 앞면에 표시하고, 뒷면은 남색(navy)으로 통일합니다.
② 6가지 색의 카드를 복사해서 이어 붙이면 12장이 됩니다. colors에서 6가지 색을 두 번 복사해 colorCopy를 만들고, shuffle() 함수로 카드를 섞어 shuffled 배열로 만듭니다. 여기서 주목할 부분은 colors 변수를 수정하지 않고, 두 배열을 합쳐 하나의 새로운 배열을 만드는 concat() 메서드로 배열을 얕은 복사한 점입니다.
③ 카드 순서를 매번 다르게 무작위로 섞어야 합니다. 이 부분은 8.3절에서 배운 피셔-예이츠 셔플 알고리즘을 사용합니다.
④ 게임은 startGame() 함수로 시작합니다.
⑤ 게임을 시작하면 바로 카드를 섞고(shuffle()), 카드를 12개 생성(createCard())합니다. 생성한 카드는 $wrapper 태그 안으로 들어갑니다.
⑥ createCard() 함수는 카드의 인덱스(i)를 인수로 전달받아 shuffled 배열에서 카드 색을 가져오는 데 이용합니다. 카드 색은 태그의 backgroundColor 속성에 넣습니다.