yuhun do IT

form에서 버튼을 클릭하거나 엔터를 누르면 기본적으로 submit가 실행된다. (비슷하게 기본 예로 a 태그를 클릭하면 link로 이동한다.) const hello = (evnet) => { // 자바스크립트의 함수는 기본적으로 첫번째 인자를 가지고 있고 관례상 event라 사용. event.preventDefault() // 기본 동작을 막는 함수. }; 위와 같이 자바 스크립트에서는 기본 인자가 있고 이는 여러 정보를 담고 있다. 이 인자는 관례적으로 event라 사용한다. ​ event 인자의 메서드 중 preventDefault()는 브라우저 상에서 작동하는 기본 동작을 제한하는 기능을 한다. 예를 들어 form에서는 submit 하지 않고 a 태그의 링크에서는 링크로 이동하지 않는다.

DOM 은 문서 객체 모델로 자바스크립트에서 모든 요소를 객체로 보는 것이다. queruSelector도 DOM을 기반으로 한 것이고 DOM을 이용해 모든 요소에 접근 및 수정이 가능. ​ 이를 이용해 원하는 요소를 추가하거나 제거할 수 있으면 변경도 가능한데 아래 간단한 예제가 있다 ​ 노드 추가 및 연결 부모노드.appendChild(자식노드); const newElementNode = document.createElement(노드 이름); const newTextNode = document.createTextNode(텍스트); // 텍스튼노드는 요소노드에 appendChild로 연결 가능 const newAtrribute = documnet.createAttribute(속성명); 요소명.setAtt..

addEventListener addEventListener는 요소에 이벤트를 추가해 줄 수 있다. example을 querySelector로 받아왔다고 가정하고 아래와 같이 작성 가능하다. example.addEventListener("click", 함수이름 ); 중요한 건 함수 이름을 쓸 때 ()를 쓰지 않는 것이다. classList (add remove toggle) 대표적 사용으로 요소의 이벤트가 일어났을 때 css style 변경에 사용 가능하다. className은 class 전체를 바꾸지만 classList를 사용하면 부분적으로 수정이 가능해 이용할 수 있다. add 와 remove의 사용 예로는 아래와 같다. if(example.classList.contains(클래스 이름)){ exam..

parseInt 는 string의 숫자 "123456"을 number인 123456으로 바꿔주는 역할을 한다. 이는 비교 ===를 할 때나 연산을 할 때 각각 다른 결과를 리턴함으로 주의할 필요가 있다. (파이썬에서 int()나 str()을 생각하면 된다.)​ isNaN은 숫자인지 판별하는 Boolen 함수이다. is Not a Number 의 줄임말. isNaN에 숫자가 아닌 것을 argument로 주면 false를 리턴하고 숫자라면 True를 출력한다.

css는 변수를 사용할 수 없는 줄 알았는데 사실 가능하다. 아래 예를 보자 :root { —-text—color : #fff; } #id { color : var(—text-color); } 자바 스크립트에서 자료형에 null 값을 줄 수 있는데 이건 정의하지 않은 undefined와는 다르다. null은 의도적으로 아무것도 없음을 표현한 것이다. 할당만 되고 빈 공간인 undefined와는 구별되어야 한다. 자바 스크립트뿐 아니라 다른 언어도 같은 맥락이다.

visibility는 내가 고민하던 부분을 해결해 준 속성이다. opacity를 이용하면 눈에 보이지는 않지만 클릭이 되는 불편함이 있었는데 이걸 visibility를 사용하면 눈에 보이지 않을 땐 아예 없는 것처럼 보이고 보일 땐 클릭이 가능한 요소를 만들 수 있었다. ​ transform-origin은 요소의 transform 기준점을 잡아준다. 이를 이용해 조금 더 쉬운 위치 설정이 가능하다.

inline 요소를 연속으로 배치하면 사이에 공간이 생긴다. 코딩할 때에는 전혀 문제가 없어 보이지만 웹 페이지를 보면 까닭 모를 여백이 생기는데 이는 font-size 때문이다. 해결은 font-size를 0으로 해주거나 display 속성을 이용해 block 요소로 바꾸어 줄 수 있다. img 태그를 배치할 때 애먹었다..

코딩 할 때는 상관 없어서 몰랐는데 막상 깃허브에 호스팅하니 제대로 작동이 안돼 고민하다 알게 되었습니다. ​ Html에서 경로를 지정 할 때 꼭 .을 붙여 주어야 한다. ./ 현재 경로 ../ 상위 경로 이 두가지로 시작해야 페이지에서 정상적으로 작동한다.. 그냥 / 쓰고 상대경로 쓰다가 괜히 고생했습니다..

자바스크립트에서는 html의 요소를 document를 통해 가져올 수 있다. 다양한 파라미터가 있지만 일단 기본은 querySelector를 통해 가져오는 방법이 주로 사용될 듯하다. *예외적으로 body 태그를 가져올 땐 document.body를 사용할 수 있다. ​ querySelector(".class #id ")처럼 css의 선택자처럼 사용하면 된다. getElementById() 같은 것도 있지만 앞의 것만 사용해도 무방하다. ​ +파라미터 중에는 HTML에서 표시되는 텍스트를 바꿀 수 있는 요소. innerText 가 있다. 참고로 window 객체를 이용한 것들도 있는데 더 공부가 필요하다.

풀이 def solution(numbers, hand): answer = '' current_left = [4, 1] current_right = [4, 3] location = {1: [1, 1], 2: [1, 2], 3: [1, 3], 4: [2, 1], 5: [2, 2], 6: [2, 3], 7: [3, 1], 8: [3, 2], 9: [3, 3], 0: [4, 2]} for num in numbers: if num == 1 or num == 4 or num == 7: answer += 'L' current_left = location[num] elif num == 3 or num == 6 or num == 9: answer += 'R' current_right = location[num] else..