본문 바로가기

자바스크립트

(8)
웹 게임을 만들며 배우는 자바스크립트 예제3 반응속도 var 스크린 = document.querySelector("#screen"); var startTime ; var endTime; var result = []; var timeout; 스크린.addEventListener('click', function() { if(스크린.classList.contains('waiting')) { 스크린.classList.remove('waiting'); 스크린.classList.add('ready'); 스크린.textContent = '초록색이 되면 클릭하세요'; timeout = setTimeout(function() { startTime = new Date(); console.log(startTime); 스크린.click(); }, Math.floor(M..
포로토타입과 프로토타입 상속 프로토타입 상속 [[Prototype]] 자바스크립트의 객체는 명세서에서 명명한 [[Prototype]] 이라는 숨김 프로퍼티를 갖습니다. 이 숨김 프로퍼티 값은 null이거나 다른 객체에 대한 참조가 되는데, 다른 객체를 참조하는 경우 참조 대상을 프로토타입이라 부릅니다. object에서 프로퍼티를 읽으려고 하는데 해당 프로퍼티가 없으면 자바 스크립트는 자동으로 프로토타입에서 프로퍼티를 찾음. -> 프로토타입 상속 let animal = { eats: 프로토타입 상속 [[Prototype]] 자바스크립트의 객체는 명세서에서 명명한 [[Prototype]] 이라는 숨김 프로퍼티를 갖습니다. 이 숨김 프로퍼티 값은 null이거나 다른 객체에 대한 참조가 되는데, 다른 객체를 참조하는 경우 참조 대상을 프로..
함수 심화학습, 객체 프로퍼티 설정 재귀와 스택 재귀의 베이스(base) 재귀 단계(recursive step) 재귀 깊이(recursion depth) : 가장 처음 하는 호출을 포함한 중첩 호출의 최대 개수 실행 중인 함수의 실행 절차에 대한 정보 : 실행 컨텍스트(execution context)에 저장. 실행 컨텍스트 : 함수에 대한 세부 정보를 담고 있는 내부 데이터 구조. 제어 흐름의 현재 위치, 변수의 현재 값, this의 값 등이 저장됨. 재귀(recursion) - 함수 내부에서 자기 자신을 호출하는 것을 나타내는 프로그래밍 용어, 함수가 자신을 호출하는 단계를 재귀단계(recursion step)라고 부릅니다. basis라고 불리는 재귀의 베이스(base)는 작업을 아주 간단하게 만들어서 함수가 더 이상은 서브 호출을 만..
웹 게임을 만들며 배우는 자바스크립트 예제2 inf.run/TAmq 웹 게임을 만들며 배우는 자바스크립트 - 인프런 본 강의에서는 자바스크립트를 활용해 프로그래밍하는 연습을 할 것입니다. 웹 게임인 구구단을 시작으로 끝말잇기, 숫자 야구, 틱택토, 로또 추첨기, 가위바위보, 지뢰 찾기, 카드 짝맞추기 게� www.inflearn.com 틱택토 var body = document.body; var table = document.createElement('table'); table.style.border=1; var cells = []; var rows = []; var turn = 'X'; var result = document.createElement('div'); var clickEvent = funct..
자료구조와 자료형 원시값의 메서드 원시값 원시형의 종류는 문자(string), 숫자(number), bigint, boolean, symbol, null, undefined 총 7가지 객체 프로퍼티에 다양한 종류의 값을 저장할 수 있습니다. {name: 'kim', age:1} 대괄호 {}를 사용해 만들 수 있음. 함수도 객체의 일종. 원시값을 객체처럼 사용하기 문자열이나 숫자와 같은 원시값을 다루어야 하는 작업이 많은데, 메서드를 사용하면 작업을 수월하게 할 수 있을 것 같다는 생각이 들었음. 그런데 원시값은 가능한 한 빠르고 가벼워야 함. 해결책 원시값은 원시값 그대로 남겨둬 단일 값 형태를 유지합니다. 문자열, 숫자, 불린, 심볼의 메서드와 프로퍼티에 접근할 수 있도록 언어 차원에서 허용합니다. 이를 ..
객체: 기초 객체 객체는 중괄호{...}를 이용해 생성. 키(key):값(value) 쌍으로 구성된 프로퍼티(property)를 여러 개 넣을 수 있음. 키 에는 문자형, 값에는 모든 자료형이 허용. let user = new Object(); // 객체 생성자 문법 let user = {}; // 객체 리터럴 문법 프로퍼티 삭제 let user = { name: "kim", age: 9, "likes birds": true, }; user.isAdmin = true; delete user.age; user.likes birds // error user["likes birds"]; 점 표기법, 대괄호 표기법 let user = { name: 'kim', age:1, }; let key = prompt(..
웹 게임을 만들며 배우는 자바스크립트 e.preventDefault() -> submit 은 새로고침이 기본. 기본 동작 하지마~ 배열 push : 마지막에 추가 pop : 마지막 것 뽑기 unshift : 처음에 추가 shift : 처음 것 뽑는 것 splice(위치, 개수) 숫자배열.join(''); -> 문자 문자.split() -> 배열 배열.indexOf(값) -> 값의 위치를 알 수 있어요 없으면 -1
웹 게임을 만들며 배우는 자바스크립트 예제 inf.run/TAmq 웹 게임을 만들며 배우는 자바스크립트 - 인프런 본 강의에서는 자바스크립트를 활용해 프로그래밍하는 연습을 할 것입니다. 웹 게임인 구구단을 시작으로 끝말잇기, 숫자 야구, 틱택토, 로또 추첨기, 가위바위보, 지뢰 찾기, 카드 짝맞추기 게� www.inflearn.com 끝말잇기 var 바디 = document.body; var word = document.createElement('div'); word.textContent = '호주'; document.body.append(word); var formInput = document.createElement('form'); document.body.append(formInput); var inputbox = document.creat..