본문 바로가기

Sparta x 이노베이션 캠프

 (69)
알고리즘 !! 시간복잡도 & 자료 구조 & 정렬 시간복잡도 알고리즘의 로직을 코드로 구현할 때, 시간 복잡도를 고려한다는 것은 바꿔 말해 입력값의 변화에 따라 연산을 실행할 때, 연산 횟수에 비해 시간이 얼마만큼 걸리는가? 라는 말이다. Big-O 표기법 : 입력값의 변화에따라 연산을 실행할때, 연산 횟수에 비해 시간이 얼마만큼 걸리는가? 를 표기하는 방법. Big-O(빅-오) ⇒ 상한 점근 (최악의 경우) Big-Ω(빅-오메가) ⇒ 하한 점근 (최선의 경우) Big-θ(빅-세타) ⇒ 그 둘의 평균 가장 자주 사용되는 표기법. 최악의 경우도 고려해 대비하는 것이 바람직하다. Reference https://hanamon.kr/%EC%95%8C%EA%B3%A0%EB%A6%AC%EC%A6%98-time-complexity-%EC%8B%9C%EA%B0%84..
TIL: 조건부 렌더링 조건부 렌더링이란, 특정 조건에 따라 다른 결과물을 렌더링 하는 것을 의미한다. 예로 App 컴포넌트에서 Hello 라는 컴포넌트를 사용 할 때, isSpecial 이라는 props를 설정해보자. App.js import React from "react"; import Hello from "./Hello"; import Wrapper from "./Wrapper"; function App() { return ( ) } export default App; 여기서 true는 자바스크립트 값이기 때문에 중괄호로 감싸주었다. 그리고, Hello 컴포넌트는 isSpecial이 true 이냐, false이냐에 따라서 컴포넌트의 좌측에 *표시를 보여줄것이다. 이를 처리하는 가장 기본적인 방법은, 삼항연산자를 사용하는..
TIL: React를 사용하는 이유 결론 : 요즘의 웹이 정적이고 단순한페이지를 넘어서 규모도 커지고 복잡하며 동적으로 바뀌었기 때문. 오픈소스 자바스크립트 라이브러리인 React, Vue를 사용하지 않아도 모두 바닐라 JS로 구현이 가능하며 정적인 웹페이지를 만드는 것 만이 목적이라면 굳이 프레임워크의 도움을 받지 않아도 되고 성능적 측면에서 바닐라 JS가 더 나을 수도 있다. 하지만 최근의 웹은 복잡하고 동적으로 변하고 있으며 이에 따라 프로젝트의 규모도 더 커졌다. 동적인 UI를 처리하기 위해서 그만큼 DOM 요소들에게 많은 연산을 하는 과정이 반복되면서 과부하가 걸리고 성능 측면에서도 당연히 좋지 않다. React를 사용해야 하는 이유 기능적인 측면에서는 굳이 Framework를 사용하지 않아도 되지만, Framework를 사용하는..
TIL: [JavaScript] this this의 정의 this : '이것'이라는 뜻. JavaScript 예약어다. this는? this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수(self-reference variable)이다. this는 자바 스크립트 엔진에 의해 암묵적으로 생성된다. 하지만 this는 객체의 프로퍼티나 메서드를 참조하기 위한 자기 참조변수이므로 일반적으로 객체의 메서드 내부 또는 생성자 함수 내부에서만 의미가 있다. 함수를 호출하면 인자와 this가 암묵적으로 함수 내부에 전달된다. 함수 내부에서 인자를 지역 변수처럼 사용할 수 있는 것처럼, this도 지역 변수 처럼 사용할 수 있다. 단 this가 가리키는 값, 즉 this 바인딩은 함수 호출 방식에 의해 동적으로 결정된다. 크게 전역..
TIL: position 속성 CSS에서 position은 문서 상에 요소를 배치하는 방법을 지정한다. top, right, bottom, left 속성이 요소를 배치할 최종 위치를 결정한다. 시도해보기 position - CSS: Cascading Style Sheets | MDN CSS position 속성은 문서 상에 요소를 배치하는 방법을 지정합니다. top (en-US), right (en-US), bottom (en-US), left (en-US) 속성이 요소를 배치할 최종 위치를 결정합니다. developer.mozilla.org static 태그에 아무런 값도 주지 않아도 주어지는 기본값. 요소를 일반적인 문서의 흐름에 따라 배치한다. top, right, bottom, left, z-index가 아무런 영향도 미치지 ..
TIL: HTTP HTTP (Hypertext Transfer Protocol)는 클라이언트-서버 간 통신을 가능하게 하도록 설계되었다. HTTP는 클라이언트와 서버 간의 요청-응답 프로토콜로 작동한다. 예: 클라이언트(브라우저)가 서버에 HTTP 요청을 보낸다. 그런 다음 서버는 클라이언트에 응답을 반환한다. 응답에는 요청에 대한 상태 정보가 포함되며 요청된 콘텐츠도 포함될 수 있다. HTTP 메소드 GET POST PUT HEAD DELETE PATCH OPTIONS CONNECT TRACE 가장 일반적인 메소드는 GET, POST이다. GET GET은 지정된 리소스에서 데이터를 요청하는 데 사용된다. 쿼리 문자열(이름/값 쌍)은 GET 요청의 URL로 전송된다. /test/demo_form.php?name1=valu..
TIL: CSS margin 과 padding margin CSS는 element의 각 사이드에 대한 여백을 지정하는 속성이 있다. margin-top margin-right margin-bottom margin-left 모든 여백 속성은 다음 값을 가질 수 있다. auto - 브라우저가 여백을 계산한다. 길이 - 여백을 px, pt, cm 등으로 지정. % - 포함하는 요소 너비의 %로 여백을 지정한다. 상속 - 여백이 부모 요소에서 상속되어야 함을 지정한다. *tip: 음수 값이 허용된다. 코드를 줄이려면 하나의 속성에 모든 여백 속성을 지정할 수 있다. 작동 방식은 다음과 같다. margin 속성에 4개의 값이 있는 경우 p { margin: 25px 50px 75px 100px; } 상단 25px, 오른쪽 50px, 하단 75px, 왼쪽 10..
TIL: JavaScript Closer 클로저 클로저(closure)는 내부함수가 외부함수의 맥락(context)에 접근할 수 있는 것을 가르킨다. 클로저는 자바스크립트를 이용한 고난이도의 테크닉을 구사하는데 필수적인 개념으로 활용된다. function outter(){ function inner(){ var title = 'coding everybody'; alert(title); } inner(); } outter(); 결과는 alert으로 coding everybody가 출력된다. 위 예제에서 함수 outter 내부에 함수 inner가 정의 되어있음. 이를 내부 함수라고 한다. 내부함수는 외부함수의 지역변수에 접근 가능하다. function outter(){ var title = 'coding everybody'; //외부함수의 지역변수 fun..
반응형

티스토리툴바