전체 글 195

[프로그래머스] 피자 나눠 먹기(1) 🍕

문제 머쓱이네 피자가게는 피자를 일곱 조각으로 잘라 줍니다. 피자를 나눠먹을 사람의 수 n이 주어질 때, 모든 사람이 피자를 한 조각 이상 먹기 위해 필요한 피자의 수를 return 하는 solution 함수를 완성해보세요. 해결 과정 처음에는 1. 피자 변수를 만든다. 2. 피자를 7조각으로 나눈다. 이런 식으로 접근을 했다. 다시 문제를 읽어보고 입출력 예 설명을 읽었다. 7명은 최소 1판 필요 1명은 최소 1판 필요 15명은 최소 3판 필요 24명일땐 최소 4판 필요 옆 사진 처럼 나눗셈을 이용해서 하면 소수점이 나온다. 8 % 7 = 1.xxx 소수점을 올려서 문제를 풀어보기로 했다. 소수점을 올릴때는 Math.ceil()을 이용한다. 소수점을 올리기위해서는 나누기할당을 이용해야한다. 그래서 아래..

[프로그래머스] 중앙값 구하기

문제 중앙값은 어떤 주어진 값들을 크기의 순서대로 정렬했을 때 가장 중앙에 위치하는 값을 의미합니다. 예를 들어 1, 2, 7, 10, 11의 중앙값은 7입니다. 정수 배열 array가 매개변수로 주어질 때, 중앙값을 return 하도록 solution 함수를 완성해보세요. 해결 과정 1. 배열이 임의로 주어질 수 있으니 정렬을 먼저한다. 자바스크립트의 함수 기능 중 .sort()를 통해서 정렬할 수 있으나 아직 입문 단계이기에 다른 방법으로 해결해보려 한다. 그렇다면 정렬을 하기 위해서 어떻게 해야할까? 1.1. 배열 중에서 최소 값을 찾는다. let minNum = 1000; let cnt = 0; while() { cnt = cnt + 1; } // 배열의 순서를 증가 시키기 위해 반복문을 활용한다..

[모던 자바스크립트 deep dive] 23장 실행 컨텍스트

실행 컨텍스트 실행 컨텍스트를 제대로 이해하면 다음과 같은 내용을 이해할 수 있다. 스코프를 기반으로 식별자와 식별자에 바인딩 된 값(식별자 바인딩)을 관리하는 방식 호이스팅이 발생하는 이유 클로저의 동작 방식 태스크 큐와 함께 동작하는 이벤트 핸들러 비동기 처리의 동작 방식 소스코드 타입 ECMAScript 사양은 소스 코드를 4가지 타입으로 구분 4가지 타입의 소스코드는 실행 컨텍스트를 생성 소스코드의 타입 설명 전역 코드(global code) • 전역에 존재하는 소스코드. • 전역에 정의된 함수, 클래스 등의 내부 코드는 포함 x 함수 코드(function code) • 함수 내부에 존재하는 소스코드. • 함수 내부에 중첩된 함수, 클래스 등의 내부 코드는 포함 x eval 코드(eval code..

[CSS 메모] 반응형 웹디자인 원칙

Fluid Layout(유동형 레이아웃) 현재 뷰포트 width (또는 height)에 적응하도록 웹페이지를 설정하려면 다음을 사용 레이아웃에 % (또는 vh / vw) 단위를 사용하여 뷰포트에 적응해야 하는 요소에 대해 px 대신에 사용 width 대신 max-width를 사용 Responsive Units 대부분의 길이에 대해 px 대신 rem 단위를 사용 전체 레이아웃을 자동으로 축소 (또는 확대)하는 것을 쉽게 만들기 위해 Flexbile Images 기본적으로 뷰포트를 변경할 때 이미지는 자동으로 크기가 조정되지 않으므로 이를 수정 이미지 차원에 대해 항상 %를 사용하고 max-width 속성과 함께 사용 Media Queries 특정한 뷰포트 너비(breakpoints)에서 CSS 스타일을 변..

📦 CSS/메모 2024.02.07

[HTML 메모] alt text

alt text는 주로 이미지를 묘사하기 위해 쓰인다. alt text의 2가지 목적 접근성: 이미지를 볼 수 없는 사람들에게 이미지가 묘사하는 것을 이해할 수 있게 텍스트로 제공해준다. 실패 상태: 이미지가 로드되지 않았을때 텍스트 대안이 페이지에 표시된다. alt text의 흔한 실수 alt 속성 없는 경 애매모호한 alt 작성했을 경우 지나치게 자세히 작성할 경우 alt text는 이미지를 설명해야 한다. 출처: https://www.craigabbott.co.uk/blog/how-to-write-good-alt-text-for-screen-readers/ How to write good alt text for screen readers What is alt text? Why it matters. ..

🖥️ HTML 2024.02.06

[모던 자바스크립트 deep dive] 21장 this

this 키워드 동작을 나타내는 메서드는 자신이 속한 객체의 상태 -> 프로퍼티를 참조하고 변경 가능해야 한다. 메서드가 자신이 속한 객체의 프로퍼티를 참조하려면 자신이 속한 객체를 가리키는 식별자를 참조 가능해야한다. const circle = { // 프로퍼티: 객체 고유의 상태 데이터 radius: 5, // 메서드: 상태 데이터를 참조하고 조작하는 동작 getDiameter() { // 이 메서드가 자신이 속한 객체의 프로퍼티나 다른 메서드를 참조하려면 // 자신이 속한 객체인 circle을 참조 할 수 있어야 한다. return 2 * circle.radius; }, }; console.log(circle.getDiameter()); // 10 객체 리터럴은 circle 변수에 할당되기 직전에 ..

[프로그래머스] 배열 두배 만들기 | JS

문제 정수 배열 numbers가 매개변수로 주어집니다. numbers의 각 원소에 두배한 원소를 가진 배열을 return하도록 solution 함수를 완성해주세요. 해결 과정 .length를 할용하여 문제를 풀었다. 새롭게 알게된 점📝 x 정답 function solution(numbers) { var answer = []; for(let i = 0; i < numbers.length; i++) { answer[i] = numbers[i] * 2 } return answer; } https://school.programmers.co.kr/learn/courses/30/lessons/120809 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고..

[코딩 테스트] 분수의 덧셈 | JS

문제 첫 번째 분수의 분자와 분모를 뜻하는 numer1, denom1, 두 번째 분수의 분자와 분모를 뜻하는 numer2, denom2가 매개변수로 주어집니다. 두 분수를 더한 값을 기약 분수로 나타냈을 때 분자와 분모를 순서대로 담은 배열을 return 하도록 solution 함수를 완성해보세요. 해결 과정 1. 분모의 덧셈을 하기 위해 const numer와 const denom의 분자, 분모의 변수를 만들어줬다. 2. 분자 분모의 최대공약수로 나누는 것이다. 최대 공약수는 어떻게 만들까? i) 분자 분모 중 작은 수를 찾아야 한다. 작은 수를 찾기 위해 let minNumer라는 변수를 만들었다. ii) 작은 수로 분자 분모를 나눈다. ii-i) 둘 다 나눠 떨어지면 그 나눈 수가 최대 공약수이다...

728x90