실행: https://codepen.io/ffuqgvsz/pen/rNavNrw 가위바위보게임 ... codepen.io 공부: object.entries(객체)로 객체를 배열모양로 바꿀 수 있습니다. 배열.find는 반복문이지만 원하는 것을 찾으면(return이 true) 멈춥니다. ※ 1차원 배열에서는 indexOf를 주로쓰고 2차원 배열에서는 find(), findIndex()를 주로쓴다. 배열 .includes로 || 관계를 줄일 수 있다. DOCTYPE html> 가위바위보 #computer { width: 208px; height: 218px; background: url("https://steemitimages.com/640x0/https://steemitimages.com/DQmVDkcxCx..

동기(Synchronous : 동시에 일어나는) 요청과 결과가 동시에 일어난다는 약속이다. 동기방식은 설계가 매우 간단하고 직관적이지만 결과가 주어질 때까지 아무것도 못하고 대기(Blocking)해야하는 단점이 있다. 비동기(Asynchronous : 동시에 일어나지 않는) 요청과 결과가 동시에 일어나지 않을거라는 약속이다. 동기보다 복잡하지만 결과가 주어지는데 시간이 걸리더라도 그 시간 동안 다른 작업(Non-Blocking)을 할 수 있으므로 자원을 효율적으로 사용할 수 있는 장점이 있다. 콜백함수("call" + "back") 콜백함수는 자바스크립트의 비동기성을 표현하고 관리하는 가장 일반적인 기법이자 가장 기본적인 비동기 패턴이다. 즉, 콜백함수가 실행됐다는 것으로 요청한 작업이 끝났음을 알리고,..

실행: https://codepen.io/ffuqgvsz/pen/eYmrYLW DOCTYPE html> 야구게임 숫자 4자리를 입력하시오. 기회가 4번 남았습니다. 확인 다시 풀기 var h1 = document.querySelector("h1"); var form = document.querySelector("form"); var input = form.querySelector("input"); var resetBtn = form.querySelector(".reset"); var numArray; // 1~9 숫자 배열 변수 var randomArray; // 랜덤 숫자 4개 담을 배열 변수 var count; // 카운트 변수 var chance; // 기회 변수 function getNumber(..

클로저란? 클로저는 내부 함수가 정의될 떄 외부 함수의 환경을 기억하고 있는 내부 함수를 말합니다. 외부 함수 안에서 선언된 내부 함수는 그 외부 함수의 지역 변수나 함수에 접근하여 사용할 수 있습니다. 클로저 함수의 기본 형태 // 외부 함수 function closuer() { // 변수 정의 var count = 0; // 내부 함수(클로저) 선언 function inner() { return ++count; } // 내부 함수 반환 return inner(); } // 익명 함수를 이용한 방법 function closure() { var count = 0; // 익명 함수(클로저) 반환 return function() { return ++count; } } 클로저 함수 사용 예시 function ..

여기 저기 jQuery를 이용한 사이트의 코딩을 보면, $(function(){}); 이라고도 많이 사용하는데 $(document).ready(function(){});와 동일한 의미입니다. $(document).ready(function(){}); 이것이 jQuery를 사용하기 위한 기본 문법입니다. 정확히는 DOM(Document Object Model) 객체가 생성되어 준비되는 시점에서 호출된다는 의미입니다. JS와 비교하자면 document.onload()... 와 거의 비슷하다고 생각하면 되고, html 문서가 로딩이 되면...이라는 느낌으로 이해하시면 됩니다.