본문 바로가기

분류 전체보기83

javascript - 알고리즘 연습 정리보다는 그때그때 풀이를 올리는 식으로 올려보겠다. 문제1 : 제곱근 구하는 문제 - 자바스크립트 제곱 표현 방법은 Math.pow()메서드를 사용한다. - 음수의 소수 지수는 허수로 NaN을 반환한다. - 계산 가능 범위를 넘어서면 Infinity를 반환한다. ex) 2^3 = 8 ========== var num1 = Math.pow(2,3) - 앞 자리 숫자는 밑, 뒷자리 숫자는 지수를 의미한다 (2의 3제곱) 문제2 : 유주는 놀이공원 아르바이트 중입니다. 그런데 놀이기구마다 키 제한이 있습니다. 유주가 담당하는 놀이기구는 키가 150cm 이상만 탈 수 있습니다. 입력으로 키가 주어지면 키가 150이 넘으면 YES를 틀리면 NO를 출력하는 프로그램을 작성하세요. const msg = prompt.. 2024. 1. 21.
python - 관심영역 지정 가장 큰 윤곽선 찾기 마우스로 직접 동영상 및 이미지에 관심영역을 지정 후 키보드의 [ ] 대괄호를 사용해 threshold 조절하여 물체의 가장 큰 윤곽선을 찾을 수 있다. [ 코드 내용 ] 1. opencv 라이브러리를 이용 2. 클래스를 정의하여 인스턴스 변수 관리 3. mouseEvent 를 사용해서 직접 원하는 영역에 박스 지정 가능 -> sefl.start_x, y, w, h 변수로 마우스로 클릭한 위치와 드래그 위치를 저장해서 사용 -> step변수를 통해 마우스 클릭 값을 업데이트 4. threshold 조절 가능 몇달 전 업무에 필요해서 연습삼아 간단한 기능만 넣어서 만들어봤는데, 2주나 걸렸다는 함정.. 그래도 만들어놓고 보니 뿌듯하다. [ 결과물 ] import cv2 class DrawBoxClass: .. 2023. 3. 27.
2023.01.21 - React 데이터 흐름 1. 리액트는 단방향 데이터 흐름을 가지고 있다. 2. 컴포넌트 단위로 생각하자(컴포넌트 설계방식) - 리액트의 개발방식의 가장 큰 특징은 페이지 단위가 아닌 컴포넌트 단위로 시작한다. - 프로토 타입에서 컴포넌트를 찾아 컴포넌트를 만들고 페이지를 조립한다. -> 샹향식(bottom-up) 으로 만든다.( 테스트가 쉽고 확장성이 좋음) 3. 데이터는 위에서 아래로 흐른다. - 단방향 데이터 흐름 - 컴포넌트는 바깥에서 props를 이용해 데이터를 마치 전달인자(arguments) 혹은 속성(attributes)처럼 전달받을 수 있다. - 데이터를 전달하는 주체는 컴포넌트가 된다. (데이터 흐름이 하향식임을 의미/ top-down) 2023. 2. 6.
2023.01.20 - React Hook / useRef - useRef : .current 프로퍼티로 전달된 인자(initilaValue)로 초기화된 변경가능한 ref 객체를 반환한다. 반환된 객체는 컴포넌트의 전 생애주기를 통해 유지된다. - useRef 는 저장공간 또는 DOM요소에 접근하기 위해 사용되는 React Hook이다. - useRef는 DOM을 선택하는 용도 외에도, 컴포넌트 안에서 조회 및 수정할 수 있는 변수를 관리할 수 있다. 사용 예) focus 1) useRef 를 사용하기 위해 authorInput, contentInput 객체 생성 더보기 const authorInput = useRef(); const contentInput = useRef(); import { useRef, useState } from "react"; // us.. 2023. 1. 30.
2022.08.21 - optimizing performance성능 최적화 ** 리액트는 필요할때만 랜더한다. - reconciliation 재조정 리액트는 컴포넌트에서 prop이나 state가 변경될 때, 직전에 렌더링된 요소(element)와 새로 반환된 요소를 비교하여 실제 DOM을 업데이트 할지 말지 결정해야 한다. 이때 두 element가 일치하지 않으면 리액트는 새로운 요소로 DOM을 업데이트 하는데, 이러한 프로세스를 reconciliation이라고 한다. - dom 엘리먼트의 타입이 다른 경우: 이전 트리를 버리고 완전히 새로운 트리를 구축 - dom 엘리먼트의 타입이 같은 경우: 두 엘리먼트의 속성(attribute)을 확인하여, 동일한 내역은 유지하고 변경된 속성들만 업데이트 한다. 1. 자식에 대한 재귀적 처리 DOM 노드의 자식들을 재귀적으로 처리할 때, .. 2022. 8. 21.
2022.08.15 - http 웹 기본지식 - (2) 1. 웹브라우저 요청 흐름 (1) url로 보냄 (2) 서버를 찾아야함(DNS 서버 조회) (3) 아이디, 포트 정보 찾음 (4) http요청 메세지를 생성 (get,host등등 정보 들어있음) -> 인터넷 망으로 던짐 (5) 요청 패킷 도착하면 서버가 tcp/ip 패킷을 지우고 http메세지를 해석한다. -> http응답 메세지를 생성함 (6) 응답 패킷이 웹브라우저에 도착 -> 웹브라우저가 HTML랜더링을 한다. 2. HTTP HTTP 메세지에 모든것을 전송할 수 있다. html, text, image, 음성, 영상, 파일, json, xml(api) 거의 모든 형태의 데이터를 전송 가능 2-1. HTTP의 특징 - 클라이언트 서버 구조이다. - 무상태 프로토콜 - 비연결성 - 보낼때도 받을때도 HT.. 2022. 8. 21.