foreach()
-
JavaScript 입문 : 카드맞추기 게임 - 카드뒤집기(setTimeout( )이용), 클릭이벤트 (onclickCard 함수) 만들기 (1)컴퓨터 알아가기/JavaScript 2022. 10. 5. 19:30
이 글은 제로초 TV의 자바스크립트 강좌를 기본으로 공부하고 있습니다. 이제부터는 일정시간을 두고 카드를 뒤집는 자바스크립트를 만들어 볼 예정이고 에러없이 작동한다면 각각 카드를 클릭할 수 있는 클릭이벤트 기능을 넣을 차례입니다. 1. 카드 뒷면 보여주기 일정 시간 동안 카드의 뒷면을 보여주는 script를 작성합니다. 한꺼번에 뒤집을 수 있지만 시각적 효과를 위해서 1초후 첫 카드가 뒤집히면서 이후 0.1초 간격으로 전체 12장의 카드를 뒤집도록 하겠습니다. 시간이 들어간다는 이야기는 setTimeout( ) 함수를 활용합니다. startGame( ) 함수내에 작성해야 되겠죠. 4개의 태그 중 전체 프레임을 나타내는 container 클래스명을 기준으로 움직이며 지난시간 공부했던 add( ) 메소드를 ..
-
JavaScript 입문 : Array.from( )컴퓨터 알아가기/JavaScript 2022. 8. 20. 19:30
자바스크립트에서 Array.from( ) 메소드는 유사배열객체 (array-like object)나 반복가능한 객체(iterable object)를 from( ) 괄호 안에서 복사해 Array로 반영한 새로운 배열을 만듭니다. 예제를 가지고 이해를 하는편이 빠를듯 합니다. from( )안에 수식을 사용할 수도 있습니다. Array.from( ) 메소드가 배열로 결과값을 내는 원리를 착안하여 배열에서만 사용할 수 있는 메소드 등을 사용할 수 있게합니다. 예를 들어 forEach( ) 메소드 같은 경우입니다. HTML에서 부모와 자식간의 간단한 예인 테이블을 가지고 예를 들어 보겠습니다. 다음과 같은 3 by 3 테이블은 바로 밑에 childrenNode가 입니다. 콘솔에서 보면 다음과 같이 나옵니다. 3개..
-
JavaScript 입문 : forEach( )함수 메소드컴퓨터 알아가기/JavaScript 2022. 4. 13. 19:30
이 글은 제로초 TV의 자바스크립트 강좌를 기본으로 하고 있습니다. 오늘은 자바스크립트 반복문 대신 사용할 수 있는 메소드를 기억해 보고자 합니다. 지난 시간까지 숫자 야구 게임에 대해 공부를 해 보았는데 출제자가 낸 answer의 4자리를 문제를 푸는 사람이 입력한 value 값과 비교한 것이 숫자 야구 게임의 기본이었습니다. 예를 들어 출제자가 낸 정답이 [4, 5, 6, 7]이고 입력한 value 값이 4689 면 1 스트라이크 1볼로 화면에 표시되겠죠. 이 부분에 대한 JS 내역은 다음과 같이 만들 수 있을 겁니다. 상기 코드를 보면 for 문을 이용하여 answer.length 만큼 반복을 통하여 스트라이크와 볼의 갯수를 확인할 수 있습니다. 이 때 사용하는 for문 대신 forEach문으로 사..