본문 바로가기

전체 글77

몫 구하기 [JS] 문제 설명 정수 num1, num2가 매개변수로 주어질 때, num1을 num2로 나눈 몫을 return 하도록 solution 함수를 완성해주세요. 제한사항 0 2023. 5. 26.
두 수의 곱 [JS] 문제 설명 정수 num1, num2가 매개변수 주어집니다. num1과 num2를 곱한 값을 return 하도록 solution 함수를 완성해주세요. 제한사항 0 ≤ num1 ≤ 100 0 ≤ num2 ≤ 100 입출력 예 num1 num2 result 3 4 12 27 19 513 입출력 예 설명 입출력 예 #1 num1이 3, num2가 4이므로 3 * 4 = 12를 return합니다. 입출력 예 #2 num1이 27, num2가 19이므로 27 * 19 = 513을 return합니다. 단순 연산 문제다. '*' 곱하기 연산자를 이용하여 간단 해결! function solution(num1, num2) { var answer = num1*num2 return answer; } 2023. 5. 26.
나머지 구하기 문제 설명 정수 num1, num2가 매개변수로 주어질 때, num1를 num2로 나눈 나머지를 return 하도록 solution 함수를 완성해주세요. 제한사항 0 2023. 5. 26.
[TIL 2023.05.25] JavaScript 데이터 타입, 실행컨텍스트 목차 💻오늘 배운 내용 ❓발생한 이슈/고민 💡해결과정 📋레퍼런스 💻오늘 배운 내용 데이터 타입의 종류 데이터 타입은 크게 기본형과 참조형 2가지로 나뉘는데 구분 기준은 **값의 저장 방식**과, **불변성 여부**이다. 복제의 방식 기본형 : 값이 담긴 주소값을 바로 복제 참조형 : 값이 담긴 주소값들로 이루어진 묶음을 가리키는 주소값을 복제 불변성의 여부 기본형 : 불변성을 띔 참조형 : 불변성을 띄지 않음 /** 선언과 할당을 풀어 쓴 방식 */ var str; str = 'test!'; /** 선언과 할당을 붙여 쓴 방식 */ var str = 'test!'; ⬇ 위를 예제로 값이 들어간다면 주소 … 1002 1003 … 데이터 str/@5002 주소 … 5002 5003 … 데이터 test! 표와.. 2023. 5. 26.
[TIL 2023.05.24] ES6, 일급객체로서의 함수, Map과 Set 💻오늘 배운 내용 ES6 2015년도에 대규모 문법적 향상 및 변경이 있었기 때문에, ES6가 항상 언급이 되곤 한다. let, const의 등장 var: 재할당, 재선언은 가능 let: 재할당은 가능하고, 재선언은 불가 const: 재할당, 재선언이 불가능, 초기값이 없으면 선언 불가능 기존에 변수 선언을 위해 존재하던 var를 대체해서 나온 변수 선언에 사용 되는 키워드 화살표 함수 (Arrow Function) 삼항 연산자 (ternary operator) 구조 분해 할당 (Destructuring) 단축 속성명 (property shorthand) 전개 구문 (Spread) 나머지 매개변수(rest parameter) 템플릿 리터럴 (Template literals) 일급 객체로서의 함수 다른 객.. 2023. 5. 25.
[TIL 2023.05.23] TIL 쓰는법, JavaScript 조건문, 비교문 💻오늘 배운 내용 TIL을 유익하게 쓰는법 ‘문시해알’ “내가 엊그제, 어제 뭘 배웠는지 설명할 수 있는가?” 어떤 문제가 있었는지 내가 시도해 본 것들 (🌟자세히!) 어떻게 해결했는지 새롭게 알게된 내용 (🌟자세히!) 번외,팁) 프론트엔드 지망생일 경우 모든 것을 전부 꾸며라. 배포포함 ❗ 주의, ‘해야한다’가 아닌 ‘권장’일 뿐 블로그를 꾸미는 것이 중요한 것이 아니다. 지금 당장 내가 해야하는 일에 소홀하면 안됨. nodemon, codesnap VScode에 새로운 익스텐션을 추가했다. nodemon - 매번 터미널에 명령어를 입력하지 않아도 새로고침 시 자동으로 값을 보여줌 codesnap - 간편한 코드캡쳐 기능 깔끔하고 보기 좋다. JavaScript 어제에 이어서 이론 공부. 화살표 함수와.. 2023. 5. 24.
[TIL 2023.05.22] JavaScript 특징과 기본 문법 💻오늘 배운 내용 자바스크립트 특징 및 기본 문법 JavaScript JS 언어의 특징 [1] 객체 지향 프로그래밍 지원 자바스크립트는 객체 지향 프로그래밍이 가능한 언어로서, 객체를 생성하고 관리하는 데에 강점이 있다. 이를 통해 복잡한 기능을 구현할 수 있다. [2] 동적 타이핑 런타임 시점에 변수에 할당되는 값에 따라 자동으로 데이터 타입이 결정된다. [3] 함수형 프로그래밍 지원 자바스크립트는 함수형 프로그래밍을 지원하는 언어로서, 함수를 일급 객체로 취급하고, 고차 함수를 지원한다. 이를 통해 코드의 재사용성과 가독성을 높일 수 있다. [4] 비동기 처리 작업을 순차적으로 기다리지 않고, 병렬로 처리할 수 있도록 하는 방식. [5] 클라이언트 측 및 서버 측 모두에서 사용 가능 클라이언트 측에서.. 2023. 5. 23.
[WIL 2023.05.21] 내배캠 1주차 Situation(상황): 이번주 목표 팀프로젝트 (팀소개 페이지 만들기) 우리팀 인원은 총 5명으로, 페이지에 각자의 카드를 생성해서 모달창 팝업형식으로 소개내용을 띄우기로 했다. 내 역할은 팀원 개별 소개 페이지 HTML / CSS / JS 작성 개인적으로 그저 팝업되는 카드가 아닌 스무스한 동작을 추가하여 열리게 하고 싶었다. 어떻게 구성을 해볼까 고민하다가 transition과 자바스크립트를 이용하면 할 수 있을 것 같았다. Task(임무): situation 중 문제들 협업의 꽃, GIT활용 저번주에도 협업의 경험은 있었지만 그때는 git에 대해 전혀 모르던 상태여서 slack을 통해 각자 파일을 전달하면서 합텨가며 작업을 했었는데 너무 번거롭고 구분이 어려운 문제가 있었다. 프로젝트 전에 특강.. 2023. 5. 22.
[TIL 2023.05.19] 팀소개 프로젝트 마무리&발표 💻오늘 배운 내용 RESTful API? REST(Representational State Transfer)의 약자로 자원을 이름으로 구분하여 해당 자원의 상태를 주고받는 모든 것을 의미합니다. HTTP URI(Uniform Resource Identifier)를 통해 자원(Resource)을 명시하고, HTTP Method(POST, GET, PUT, DELETE, PATCH 등)를 통해 해당 자원(URI)에 대한 CRUD Operation을 적용하는 것을 의미합니다. CRUD Operation이란 Create : 데이터 생성(POST) Read : 데이터 조회(GET) Update : 데이터 수정(PUT, PATCH) Delete : 데이터 삭제(DELETE) REST 구성 요소 REST는 다음과 같.. 2023. 5. 19.
[TIL 2023.05.18] 팀소개 프로젝트 오류수정 ❓발생한 이슈/고민 💡해결과정 서버와 합치는 과정에서 이전과 같은 문제가 발생!😱 동적으로 추가되는 카드라서 형제요소를 찾지 못한 것이 원인이었다. card.innerHTML = temp_html; // 컨테이너 생성 및 카드 추가 const container = document.createElement('li'); container.classList.add('card-container'); container.appendChild(card); list.appendChild(container); $('.js-click-modal').click(function () { const container = $(this).closest('.card-container'); container.addClass('moda.. 2023. 5. 19.
[TIL 2023.05.17] CSS와 jQuery에 대한 이해와 .env…? 💻오늘 배운 내용 jQuery CSS trasition .env? 📖 jQuery 길고 복잡한 자바스크립트 문법을 손쉽게 코딩하도록 간소화한 자바스크립트 라이브러리. 여러 브라우저에서 동작하는 사용하기 쉬운 API를 통해 HTML 문서 탐색과 조작 이벤트 처리 애니메이션 Ajax 등을 훨씬 더 간단하게 만들어준다. jQuery 써서 html 변경하려면 안녕 이렇게 코드 양이 절반으로 줄어들어서 쓰는 것이다. $ 이건 querySelector와 동일하게 사용하면 된다. jQuery 써서 스타일 변경하려면 안녕 이러면 css 스타일 변경이 가능하다. (주의) html 셀렉터로 찾으면 html 함수들을 뒤에 붙여야하고 jQuery 셀렉터로 찾으면 jQuery 함수들을 뒤에 붙여야 잘 된다. $('어쩌구').i.. 2023. 5. 19.
[TIL 2023.05.16] 팀프로젝트 css 수정과 내 컴퓨터의 이미지 파일을 링크화 하기 💻오늘 배운 내용 CSS : cubic-bezier post images에 이미지 업로드해서 링크 만들기 ❓발생한 이슈/고민 여전한 repository 연동 이슈. mian에 있는 파일들을 내 branch에 pull 해오고 싶었는데 왜인지 오류가 났다. 가져오지를 못해! 모달창 내 요소들이 좌측에 몰려있다, 그리고 수직으로 정렬되어 있는 것이 마음에 들지 않았다. 이미지와 팀원소개 텍스트를 나란히 놓고 싶다! 어제 만들었던 모달창 애니메이션 기능이 마음에 들지 않았다 클릭해서 위로 올라오는 모션까지는 좋지만 브라우저 창 전체를 덮어버린 것이 불만! 올라오는 애니메이션이 실행되면서도 페이지 타이틀은 계속 보이게 하고 싶었다. 💡해결과정 main의 파일들을 가져오려하니 “refusing to merge un.. 2023. 5. 19.