console.log("CAPABLE");

문제 정수 배열 numbers가 매개변수로 주어집니다. numbers의 원소의 평균값을 return하도록 solution 함수를 완성해주세요. 해결 과정 1. 배열의 합을 구한다. 2. 배열의 길이로 나눈다. 새롭게 알게된 점📝 배열의 합을 어떻게 구해야하나 구글링을 하여 문제를 해결했다. 참고했던 사이트: https://sentry.io/answers/how-to-find-the-sum-of-an-array-of-numbers/ How to find the sum of an array of numbers The Problem You want to find the sum of an array of numbers. How do you do this with JavaScript? The Solution Th..

문제 머쓱이네 피자가게는 피자를 두 조각에서 열 조각까지 원하는 조각 수로 잘라줍니다. 피자 조각 수 slice와 피자를 먹는 사람의 수 n이 매개변수로 주어질 때, n명의 사람이 최소 한 조각 이상 피자를 먹으려면 최소 몇 판의 피자를 시켜야 하는지를 return 하도록 solution 함수를 완성해보세요. 해결 과정 이건 피자나눠먹기(1)문제와 유사하다. 그래서 쉽게 해결할 수 있었다. 정답 function solution(slice, n) { var answer = 0; let pizzaCnt = n / slice; return Math.ceil(pizzaCnt); } 7m

문제 머쓱이네 피자가게는 피자를 여섯 조각으로 잘라 줍니다. 피자를 나눠먹을 사람의 수 n이 매개변수로 주어질 때, n명이 주문한 피자를 남기지 않고 모두 같은 수의 피자 조각을 먹어야 한다면 최소 몇 판을 시켜야 하는지를 return 하도록 solution 함수를 완성해보세요. 해결 과정 이 문제를 처음봤을때 생각보다 어렵게 생각했다. 그래서 시간이 많이 걸렸다. 문제는 이해갔지만 어떻게 풀지 막막해서 구글링을 해보고 다른 문제를 다 푼다음 다시 풀어봤다. 피자 변수를 만들었다. 피자 조각은 1조각 부터 시작함으로 let pizza = 1;로 작성했다. while문을 사용한 이유는 if문이 참일 경우 실행시키기 위해서 작성했다. if 문 안에 pizza * 6조각 그리고 사람 수로 나눠 떨어지면 피자가..

문제 머쓱이네 피자가게는 피자를 일곱 조각으로 잘라 줍니다. 피자를 나눠먹을 사람의 수 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; } // 배열의 순서를 증가 시키기 위해 반복문을 활용한다..

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

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

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. ..

1단계 #pond { display: flex; justify-content: flex-end; } 2단계 #pond { display: flex; justify-content: flex-end; } 3단계 #pond { display: flex; justify-content: space-around; } 4단계 #pond { display: flex; justify-content: space-between; } 5단계 #pond { display: flex; align-items: flex-end; } 6단계 #pond { display: flex; justify-content: center; align-items: center; } 7단계 #pond { display: flex; justify-con..

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