목차 1. 문제 2. 시도 3. 결과 4. 배운점 1. 문제 TMDB와 연동해서 화면에 카드 출력하기 resopns.results(json으로 받아온 데이터)를 다루면 되겠구나! 2. 시도 그럼 이제 html에 붙여넣어보자. 사전캠프 4주차 강의 프로젝트에서 썼던 temp_html을 위치에 붙여넣는 코드를 스윽... 배열이 아래로 쭉 이어져서 옆으로 출력할 방법을 찾아야 했다. 혼자서 css를 건들자 다음과 같은 상황에 빠졌다. 아주 큰 문제?는 아니지만, 보기가 아주 불편한 상황. .card{}에서 margin을 빼면 그나마 나아지지만... card 생성시 for문을 돌려서 3개씩 끊어야 하나 하는 이 상황을 팀 회의 시간에 공유하였다. 선택 요구사항에 들어있던 grid를 css에 적용한 결과 페이지가..

목차 1. 학습 내용 2. 내용 정리 3. 예제 4. 생각 정리 1. 학습 내용 1. DOM의 기본 개념과 접근, 제어법 2. Class문법의 주요 개념(클래스, 인스턴스, getter, setter, 상속 등) 3. 클로저의 주 개념과 활용 2. 내용 정리 1. DOM (3) DOM(Document Object Modeling) 브라우저 내장 API(다른 시스템에 제공하는 기능의 사용을 도와주는 중간자) - HTML을 Js로 접근, 제어가 가능하다. DOM의 모든 node는 속성과 메서드를 가지고 있다.(Node : html태그와 텍스트, 속성등을 하나의 블록처럼 취급) 속성 : 해당 객체의 특성을 나타내는 값을 가져오거나 설정 메서드 : 해당 객체가 수행하는 작업을 나타내는 함 2. Class 클래스..

목차 1. 학습 내용 2. 내용 정리 3. 예제 4. 생각 정리 1. 학습 내용 문제에 대한 해결방법 프로그래머 : 최선의 방법을 찾아내는 능력이 필요하다. 학습 목표 : 기본 코딩 능력 탄탄하게 만들기 -> 문제에 대해 생각하는 능력 키우기 1. 콜백 함수의 개념과 예시 2. 콜백 함수의 제어권 3. JS비동기제어 코딩 이해, 활용 2. 내용 정리 (2) 제어권 1) 호출 시점에 대한 제어권 함수 호출시 -> 호출 주체, 제어권 : 사용 setInterval(Func,300) -> 호출주체, 제어권 : setInterval 2) 인자에 대한 제어 콜백 함수를 넘겨받은 함수에게 인자의 순서에 대한 제어권이 주어진다. 3) this 제어권을 넘겨받을 코드에서 this를 지정한 경우, 콜백 함수도 그 대상을..

목차 1. 학습 내용 2. 내용 정리 3. 예제 4. 생각 정리 1. 학습 내용 (1) 데이터 타입 심화 : (2) 실행컨텍스트 : (3) this : 2. 내용 정리 (1) 불변성과 가변성 -> 원시타입으로 저장한 정보는 가변성을 가져 원본도 영향을 받아 변한다. 불변성의 필요. undefined 1. 변수에 값이 지정되지 않은 경우 2. 해당 데이터가 존재하지 않는 경우 3. return 없거나 호출되지 않는 함수의 실행결과 null 1. '없다'를 명시적으로 표현 2. typeof null이 object인건 js자체 버그. 조심하기. 동등 연산자(==) -> console.log(n == undefined); // true 일치 연산자(===) -> console.log(n === undefined..

목차 1. 학습 내용 2. 내용 정리 3. 예제 4. 생각 정리 1. 학습 내용 es6으로 일어난 js대격변으로 사용가능해진 문법들, 일급객체(first-class-object)로서의 함수 사용, Map과 Set 2. 내용 정리 1. ES6 문법: let : 재할당을 허용하지만 재선언은 허용하지 않음 const : 재할당과 재선언을 모두 허용하지 않음 var : 재할당, 재선언 허용 / 호이스팅(선언이 스코프 최상단으로 끌어올려지는 듯한 현상) 화살표 함수 : 함수 선언, 특히 한 줄 반환 및 단일 매개변수 함수에 대해 간결한 구문을 제공 삼항 연산자는 : 조건문을 표현하는 간결한 방법을 제공 구조 분해 할당★ : 각각 순서와 키 중요도에 따라 배열과 객체 모두에 사용 객체의 단축 속성 이름을 사용하면 ..

목차 1. 학습 내용 2. 내용 정리 3. 예제 4. 생각 정리 1. 학습 내용 (1) 함수 함수를 선언하여 코드를 기능 단위로 묶어 재사용성을 향상 [1] 함수 정의 1_1 함수 선언문 function add(x, y) { return x + y; } console.log(add(2, 3)); // 5 1_2 함수 표현식 let add = function(x, y) { return x + y; } console.log(add(2, 3)); // 5 [2] 화살표 함수 function add(x,y){ return x+y } 원래의 함수 선언은 위와 같다. 그러나, es6 이후 js에서는... 2_1 기본적인 화살표 함수 - 선언이 간편해짐 let add1 = (x, y) => { return x + y..