본문 바로가기

분류 전체보기122

자바스크립트로 자료구조 공부하기 데이터 구조와 알고리즘 개요 1. 자바스크립트의 데이터 구조 데이터 구조는 프로그램에서 데이터를 저장, 구성, 조작하는 방식 데이터 구조는 대량의 데이터를 효율적이고 효과적으로 관리할 수 있는 방법 제공 간단한 일상 업무부터 복잡한 과학 및 엔지니어링 문제까지 다양한 애플리케이션에 사용 ex) 배열, 연결 리스트, 스택, 큐, 트리, 그래프, 해시 테이블 등 a. 배열 배열은 객체모음을 선형 순서로 저장하는 방법을 제공 배열은 메모리에 연속적인 데이터 블록으로 저장되는 데이터 항목의 모음 배열의 요소는 모든 데이터 타입이 될 수 있음 메모리에 빠르게 액세스하고 조작할 수 있는 데이터 리스트 저장에 자주 사용 ex) 이름 리스트, 일련의 숫자값, 이미지 픽셀 등 b. 객체 복잡한 데이터 구조를 저장하는데 .. 2023. 10. 30.
모던 자바스크립트 : 실행 컨텍스트 기초 실행 컨텍스트 execution context 에 대해서 실행 컨텍스트 : 자바스크립트의 동작 원리를 담고 있는 핵심 개념 실행컨텍스트를 이해하면 얻을 수 있는 것들 자바스크립트가 스코프를 기반으로 식별자와 식별자에 바인딩된 값을 관리 하는 방식 호이스팅이 발생하는 이유 클로저의 동작방식 태스크 큐와 함께 동작하는 이벤트 핸들러 비동기 처리 동작 방식 1. 소스코드의 타입 a. ECMAScript 사양은 소스코드(ECMAScript code)를 4가지 타입으로 구분 => 소스코드 타입에 따라 실행 컨텍스트 생성 과정, 내용 다르기때문 b. 4가지의 소스코드(실행 가능한 코드)는 실행 컨텍스트 생성 b-1. 전역 코드 전역 코드 : 전역 변수를 관리하기 위해 최상위 스코프인 전역 스코프 생성 var 키워드.. 2023. 10. 30.
styled-components: it looks like an unknown prop 에러 해결하기 타입스크립트 + 스타일컴포넌트를 쓰는 도중 워닝이 떴다. 해결 해주지 않아도 코드 실행은 되지만 보기 싫기 때문에 워닝을 없애는 방법을 찾아보았다. 아이디를 입력해주세요. const IdInputValid = styled.p` color: #ff0000; font-size: 1.2rem; opacity: ${(props) => (props.idValid ? 0 : 1)}; `; idValid라는 props를 스타일 컴포넌트로 보내주고 있었는데 이 부분이 dom입장에서는 속성처럼 받아들일 수 있다는 경고였다. 그래서 이 경고를 해결하는 방법은 props 앞에 달러 기호를 붙여주는 것이다. 아이디를 입력해주세요. const IdInputValid = styled.p` color: #ff0000; font-s.. 2023. 10. 28.
모던 자바스크립트 : 객체리터럴 1. 자바스크립트에게 객체란? 자바스크립트 : 객체 기반의 프로그래밍 언어이며 자바스크립트를 구성하는 거의 모든 것이 객체 객체지향 프로그래밍 : 객체의 집합으로 프로그램을 표현하려는 프로그래밍 패러다임 원시값을 제외한 나머지 값(함수, 배열, 정규 표현식 등)은 모두 객체 객체 타입은 다양한 타입의 값(원시값 또는 다른 객체)을 하나의 단위로 구성한 복잡한 자료구조 원시타입값 : 변경 불가능한 값, 객체 타입의 값 : 변경 가능한 값 2. 객체란? a. 객체 프로퍼티와 메서드로 구성된 집합체 0개 이상의 프로퍼티로 구성된 집합, 프로퍼티는 키와 값으로 구성 b. 프로퍼티 프로퍼티 : 객체의 상태를 나타내는 값 자바스크립트에서 사용할 수 있는 모든 값은 프로퍼티 값 가능 자바스크립트의 함수는 일급 객체이.. 2023. 10. 20.
모던 자바스크립트 : 타입변환과 단축평가 타입 변환에 대해서 1. 타입 변환이란? 타입변환이랑 기존 원시값을 사용해 다른 타입의 새로운 원시 값 생성 명시적 타입 변환, 암묵적 타입 변환 모두 기존 원시값을 직접 변경하는 건 아님 코드를 예측하기 위해 타입변환이 어떻게 동작하는지 정확이 이해해야함 타입변환 방법 : 생성자함수를 new 연산자 없이 호출, 빌트인 메서드 사용, 암묵적 타입변환 이용 **원시값은 변경 불가능한 값 2. 명시적 타입 변환 (타입 캐스팅) 개발자가 의도적으로 값의 타입을 변환하는 경우 a. 문자열 타입으로 변환 string 생성자 함수를 new 연산자 없이 호출 Object.prototype.toString 메서드 사용 문자열 연결 연산자 이용 b. 숫자 타입으로 변환 Number 생성자 함수를 new 연산자 없이 호출.. 2023. 10. 18.
모던 자바스크립트 : 제어문 제어문이란? 제어문 : 조건에 따라 코드 블록을 실행(조건문)하거나 반복 실행(반복문)할 때 사용 제어문을 사용하면 코드의 실행 흐름을 인위적으로 제어 가능 -> 코드의 흐름을 이해하기 어렵게 만들어 가독성 ↓ 1. 블록문 블록문 : 0개 이상의 문을 중괄호로 묶은 것 코드 블록, 블록으로 불림 블록문은 언제나 문의 종료를 의미하는 자체 종결성을 갖기 때무에 블록문 끝에는 세미콜론 생략 자바스크립트는 블록문을 하나의 실행 단위로 취급 블록문은 단독으로 사용할 수도 있으나 일반적을 제어문이나 함수 정의할 때 사용하는 것이 일반적 2. 조건문 조건문 : 주어진 조건식의 평가 결과에 따라 블록문의 실행 결정 조건식 : boolean 값으로 평가될 수 있는 표현식 종류 : if..else문, switch문 a... 2023. 10. 17.