호다닥

문제 풀이 홀수자리에는 '수'가 나와야하고, 짝수자리에는 '박'이 나와야한다. i%2는 홀수일 때는 값이 1이기 때문에 true, 짝수일때는 값이 0 이기 때문에 false가 된다. 따라서 true일때는 변수 answer에 '수'를 추가하고, false 일때는 '박'을 추가하도록 코드를 작성하면 된다. 다른 사람의 풀이 result 변수에 '수박'을 반복한 문자열을 선언한 다음, substring method를 통해 간단히 해결한 방법이다. str.substring(indexStart, indexEnd); indexStart는 출력되는 string에 포함될 첫번째 character의 index이다. indexEnd는 출력되는 string에서 제외될 첫번째 character의 index이다. (생략가능하다..

Flexbox layout은 container 내부 items에게 공간을 효율적으로 나눠주기 위한 module의 일종으로 내부 items의 크기를 모르거나 동적으로 작동할 때마저 적용이 가능하다. flex container는 items을 사용가능한 공간에 확장시키거나 overflow를 막기 위해 감추는 동작이 가능하다. 가장 중요한 점은 flex layout은 기존의 수직으로 작동하는 block이나 수평으로 작동하는 inline과 달리 방향을 정할 수 있다. flex-direction row : 기본설정으로 왼쪽에서 오른쪽 방향이다. row-reverse : 오른쪽에서 왼쪽 방향이다. column : row와 같지만 위에서 아래 방향이다. column : row-reverse와 같지만 아래서 위 방향이다..

CSS display property display 프로퍼티는 layout 정의에 사용되는 중요한 요소이며 4가지 value를 가지고 있다. 1. block2. inline3. inline-block4. none 1. blockdisplay 프로퍼티 값이 block 레벨일 경우, 항상 새로운 라인에서 시작된다. 즉, 각 요소는 화면 크기 전체의 가로폭을 차지한다.width, height, margin, padding 프로퍼티 지정이 가능하다. block레벨 요소 내에 inline 레벨 요소를 포함할 수 있다. 2. inlinedisplay 프로퍼티 값이 inline 레벨일 경우, 새로운 라인에서 시작하지 않고 문장의 중간에 삽입이 가능하다. 즉, 줄을 바꾸지 않고 다른 요소와 함게 한 행에 위치한다.co..

CSS State 크롬 개발자도구에서 element를 선택하고 :hov를 클릭하면 states를 확인할 수 있다. 박스:hover 박스 위에 뭔가 올라가면(hover), property들이 적용된다. 박스:active 박스를 클릭할 때 property들이 적용된다. 박스:focus 폼이나 링크를 선택하거나 활성화시키면 property들이 적용된다. Transition Transition은 아래의 효과들이 자연스럽게 동작할 수 있게 부드럽게 처리해주는 기능이다. transition-property: all; → 어떤 효과에 대한 장면전환을 할 지 결정한다. all은 모든 그래픽 효과들이 동작하게 한다. transition-duration: 1s; → 장면전환이 1초에 거쳐 일어난다. 아래와 같이 한줄에 코..

Recursion을 사용할 때는 CallStack의 용량이 제한적이기 때문에 오류를 발생시킬 수 있다. ** "getElementsByClassName을 구현해봐라"는 문제 *순환함수 ,수학적 귀납법* 정리: func(int n)은 음이 아닌 정수 n에 대해서 0에서 n까지의 합을 올바로 계산하다. 증명: 1. n=0인 경우: n=0인 경우 0을 반환한다. 올바르다. 2. 임이의 양수 정수 k에 대해서 n0 ※팩토리얼 함수에대해서 자세히 공부해보자

"ES6"ES5 - EcmaScript5ES6는 모든 기능이 브라우저에서 작동하는 건 아니다. 때문에 브라우저에서 구동하기 위해서는 ES5를 사용하는 것이 안전하다. ES6로 개발한 다음, ES5로 변환하는 방식으로 개발하기도 한다. ES dicuss ES6, 새로운 문법 let은 var와 다르다. let으로 변수 선언한 것은 block scope안에 갇히게 된다. let으로 변수 선언하면 if문 안에서만 사용할 수 있고, 외부에서 사용할 수 없다. let은 스코프 내에서 매번 생성되는 것이기 때문에 또 한가지 변수 선언하는 const가 있다. constatnt: 상수 - 변하지 않는 수이 때문에 const를 사용하여 선언한 것은 값을 재할당할 수 없다.const 또한 let과 마찬가..

버그 수정 1. querySelector는 CSS selector를 사용하기 때문에 class를 명시해주기 위해 container 앞에 '.'을 추가해줘야 한다. 2. getElementBy method를 className으로 가져오면 유사배열(html colleciton)을 return해주는데 유사배열에는 appendchild가 없다. element들이나 node들에만 있다. 3. hello 클래스는 하나 뿐이기 때문에 이런 문제를 해결해주기 위해 인덱스 값을 주어도 무방하다. 4. 또한 1~10까지의 숫자리스트를 만들기 위해서는 hello.length가 아닌 10으로 값을 변경해줘야한다. 5. newEl.textContent = ' ' + i + 1; 을 하면 빈문자열에 숫자를 더하면 문자열이 출력된..

Version Control 1. Repository : 소스코드를 저장하는 폴더 repository를 컴퓨터에 저장하면 깃은 파일을 체크하고 변경사항을 추적한다. 요약하면 repository는 폴더이고, 깃은 그걸 추적하는 시스템이라고 할 수 있다. 2. Commit : 파일 변경 기록 예를 들면, 헤더를 만들었다고 하면 '헤더를 만들었음' 혹은 '푸터 생성' 같은 변경사항이 있을 때 이 변경사항의 내용을 기록하는 것이 commit이다. commit은 깃이 기록한 변경사항 기록함이라고 할 수 있으며, 프로젝트의 상황창과 같은 것이다. 3. Branch : 처음 디폴트로 생성되는 것은 master이다. master branch에는 사용자의 모든 commit이 반영되어 있다. 마스터 브랜치는 마지막 작업 ..

hello() 함수가 실행될 때, 일반함수 호출방식으로 실행되었기 때문에 hello 함수의 this 값은 window이다. yellow 함수는 즉시 실행 함수이다. 즉시 실행 함수도 일반 함수 호출 방식이기 때문에 역시 window이며, jellow 또한 마찬가지이다. call은 javascript 함수의 method이다. call method는 첫번째 인자값으로 message라는 string을 받고,index 값이 2보다 작은 경우에는 false가 출력될 것이고, index값이 2부터는 true가 출력된다. filter라는 method는 return 값이 배열이다. 때문에 String 값 3,4를 가진 배열이 나오게 된다.call을 실행하면 바로 앞의 method가 실행된다. hasOwnProperty..

prototype REVIEW 생성자 함수(constructor)는 남편 프로토타입(prototype)은 아내 던더 프로토(__proto__)는 엄마 ken.toString(); // 모든 자바스크립트 객체는 자신에게 없는 속성은 자신의 엄마에게 가서 훔쳐씁니다.// ken에게는 toString이라는 메소드가 없습니다. 그래서 엄마에게(Person.prototype) 부탁해봅니다.// 켄의 엄마에게도 없습니다. 켄의 엄마는 자바스크립트 객체입니다.// 그렇기 때문에 켄의 엄마도 자신의 엄마(Object.prototype)에게 부탁해봅니다.// Object.prototype에는 toString이 있습니다.// 그리하여 켄은 외할머니의 toString을 훔쳐옵니다. Example #1 #106 코드가 실행되..