일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- 수학
- 프론트엔드
- styled-components
- poiemaweb
- 오블완
- 코딩일기
- 자바스크립트
- 시뮬레이션
- 구현
- 백준
- 티스토리챌린지
- 세그먼트 트리
- js
- REACT
- HTML5
- 모던 자바스크립트 튜토리얼
- 기본 문법
- 토이 프로젝트
- State
- 엔트리포인트
- 회고
- 자료 구조
- Next.js
- 해시를 사용한 집합과 맵
- react-three/fiber
- 개발 회고
- 자바
- 브루트포스
- JavaScript
- three.js
- Today
- Total
목록JavaScript (9)
코딩하는 고릴라

기존에 Map 객체를 활용해 API 응답 데이터 캐싱 로직을 구현했었습니다.const cacheData = API_CACCHE_DATA.get('http://localhost:8080/api/team'); if (!cacheData || cacheData.exp { // 캐시 데이터 설정 {data, exp} API_CACHE_DATA.set('http://localhost:8080/api/team', { data: res.data, exp: new Date().getTime + 1000 * 60 * 10, }) // 응답 데이터 활용 console.log..

🐖 Why프로젝트 진행 중 녹음 기능 관련하여 평균 음량을 도출해내야 하는 요구사항이 있었습니다. 이를 계산하기 위해 도출된 음량의 합(volumes)과 음량을 측정한 횟수(count)를 필요로 했는데 평균 음량 측정에만 필요한 해당 변수들을 컴포넌트에 남겨두고 싶지 않아 함수 작성 방식에 대해 고민해봤습니다. 🐄 What위와 같은 내용들을 충족시키기 위해 최근에 학습한 렉시컬 환경과 클로저 개념을 활용했습니다. 변수의 유효범위와 클로저ko.javascript.info 🐌 Howexport function getAvgVolume() { let count = 0; let volumes = 0; function getAvg(volume: number) { volumes += volume; count++; r..

본 게시물은 poiemaweb(https://poiemaweb.com/)에 기술된 내용을 기반으로 작성한 게시물입니다. 1. 데이터 타입 - 데이터 타입이 가지고 있는 정보 - 메모리에 데이터 저장시 확보해야 하는 메모리 공간의 크기 - 메모리에 할당할 수 있는 유효한 값에 대한 정보 - 메모리에 저장된 2진수 데이터를 해석하는 방법 - 데이터 타입의 존재 이유 - 한정된 메모리 공간의 효율적 사용을 위해 - 2진수 데이터로 메모리에 저장된 데이터를 다양한 방법으로 사용하기 위해 - 데이터 타입의 종류 1. 원시 타입 (primitive type) - boolean - null - undefined - number - string - symbol 2. 객체 타입 (object, reference type..
본 게시물은 poiemaweb(https://poiemaweb.com/)에 기술된 내용을 기반으로 작성한 게시물입니다. 1. 변수 - 값을 저장하고 그 저장된 값을 참조하기 위해 사용 - 변수 이름을 통해 값에 의미를 부여, 코드의 가독성을 높일 수 있음 - 메모리 주소(Memory address)에 접근하기 위해 인간이 이해할 수 있는 언어로 지정한 식별자 var x; // 변수의 선언 x = 6; // 정수값 할당 2. 값 - 프로그램에 의해 조작될 수 있는 대상 용어 의미 데이터 타입(Data Type) 프로그래밍 언어에서 사용할 수 있는 값의 종류 변수(Variable) 값이 저장된 메모리 주소를 가리키는 식별자 리터럴(literal) 소스코드 안에서 직접 만들어낸 상수 값 자체 값을 구성하는 최..

본 게시물은 poiemaweb(https://poiemaweb.com/)에 기술된 내용을 기반으로 작성한 게시물입니다. 1. 브라우저 동작 원리 - 브라우저의 핵심 기능 : 참조하고자 하는 웹페이지를 서버에 요청. 서버의 응답을 받아 브라우저에 표시 - 서버의 응답 : HTML, CSS, Javascript, 이미지 파일 등 1.1 동작 순서 1.1.1. 렌더링 엔진 - HTML, CSS 파일은 렌더링 엔진의 HTML 파서, CSS 파서에 의해 파싱되어 DOM, CSSOM 트리로 변환 - 변환된 DOM, CSSOM 트리는 렌더 트리로 결합하여 이를 기반으로 웹 페이지 표시 - HTML 파서는 script 태그를 만나면 자바스크립트 코드 실행을 위해 DOM 생성 프로세스를 중지 - 그 후 자바스크립트 엔진..

본 게시물은 poiemaweb(https://poiemaweb.com/)에 기술된 내용을 기반으로 작성한 게시물입니다. 1. Node.js - 프로젝트의 규모가 커짐에 따라 React, jQuery와 같은 외부 라이브러리를 도입하거나 Babel, Webpack, ESlint 등 여러가지 도구 사용의 필요성 有 - 이때 Node.js와 npm을 필요로 함 - 2009년 라이언 달(Ryan Dahl)이 발표한 Chrome V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경 - 브라우저에서만 동작하던 자바스크립트를 브라우저 이외의 환경에서 동작시킬 수 있는 자바스크립트 실행환경 1.1. Node.js와 npm - Node.js - 주로 서버 사이드 애플리케이션 개발에 사용 - 이에 필요한 모듈, 파일 ..