티스토리 뷰

javascript/javascript30

[javascript30]Key Sequence Detection (KONAMI CODE)

소영 2021. 7. 16. 19:46
Key Sequence Detection (KONAMI CODE)

KONAMI CODE 란, 코나미의 비디오 게임들에서 나타나는 치트 코드의 일종으로, 일종의 속임수로 사용하는 방법이다. 사용법은 주로 특정한 조작을 하거나 특정한 문단을 입력해 사용된다.(라고 위키백과에 나와있다.)

 

숨겨진 암호를 키보드로 작성하면 숨겨진 무언가 나오는 그런..암호작성 코드이다.

 

1. .splice를 이용한 정해진 숫자갯수 배열에 넣기

2..includes를 이용하여 숨겨진 코드 포함한 문자열 확인하기 

3. cornify.com이라는 사이트에서 사용하는 cornify.js 사용해보기

 

코드
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Key Detection</title>
  <script type="text/javascript" src="https://www.cornify.com/js/cornify.js"></script>
</head>
<body>
<script>
  const pressed =[];
  const secretCode = 'wesbos';
  window.addEventListener('keyup',(e)=>{
    console.log(e.key);
    pressed.push(e.key);
    pressed.splice(-secretCode-1,pressed.length-secretCode.length);//splice(-7,1),음수를 지정할 경우에는 배열의 끝에서부터 요소를 센다 
    if(pressed.join('').includes(secretCode)){//.includes() 포함하는 문자열이 있는지 확인
      console.log('DING DING');
      cornify_add();//Conrnify사이트에서 쓰이는 유니콘js
    }
    console.log(pressed);
  })
</script>
</body>
</html>
알게된 문법
.splice()

.splice([처음 삭제할 요소],[몇개삭제할건지 숫자 적기])

처음 삭제할 요소에 음수(-)를 작성하면 배열의 끝에서부터 요소를 센다

위 코드에서는 배열의 끝에서부터 요소를 세었기 때문에 -7인 첫번째 요소가 계속 삭제가 된다.[.splice(-7,1)]

.includes

문자열이 있는지 확인하는 메서드

위 코드에서는 배열에서 ['w','e','s','b','o','s']인것을, .join('')으로 묶어 [wesbos]로 나오게 하여 .includes()로 문자열을 확인하였다.

 

 

'javascript > javascript30' 카테고리의 다른 글

[javascript30]LocalStorage and Event Delegation  (0) 2021.07.19
[javascript30]Object and Arrays - Reference VS Copy,얕은복사와 깊은복사  (0) 2021.07.19
[javascript30]Custom HTML5 Video Player  (1) 2021.07.16
[javascript30]Hold Shift to Check Multiple Checkboxes  (0) 2021.07.16
[javascript30]14 Must Know Dev Tools Tricks  (0) 2021.07.15
댓글