본문 바로가기

자바스크립트71

[Lv.2] 숫자의 표현 (등차수열의합 / 정수론) 1. 문제 Finn은 요즘 수학공부에 빠져 있습니다. 수학 공부를 하던 Finn은 자연수 n을 연속한 자연수들로 표현 하는 방법이 여러개라는 사실을 알게 되었습니다. 예를들어 15는 다음과 같이 4가지로 표현 할 수 있습니다. 1 + 2 + 3 + 4 + 5 = 15 4 + 5 + 6 = 15 7 + 8 = 15 15 = 15 자연수 n이 매개변수로 주어질 때, 연속된 자연수들로 n을 표현하는 방법의 수를 return하는 solution를 완성해주세요. 제한사항 n은 10,000 이하의 자연수 입니다. 2. 풀이 // 등차수열의 합은 항의갯수*(초항+마지막항)/2 이다. function solution(n) { var answer = 1; for(let i =2; i 2023. 2. 12.
[Lv.2] 이진 변환 반복하기 (JS 이진수, 십진수 변환) 1. 문제 0과 1로 이루어진 어떤 문자열 x에 대한 이진 변환을 다음과 같이 정의합니다. x의 모든 0을 제거합니다. x의 길이를 c라고 하면, x를 "c를 2진법으로 표현한 문자열"로 바꿉니다. 예를 들어, x = "0111010"이라면, x에 이진 변환을 가하면 x = "0111010" -> "1111" -> "100" 이 됩니다. 0과 1로 이루어진 문자열 s가 매개변수로 주어집니다. s가 "1"이 될 때까지 계속해서 s에 이진 변환을 가했을 때, 이진 변환의 횟수와 변환 과정에서 제거된 모든 0의 개수를 각각 배열에 담아 return 하도록 solution 함수를 완성해주세요. 제한사항 s의 길이는 1 이상 150,000 이하입니다. s에는 '1'이 최소 하나 이상 포함되어 있습니다. 입출력 예.. 2023. 2. 12.
React - 5장 : ref. DOM에 이름 달기 - 일반 HTML에서 DOM 요소에 이름을 달 때는 id를 사용한다. - 요소에 id를 달면 css에서 특정 스타일을 적용하거나 자바스크립트로 해당 요소에 작업을 할 수 있다. 5-1. ref(reference) - HTML에서 id를 사용하여 DOM에 이름을 다는 것처럼 리액트 프로젝트 내부에서 DOM에 이름을 다는 방법이 있다. - 리액트 컴포넌트에 id를 사용하는 것은 권장하지 않는다. - 컴포넌트는 여러 번 사용할 수 있는데 id는 유니크한 값이기 때문에 잘못된 사용이 될 수 있다. - ref는 전역적으로 작동하지 않고 컴포넌트 내부에서만 작동하기 떄문에 문제가 발생하지 않는다. 1) ref는 어떤 상황에서 사용해야 할까? - DOM을 꼭 직접적으로 건드려야 할 때 사용한다. - 특정 input에.. 2023. 2. 9.
React - 4장 : 이벤트 핸들링 4-1. 리액트의 이벤트 시스템 1) 이벤트를 사용할 때 주의 사항 - 이벤트 이름은 카멜 표기법으로 작성한다. - ex) onclick(x) -> onClick - 이벤트에 실행할 자바스크립트 코드를 전달하는 것이 아니라, 함수 형태의 값을 전달한다. - DOM 요소에만 이벤트를 설정할 수 있다. - 직접 만든 컴포넌트에는 이벤트를 자체적으로 설정할 수 없다. 4-2. 예제로 이벤트 핸들링 익히기 1) onChange 이벤트 - onChange 이벤트는 Form 요소에 값이 변하면 발생하는 이벤트이다. - onChange 함수안에 e 객체는 SyntheticEvent, 웹 브라우저의 네이티브 이벤트를 감싸는 객체이다. - 이벤트가 끝나고 나면 초기화되므로 정보를 참조할 수 없다. - 만약 비동기적으로 .. 2023. 2. 8.
[JS] String, Array, Object 자주 쓰이는 메소드 총정리 cheat sheet 1.String - str.length : 문자의 길이 반환. - str.at(index) : index에 있는 문자를 반환, -1 일 경우 마지막문자 반환. - str.indexOf(찾을문자열[,x]) : 찾을문자열을 처음 발견한 곳의 index 반환, 발견하지 못한 경우 -1 반환. 두번째 파라미터 x 가 입력되면, 첫인덱스를 x로 이동하여 역방향으로 검색한다. - str.lastIndexOf() : str의 특정문자가 마지막으로 등장하는 index를 반환한다. - str.replace(바꿀놈, 뭘로바꿀까) : 바꿀놈을 뭘로바꿀까로 바꿔줌 (바꿀놈에는 정규식도 사용 가능, 뭘로바꿀까에는 콜백함수도 사용 가능) (여럿일 경우 한번만 바꿈) (원본 값을 바꾸지 않음) - str.split(구분자 [,제한.. 2023. 2. 7.
[Lv.1] 개인정보 수집 유효기간 (카카오 신입/인턴 코딩테스트) 1. 문제 개인정보 수집 유효기간 고객의 약관 동의를 얻어서 수집된 1~n번으로 분류되는 개인정보 n개가 있습니다. 약관 종류는 여러 가지 있으며 각 약관마다 개인정보 보관 유효기간이 정해져 있습니다. 당신은 각 개인정보가 어떤 약관으로 수집됐는지 알고 있습니다. 수집된 개인정보는 유효기간 전까지만 보관 가능하며, 유효기간이 지났다면 반드시 파기해야 합니다. 예를 들어, A라는 약관의 유효기간이 12 달이고, 2021년 1월 5일에 수집된 개인정보가 A약관으로 수집되었다면 해당 개인정보는 2022년 1월 4일까지 보관 가능하며 2022년 1월 5일부터 파기해야 할 개인정보입니다. 당신은 오늘 날짜로 파기해야 할 개인정보 번호들을 구하려 합니다. 모든 달은 28일까지 있다고 가정합니다. 다음은 오늘 날짜가.. 2023. 2. 7.
[Lv.1] 햄버거 만들기 1. 문제 햄버거 만들기 문제 설명 햄버거 가게에서 일을 하는 상수는 햄버거를 포장하는 일을 합니다. 함께 일을 하는 다른 직원들이 햄버거에 들어갈 재료를 조리해 주면 조리된 순서대로 상수의 앞에 아래서부터 위로 쌓이게 되고, 상수는 순서에 맞게 쌓여서 완성된 햄버거를 따로 옮겨 포장을 하게 됩니다. 상수가 일하는 가게는 정해진 순서(아래서부터, 빵 – 야채 – 고기 - 빵)로 쌓인 햄버거만 포장을 합니다. 상수는 손이 굉장히 빠르기 때문에 상수가 포장하는 동안 속 재료가 추가적으로 들어오는 일은 없으며, 재료의 높이는 무시하여 재료가 높이 쌓여서 일이 힘들어지는 경우는 없습니다. 예를 들어, 상수의 앞에 쌓이는 재료의 순서가 [야채, 빵, 빵, 야채, 고기, 빵, 야채, 고기, 빵]일 때, 상수는 여섯.. 2023. 2. 6.
React - 3장 : 컴포넌트 3-1. 컴포넌트를 선언하는 방식 - 컴포넌트를 선언하는 방식은 크게 두가지이고 클래스형과 함수형이 있다. 1) 클래스형 컴포넌트 - 클래스형 컴포넌트에서는 render 함수가 꼭 있어야 하고, 그 안에서 보여주어야 할 JSX를 반환해야 한다. - state와 라이프사이클 API 사용이 가능하다. - 임의 메서드를 정의가 가능하다. import React, { Component } from 'react'; class App extends Component { render() { const name = 'react'; return {name}; } } export default App; 2) 함수형 컴포넌트 - 클래스형 컴포넌트보다 선언하기가 훨씬 편하다. - 메모리 자원도 클래스형 컴포넌트보다 덜 사용한.. 2023. 2. 6.

티스토리툴바