본문 바로가기

분류 전체보기296

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 프로그래머스 코딩테스트 정복 기념. 0단계는 단순한 배열 넣고빼기 삭제하기 순회하기 정렬하기 필터링하기 등의 메소드 위주의 단계였다면, 1단계는 배열/객체 계산, 날짜계산 등 거대하지 않은 데이터덩어리를 시간복잡도를 고려하여 효율적으로 관리하는 것에 대한 이야기가 주를 이루었다. 뿌듯하다! 이제 2단계로 가자 바로. 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.
[Lv.1] 신규 아이디 추천 (카카오 신입/인턴 코딩테스트) 1. 문제 신규 아이디 추천 문제 설명 카카오에 입사한 신입 개발자 네오는 "카카오계정개발팀"에 배치되어, 카카오 서비스에 가입하는 유저들의 아이디를 생성하는 업무를 담당하게 되었습니다. "네오"에게 주어진 첫 업무는 새로 가입하는 유저들이 카카오 아이디 규칙에 맞지 않는 아이디를 입력했을 때, 입력된 아이디와 유사하면서 규칙에 맞는 아이디를 추천해주는 프로그램을 개발하는 것입니다. 다음은 카카오 아이디의 규칙입니다. 아이디의 길이는 3자 이상 15자 이하여야 합니다. 아이디는 알파벳 소문자, 숫자, 빼기(-), 밑줄(_), 마침표(.) 문자만 사용할 수 있습니다. 단, 마침표(.)는 처음과 끝에 사용할 수 없으며 또한 연속으로 사용할 수 없습니다. "네오"는 다음과 같이 7단계의 순차적인 처리 과정을 .. 2023. 2. 6.
[Lv.1] 2016년 (특정 날짜의 요일 구하기) 1. 문제 문제 설명 2016년 1월 1일은 금요일입니다. 2016년 a월 b일은 무슨 요일일까요? 두 수 a ,b를 입력받아 2016년 a월 b일이 무슨 요일인지 리턴하는 함수, solution을 완성하세요. 요일의 이름은 일요일부터 토요일까지 각각 SUN,MON,TUE,WED,THU,FRI,SAT 입니다. 예를 들어 a=5, b=24라면 5월 24일은 화요일이므로 문자열 "TUE"를 반환하세요. 제한 조건 2016년은 윤년입니다. 2016년 a월 b일은 실제로 있는 날입니다. (13월 26일이나 2월 45일같은 날짜는 주어지지 않습니다) 입출력 예 a / b / result 5 24 "TUE" 2. 풀이 function solution(a, b) { var answer = ''; const day =.. 2023. 2. 6.