본문 바로가기

전체 글76

내일배움캠프 12일차 : 알고리즘 문제 정리 알고리즘 문제를 풀다보면 '와... 이 사람은 이걸 어떻게 이렇게 생각했지?'라는 생각이 들 때가 많다. 나도 문제를 풀 수 있긴하나, 아직 기초적인것만 익숙하다보니 하드코딩으로 들어갈 때가 많은데, 앞으로는 내 문제를 풀었더라도 다른 사람의 풀이를 무조건 한개 이상 검토하고 정리하는 습관을 기르려한다. 문제 1각에서 0도 초과 90도 미만은 예각, 90도는 직각, 90도 초과 180도 미만은 둔각 180도는 평각으로 분류합니다. 각 angle이 매개변수로 주어질 때 예각일 때 1, 직각일 때 2, 둔각일 때 3, 평각일 때 4를 return하도록 solution 함수를 완성해주세요. 예각 : 0 직각 : angle = 90둔각 : 90 평각 : angle = 180제한사항0 angle은 정수입니다.fu.. 2024. 4. 30.
내일배움캠프 11일차 : 콜백지옥 해결 방법 동기/비동기 지난번에 정리하던 콜백함수를 동기/비동기와 함께 마저 정리하려 한다. 동기(synchronous) : 코드가 차례대로 실행되는 방식비동기(a + synchronous - async) : 실행중인 코드 완료와 상관 없이 다른 코드를 넘어가는 방식ex) setTimeout, addEventListner 등 - 콜백지옥을 해결하려면콜백 지옥 : 콜백 함수를 익명의 함수로 전달하는 과정이 반복 됨으로 엄청난 들여쓰기가 발생한 상황 - 가독성 안좋음, 수정도 어렵ex) 콜백지옥의 모습setTimeout( function (name) { var coffeeList = name; console.log(coffeeList); setTimeout( function (name) { .. 2024. 4. 29.
내일배움캠프 10일차 : Api 불러오기/검색 기능 구현 개인과제로 영화 검색 사이트 만들기를 진행했다. 아직 자바스크립트에 대한 기본이 제대로 잡혀있지 않고 개념과 매소드도 익숙지 않았기 때문에 온갖 인터넷을 뒤져 겨우 구현해 냈다. 아직 피드백 전이라 깔끔한 코드는 아니겠지만 우선 작동은 하기 때문에 다시 한번 내 것으로 만들기 위한 정리 작업을 하려고 한다. 카드 불러와서 화면에 나타내기 ///카드 불러오기 fetch(url, options) .then(response => response.json()) .then(data => { let rows = data['results']; rows.forEach((a) => { let mvTitle = a['ti.. 2024. 4. 28.
내일배움캠프 9일차 : 자바스크립트 콜백함수 위기가 찾아왔다. 콜백함수가 이해가 가지 않아 진도를 나가지 못하고있다. 빠르게 과제도 시작해야하는데 말이다... 우선은 여기에 최대한 콜백함수를 정리하면서 이해를 해보고 바로 과제를 시작해봐야겠다. 하다보면 되겠지..이해.. 콜백함수 : 다른 코드에게 인자를 넘겨줌으로써 제어권도 함께 위임한 함수ex) forEach, setTimeout -> 위임 받은 코드를 필요에 따라 적절한 시점에 실행 (제어권 가지고 있음) - 제어권1. 호출 시점 : 콜백함수 넘겨받은 코드는 콜백 함수 호출 시점에 제어권을 가짐setInterval(콜백함수, 시점);더보기ex) setInterval(function() {  -> 제어권 넘겨받은 코드      console.log(count);     if(++count > 4.. 2024. 4. 25.
내일배움캠프 8일차 : 자바스크립트 기본 문법 3 자바스크립트를 이해하기 위해 고군분투중이다. 적어도 내일중에는 과제를 시작해야할 것 같은데 아직 강의 전체를 이해하지 못해서 큰일이다. 그래도 앞쪽에 기초적인 부분을 재정립하고나니 이해가 가지 않던 부분을 이해하는데 더욱 도움이 되고있다. 기초를 다졌으니 심화 내용들도 빠르게 끝내보려한다. JS에서 객체 생성 방법중괄호를 통하여 객체를 생성각 속성 ',' 쉼표로 구분속성은 이름과 값을 가짐 (이름: 문자열, 값: 다양한 데이터 타입)객체 내부의 함수 메소드(method) - 속성의 값으로 함수 추가할 수 있음객체를 만들어 필요한 속성과 메소드를 추가하여 사용 객체의 value에 접근하는 방법 : 객체이름[key] ex) person[key] 배열배열 요소 접근 : 배열의 요소에 접근.. 2024. 4. 24.
내일배움캠프 7일차 : 자바스크립트 기본 문법 2 오늘도 자바스크립트 문법 강의를 들었다. 어제는 그래도 들을만하다고 생각했는데, 내용이 깊어질수록 쉽지 않은 것 같다. 이럴수록 더 기초에 집중해야한다는 생각이다. 기초중 이해가 되는 것들은 넘기고 이해가 가지 않거나 금방 잊어버릴 것 같은 것들을 여기에 적으며 다시 이해해보려한다. - 조건문 switch문 변수값에 따라 해당되는 case중 하나를 선택하여 실행한다. 각 케이스가 끝날 때 break로 끝맺어줘야 한다. let fruit = "사과"; switch (fruit) { case "사과": console.log("사과는 빨간색입니다."); break; case "바나나": console.log("바나나는 노란색입니다."); break; default: console.log("해당하는 과일이 없습.. 2024. 4. 23.
내일배움캠프 6일차 : 자바스크립트 기본 문법 오늘부터 본격적으로 자바스크립트 공부가 시작되었다. 확실히 지난주의 기초 강의들보다 깊게 공부하는 느낌인데 그래서 더 이해가 잘 가기도하고 어렵기도하다. 더 깊숙히 공부하기 전에 더 잘이해하기 위한 자바스크립트의 기본 문법들을 정리해보려한다. 모든 문법이 다 정리되어있지는 않고, 내가 부족하다고 생각하는 것들 위주로 뽑아왔기 때문에 꼼꼼하게 모든 문법을 확인하기 위해서는 다른 자료를 찾아봐야한다. - 변수 var : 선언 여러번 가능, 변수 덮어쓰기 가능 let : 선언 여러번 불가능, 변수 덮어쓰기 가능 const : 선언 여러번 불가능, 변수 덮어쓰기 불가능 -> 상수 사용할 때 사용 - 데이터 타입 숫자 지수형 숫자 -> 2.5e5 이런식으로 표현 NaN(Not a Number) - 숫자가 아님을 .. 2024. 4. 22.
내일배움캠프 5일차 : CSS flex속성으로 버튼 2개 가운데 정렬하기 어쩌다 보니 html과 CSS를 많이 활용하는 파트를 맡아 또 CSS를 활용하는 글을 쓴다. 이번에 발생한 문제는 margin을 통해 버튼 2개를 카드 중간에 가로로 가운데 정렬해서 나타냈으나, 내 컴퓨터가 아닌 다른 팀원의 컴퓨터에서는 정렬이 깨져서 나타나는 것이었다. 우선 내가 원하는 버튼의 모습이다. 버튼 한 개를 가운데 정렬했던 기억을 더듬어 아래와 같이 margin을 활용하여 버튼 두 개를 나란히 가운데 정렬을해보려했다. .showbtnarea { margin: 0px auto 0px auto; } .showbtnarea>button { margin: 0px 15px 0px 15px; } 우선 버튼 두 개를 로 묶어서 'showbtnarea'라고 class를 넣어준 뒤 마진 값을 주어서 구역 자.. 2024. 4. 19.