본문 바로가기

💻 DEV/Javascript & NodeJS20

[JS] 0.1 + 0.2 !== 0.3 인 이유 이전부터 한 번은 정리해서 올리려고 했던 주제인데, 이제서야 글을 써 본다. 대부분의 컴퓨터 프로그래밍 언어에서 0.1 + 0.2 를 연산하면 정확한 값인 0.3 이 나오지 않는다. 대신, 근사값인 0.30000.... x 가 나오는 것을 확인할 수 있다. 사람보다 더욱 정확한 연산을 하는 컴퓨터가 이런 오차를 출력하다니, 이상한 일이다. 하지만 이는 컴퓨터가 데이터를 저장하는 방법이 사람이 연산을 하는 방법과 다르기 때문에 생기는 현상이다. 즉, 오히려 컴퓨터가 연산을 너무 정확하게 하기 때문에 발생하는 side effect 인 것이다. 컴퓨터의 숫자 체계 모든 컴퓨터들은 자료를 비트와 바이트 (bit & byte)에 저장한다. 비트는 컴퓨터에서 사용하는 가장 작은 데이터 단위이다. 하나의 비트는 2진.. 2022. 1. 9.

[JavaScript] 클래스 (Class) 자바스크립트를 비롯한 여러 프로그래밍 언어에는 "클래스", 한국어로 번역하면 "분반, 개체군" 이라는 개념이 존재한다. 이 개념은 "객체지향 프로그래밍" 과도 깊은 연관성을 가지고 있어, 개발자로써는 알아두어야 할 필수 상식이기도 하다. 클래스는 말 그대로 하나의 그룹, 또는 묶음이라고 생각하면 편하다.가령, '이름', '성별', '나이' 라는 속성이 있고, '이름 부르기', '개명하기', '나이 계산하기' 등의 메서드 (기능) 이 있다고 하자. '이름' 속성과 '이름 부르기', '개명하기' 메서드를 하나로 그룹화하여 관리하는 것이 이들을 개별적으로 분산시키는 것보다 훨씬 작업에 용이할 것이다. 이렇게 비슷한 기능을 하거나 속성을 갖는 요소들을 하나의 객체에 담아 사용하고 관리할 수 있도록 하는 자료구조.. 2021. 12. 12.

[Javascript] Generator (제네레이터) 📍 Intro 지난 글에서 다루었던 Iterator 와 인접하게 사용되는 개념 중 하나가 바로 generator (제네레이터) 이다. 제네레이터는 ES6에서 도입되어, 코드 블록의 실행을 일시 중지했다가 필요한 시점에 재개할 수 있는 특수한 함수이다. 이번 글에서는 generator funciton 과 generator의 활용 방법을 살펴보고자 한다. ✨ Generator MDN 에서 정의하는 generator 는 "generator function (제네레이터 함수) 로부터 반환된 값이며 iterable, iterator protocol 을 준수하는 값" 이다. 위의 정의에서 표기된 Generator function 의 주요 특징은 다음과 같다. 1. 함수 호출자 (caller) 에게 함수 실행의 제어.. 2021. 10. 26.

[Javascript] Iterable (이터러블) 📍 Intro Iterate 는 '반복하다' 는 사전적 의미를 가지고 있는 용어로, 프로그래밍에서는 주로 '반복 가능한 객체' 를 의미한다. 자바스크립트에만 존재하는 개념은 아니지만, 자바스크립트의 이터러블 개념을 학습하면 다른 프로그래밍 용어에도 쉽게 적용할 수 있다. ✨ ES6 에 추가된 Iterable ECMAScript 는 자바스크립트를 표준화하고 토대를 구성하기 위해 만들어진 표준화된 스크립트 프로그래밍 언어이며, ES6은 6번째 ECMAScript 버전을 의미한다. ES6 은 2015년에 제정되었는데, 이전까지 문제가 되었던 많은 부분들이 해결되고 기능이 대거 추가되어 자바스크립트의 가독성과 유지보수성을 향상했다. ES6에는 기존에 없었던 Scope, parameter handling, 구조분.. 2021. 10. 13.

[Javascript] 클로저(Closure) 클로저 (Closure) 는 함수형 프로그래밍 언어에서 사용되는 중요한 특성으로, JS 뿐만 아니라 하스켈이나 스칼라 등의 언어에도 등장한다. MDN 이 정의하는 클로저는 다음과 같다. 클로저는 함수와 함수가 선언된 어휘적(렉시컬) 환경(Lexical environment)의 조합이다. 렉시컬 환경에 대한 논의는 이전 글에서 간략히 했으나, 클로저에 대한 이해를 돕기 위해서 깊이 알아야 하는 개념이므로 렉시컬 환경의 개념부터 알아보자. ✨ 렉시컬 환경과 [[Environment]] 📌 렉시컬 환경 렉시컬 환경은 렉시컬 스코프를 가지고 있다. 렉시컬 스코프는 함수의 스코프와 함수가 정의된 위치에 따라 결정되는 상위 스코프이다. JS 는 렉시컬 환경을 따르기 때문에, 함수의 호출 위치가 아닌 정의한 위치에 .. 2021. 10. 6.

[Javascript] 실행 컨텍스트 (Execution Context) 와 소스코드 이전에 Javascript 에서의 this 를 다뤘던 글에서 잠깐 "실행 컨텍스트"를 언급했었다. Javascript 에는 (그리고 아마 대부분의 프로그래밍 언어에는) 실행 컨텍스트라는 개념이 존재하는데, 이를 잘 이해하기 위해서는 우선 "소스코드" 의 개념부터 이해해야 한다. ✨ 소스코드 ECMAScript 는 소스코드를 4가지 타입으로 구분한다. 소스코드는 타입마다 실행 컨텍스트를 생성하는 과정과 관리 내용이 다르며, 이를 간략히 요양한 내용은 다음과 같다. 📍 전역 코드 (Global code) : 전역에 존재하는 코드 (함수, 클래스의 내부 코드 미포함) 1. 전역 스코프 (최상위 스코프) 생성 2. 전역 객체와 연결 3. var 키워드로 선언된 전역 변수 + 선언된 전역 함수를 전역 객체의 프로.. 2021. 9. 28.

[NodeJS] Node 의 this 란? (+ 화살표 함수의 this) ✨ console.log(this) 의 결과 이전에 정리해두었던 자바스크립트(이하 JS)의 this 에서 주의사항으로 언급했듯, 브라우저에서 실행되는 JS 의 this 와 node 에서 실행되는 JS 의 this 는 다르다. [Javascript] Javascript 의 this 란? ❗ 주의: Node 에서의 this 는 조금 다릅니다. 이 글에서 다루는 내용은 브라우저에서 작동하는 JS 에서의 this 입니다. Javascript 의 this 는 자주 등장하지만, 정확히 알기 힘든 개념이다. 이번 글에서 haeunyah.tistory.com 브라우저의 전역객체는 window 이다. 따라서 전역 scope 에서 console.log(this) 를 입력할 경우 window 가 뜨는 것이 맞다. conso.. 2021. 9. 10.

[Javascript] Javascript 의 this 란? ❗ 주의: Node 에서의 this 는 조금 다릅니다. 이 글에서 다루는 내용은 브라우저에서 작동하는 JS 에서의 this 입니다. Javascript 의 this 는 자주 등장하지만, 정확히 알기 힘든 개념이다. 이번 글에서는 this 의 기초 작동 방식과 바인딩에 대해 설명하고자 한다. this 의 개념에 접근하기 전, 먼저 알아두어야 하는 실행 컨텍스트와 프로퍼티 & 메서드부터 살펴보자. ✨ Javascript 에서의 실행 컨텍스트 이전 글에서 잠깐 언급했지만, Javascript 는 컴파일 언어가 아닌 인터프리터 언어이다. 인터프리터 언어로 작성된 코드는 실행 즉시 인터프리터가 코드를 한줄씩 읽어내려가며 실행한다. 이 때 인터프리터는 코드 해석을 조금이라도 편하게 하기 위해 코드를 작은 조각으로 .. 2021. 9. 7.

[Javascript] 이벤트 루프 (Event Loop) 란? ✨ JS, Event Loop, Single Thread NodeJs 의 single/multi thread 여부를 정리하다보니 Js 의 Event Loop 개념을 조금 더 확실히 알아두어야겠다는 생각이 들었다. [NodeJS] NodeJS 는 Single Thread 일까? Multi Thread 일까? ✨ 고민이 시작된 계기 JS 기초를 학습하던 당시에는 스레드와 프로세스의 기본 개념을 학습해두기만 하고, 구체적으로 살펴보지 못했었다. 웹개발 교육과정이 끝나갈 무렵, 실시간 줌 강의에서 haeunyah.tistory.com 자바스크립트는 싱글스레드 언어이다. 하지만 이전 글에서도 볼 수 있었듯, 멀티스레드처럼 동시에 여러 태스크의 작동이 가능하다. 이 특징은 브라우저 런타임 환경에서도 동일하다. 왜일.. 2021. 9. 7.

이전 1 2 3 다음

티스토리툴바