자바스크립트

프론트엔드

가비지 컬렉션(garbage collection)

이전에 컴퓨터 과학을 CS50(네이버 부스트코스 강의)로 접하면서 C를 사용한 강의를 수강한 적이 있습니다. 이때 C 언어는 malloc() , free()와 같은 함수로 메모리 할당을 해제하는 모습을 보았고 자바스크립트에서는 어떠한 방식으로 메모리를 관리하는지 궁금하여 가비지 컬렉션에 대해 정리를 하게 되었습니다. garbage collection이란? 메모리 관리 기법 중의 하나로, 프로그램이 동적으로 할당했던 메모리 영역 중에서 필요없게 된 영역을 해제하는 기능입니다. 더보기 메모리 관리 gif와 같이 컴퓨터는 우리가 작성한 변수, 함수, 객체들을 메모리에 할당한다. 하지만 계속 할당만 해서 메모리가 꽉 차게되면 작업중인 프로그램이 느려지고 결국은 강제종료되는 현상이 일어나게됩니다. 가상메모리도 메..

프로그래머스 데브코스/회고

정규 표현식을 이용한 개미수열 구현 - JavaScript

정규표현식을 활용한 개미 수열 구현 Run-length Encoding 정규표현식에 대해 학습하며 개미 수열을 구현하는 과제를 진행했습니다. 정규표현식 학습에 도움이 많이 되었고 Run-length Encoding에 대해 알게 되어 학습했던 내용을 공유하고 기록하고자 글을 작성하게 되었습니다. 시작하기에 앞서 개미수열과 Run-length Encoding에 대해 간략하게 정리 후 이를 구현하는 방법에 대해 작성하려고 합니다. 개미 수열 읽고 말하기 수열이라고도 불리는 개미 수열은 베르나르 베르베르의 소설 개미에 등장한다고 하여 개미 수열이라고 불리게 되었습니다. 수열이라는 이름에서 알 수 있듯이 어떠한 규칙을 가지고 다음 수를 만드는 방식이다. 1부터 시작하여 이전 value들을 말하듯 표현하는 방식으로..

JavaScript

async & await - JavaScript

async & await (Promise) JavaScript 저번 포스트에서는 Promise에 대해서 정리하였는데 이 개념을 더 쉽게 사용하도록 도와주는 async, await 문법에 대해 정리 해보려고 합니다. 비동기 처리를 활용하기 위해 3개의 글을 포스팅하였는데 이번이 마지막 시리즈입니다. 이전 포스트 링크도 남겨 놓겠습니다. [JavaScript] - Promise(then & catch) - JavaScript async & await 이 문법들을 이용해 비동기적인 코드들을 동기적 처리 코드처럼 작성할 수 있게 됩니다. 쉽게 말하자면 더 간결하게 작성이 가능합니다. 이를 syntactic sugar라고도 부릅니다 그럼 각 기능을 확인해보겠습니다. async async와 await는 항상 같이 ..

JavaScript

동기적, 비동기적 처리, 콜백 함수 - JavaScript

Synchronous & Asynchronous & Callback function JavaScript 이번 포스트를 작성하게 된 이유는 promise 문법에 대해 정리하던 중 머릿속으로만 이해하고 넘어갔던 내용들이 다른 분들에게 필요할 것이라고 생각하여 작성하게 되었습니다. 동기적 처리(Synchronous) 코드를 위에서 아래로 한 명령이 끝나면 다음 명령을 해결하는 기본적으로 컴퓨터가 명령을 처리하는 방식을 말한다. 어떠한 방식으로 실행될지 예상하여 작성할 수 있다. 비동기적 처리(asynchronous) 자바스크립트의 비동기 처리란 특정 코드의 연산이 끝날 때까지 코드의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 자바스크립트의 특성을 의미한다. 통신을 하거나, 명령이 언제 끝날지 모를 때, 주..

JavaScript

쿠키, 로컬스토리지와 세션스토리지 - JavaScript

Cookies & Local Storage & Session Storage JavaScript 브라우저 안에서 데이터를 저장하는 3가지 방법이 있다. 각 Storage들의 차이점에 대해서 정리해보고자 한다. 각 Storage의 특징 Cookies 4kb의 용량을 가지고 있다 Expire Date를 지정할 수 있다. 브라우저뿐만 아니라 서버와도 통신이 가능하다 Local Storage 10mb의 용량을 저장할 수 있다. 인터넷 기록을 삭제하거나 직접 지우지 않는다면 기록이 삭제되지 않는다. Session Storage 5mb의 용량을 저장할 수 있다. 현재 탭에서만 내용을 저장한다. 브라우저를 종료하면 기록은 사라진다. 확인하는 법 브라우저(크롬)의 개발 툴을 열어 Application 탭을 열면 각 St..

JavaScript

Webpack과 Babel - JavaScript

Webpack & Babel JavaScript Webpack webpack이란? > webpack은 js를 모듈화 해주는 모듈 번들러입니다. 여러 개의 자바스크립트 파일을 하나로 모아주는 기능을 합니다. 왜 webpack이 필요할까? 웹 애플리케이션의 발전에 따라 규모는 점점 더 커졌습니다. 이로인해 발생한 문제점들을 살펴보면 웹을 구동하기 위해서는 수 많은 파일을 서버에서 가져와 데이터들을 표시하게 됩니다. 즉 규모가 커질수록 응답 시간이 길어져 느려지게 됩니다. 여러 명의 개발자가 함께 프로젝트를 진행하다 보면 변수명이나 함수명이 겹치는 일이 벌어지면 이는 에러를 야기할 수 있습니다. 이를 해결하기 위해 번들러(Bundler)가 나오게 되었습니다. 대표적으로 webpack, parcel, brows..

🚀 새로운 블로그로 이전했습니다.

살펴보러 가기
minjae_4
'자바스크립트' 태그의 글 목록