9장 이차원 배열 다루기_틱택토 게임

1. 프로그램 제작에서 새로 배운 것들


1) 이차원 배열

  • 배열 요소가 배열로 이루어져 있는 배열을 말한다.
  • 배열이 몇번 중첩됐는가에 따라 몇 차원 배열인지 정해진다.
  • 표와 비슷한 모양이라 실무에서 많이 사용한다.

2) 구조분해 할당

  • 객체 내부의 속성과 할당하는 변수명이 같을 때 줄여 쓸 수 있다.
const { body } = document; // 아래를 이 식처럼 줄여 쓸 수있다.
const body = document.body; 

const array = [1, 2, 5];
const [one, two, five] = array; // 다음 세줄을 이 식으로 표현 가능
const one = array[0];
const two = array[1];
const five = array[2];

3) 이벤트 버블링

  • 자식 태그에서 이벤트가 발생할 때 부모태그에도 동일한 이벤트가 발생하는 현상이다.
  • table > tr > td 구조에서 td 태그를 클릭하면 td 태그에 click 이벤트가 발생하고 tr, table로 전달된다.
  • event.target은 이벤트가 발생한 태그로 바뀐다. 이벤트를 연결한 태그에 접근하려면 evnet.currentTarget을 사용한다.

4) parentNode와 children

  • 현재 태그의 부모 태그를 찾으려면 태그.parentNode를 사용한다.
  • 자식 태그를 찾으려면 children 속성을 사용한다. 자식 태그는 여러개 일수도 있으므로 배열 모양의 값으로 반환되는데, 진짜 배열이 아니다.

5) rowIndex와 cellIndex

  • tr 태그는 몇 번째 줄인지 알려주는 rowIndex라는 속성을 제공한다.
  • td 태그는 몇 번째 칸인지 알려주는 cellIndex 속성을 제공한다.

6) 유사 배열 객체와 Array.from

  • children의 반환값과 같은 배열 모양의 객체를 유사 배열 객체라고 한다.
  • Array.from(유사 배열 객체)를 사용하면 배열로 바꿀 수 있다.

7) every와 some

  • 배열에서 모든 값이 조건에 해당되는지 판단하려면 every 메소드를 사용한다.
  • 하나라도 조건에 해당하는지 판단하려면 some 메소드를 사용한다.
배열.every(조건 함수);
배열.some(조건 함수);
  • every는 하나라도 조건을 만족하지 안으면 반복을 중단하고, some을 하나라도 조건을 만족하면 반복을 중단하므로 효율적이다.

8) flat

  • 배열의 차원을 한차례 낮춰주는 메소드이다.
  • 이차원 배열을 일차원 배열로 바꾸어준다.
  • 일차원 배열은 그대로 일차원 배열이 된다.

2. 복습코딩




좋은 웹페이지 즐겨찾기