책 읽다가 코딩하다 죽을래

이 글은 자바스크립트 Deep Dive 이터러블 편을 읽고 개인적으로 정리한 글입니다.이터러블이란 이터러블 프로토콜을 준수한 객체를 말한다.말 그대로 프로토콜이니 원활한 통신을 위해 지키기로 약속한 규약이다. HTTP 프로토콜처럼 말이다.그럼 이터러블은 무엇이고, 이걸 왜 지켜야하는지 알아보도록 하자.📕 이터러블 프로토콜과 이터레이터 프로토콜이터러블은 두 가지의 프로토콜을 준수하고 있는데 그것은 바로이터러블 프로토콜과 이터레이터 프로토콜이다. 이터러블 프로토콜은 Well-Known Symbol인 Symbol.iterator를 프로퍼티 키로 사용한 메서드를 직접 구현하거나 프로토타입 체인을 통해 상속받은 Symbol.iterator 메서드를 호출하면 이터레이터 프로토콜을 준수한 이터레이터를 반환하는 것을..

📕 시스템 설계란? 시스템의 요구사항을 충족하기 위해 필요한 아키텍처, 인터페이스 및 데이터를 정의하는 과정이다.소프트웨어를 구성하는 요소들 간이 관계와 동작 메커니즘을 표현하기 위한 구조체이다. 설계가 후순위가 되면 시스템을 개발하는 비용이 더 많이 들고, 일부 또는 전체 시스템에 변경을 가하는 일이 현실적으로 불가능해진다.- 책 clean Archictecture 중   📗 시스템 설계의 필요성 1. 개발이 진행된 이후에는 이미 개발된 전체 시스템의 구조를 수정하기가 어렵기 때문에 미리 설계를 해야 한다.2. 설계 과정이 있어야 확장성, 보안 등 시스템에 요구되는 다양한 요구사항을 충족시킬 수 있는지 미리 알아볼 수 있다.3. 시스템 수정이 필요할 때 어느 부분을 수정해야 하고 어느 부분은 건드리..

최근에 달러의 금리가 높은데도 불구하고 금 가격 또한 내리지 않고 오히려 금과 함께 올라가는 이례적인 현상이 일어나고 있다. 이러한 현상에 대한 이유는 아주 확실하진 않지만 우리가 앞으로 금에 투자해야 하는 이유인 것은 확실하다. 안전자산의 대표주자인 금을 알아보자 📕 금이란 건 뭘까? 금은 안전자산의 대표주자이며 역사적으로 안전성으로 검증된 진짜 돈이다. 금은 다음과 같은 특징을 갖고 있다. 안전 자산 및 안정성: 금은 특히 경제적 불확실성이나 인플레이션 기간 동안 오랫동안 안전한 피난처 자산으로 여겨져 왔다. 인플레이션이나 지정학적 불안정으로 인해 가치가 하락할 수 있는 법정화폐와 달리 금은 시간이 지나도 그 가치를 잘 유지하는 경향이 있다. 이러한 안정성은 자신의 자산을 인플레이션와 같은 경제적 이..

자바스크립트 심볼(Symbol)은 ES6에서 도입된 7번째 데이터 타입으로 다음과 같은 특징이 있다. 1. 원시값(primitive)이다. 2. 한 번 초기화되면 변경이 불가능하다. 3. 다른 값과도 중복되지 않는 유일무이한 값이다. 심볼은 한 번 선언되면 프로그램이 종료될 때까지 다른 값과 중복되지 않는다는 특징이 있기 때문에 ES6에 도입되었다. 심볼은 다른 데이터 타입에 비해 많이 사용되지는 않지만 iterable, generator 등의 내부시스템의 기본적으로 들어가 있는 개념이므로 심볼을 학습할 필요성이 있다. 📕 심볼 생성 심볼은 Symbol 함수를 호출하여 생성한다. const symbol = Symbol(); 심볼은 다른 원시형 데이터 타입과는 달리 리터럴 표기법이 아닌 Symbol 함수를..

우리는 흔히 this는 자기 참조, super는 부모 참조라는 간단한 공식으로 그 동작 원리를 쉽게 추론하고 있다. 본 글을 통해 this와 super의 동작 원리에 대해 배워보자 📕 this의 동작 원리 다음 코드 예시를 보자 class Person { age: number; name: string; constructor(age: number, name: string) { this.age = age; this.name = name; } getGoal(): string { return "끝까지 생존하며 자신과 똑같은 형질의 개체를 후손으로 남기는 것"; } introduce(): string { return `안녕하세요. 저는 ${this.name}입니다. ${ this.age }살이며 ${this.ge..

React에서 Tailwind CSS 클래스 오버라이딩 문제 해결하기 Tailwind CSS는 빠르게 사용자 인터페이스를 구축할 수 있는 인기 있는 유틸리티 기반 CSS 프레임워크입니다. 그러나 React와 함께 Tailwind CSS를 사용할 때 클래스 오버라이딩과 관련된 일반적인 문제가 발생할 수 있습니다. 이 글에서는 이 문제를 탐구하고 해결하는 방법을 제시합니다. ❗️문제점 Tailwind CSS를 사용하여 사전에 스타일이 지정된 파란색 버튼을 렌더링하는 간단한 React 컴포넌트가 있다고 가정해 보겠습니다. 이 컴포넌트는 사용자가 버튼을 더 많이 커스터마이즈 하기 위해 추가적인 클래스를 추가할 수 있도록 합니다. 다음은 해당 컴포넌트의 예입니다. function Button({ label, cl..

🤔 메시지? 메서드? 객체지향 공부를 하다 보면 자주 나오는 단어가 있습니다. 그것은 '메시지'와 '메서드' 인데, 이 단어들이 같은 맥락에서 설명되어있다 보니 두 개의 단어가 비슷한 뜻일 거라고 생각하면서 넘어가거나, 알아내려고 공부해도 계속 헷갈리는 분들이 많을 것입니다. 결론부터 말하자면 '메시지'와 '메서드' 는 같은 개념이 아닙니다. 더욱이 '메시지'와 '메서드' 를 구분할 수 있어야지 객체지향의 꽃인 다형성을 이해할 수 있을 것입니다. 이번 시간에는 이 두 개의 단어가 정확히 무엇이며 간단한 예시를 들어 설명할 테니 잘 따라와 주길 바랍니다. 일단 이 두개의 사전적 정의부터 봅시다. 메시지는 객체간의 협력관계에서 상호작용할 수 있는 모든 방법을 말합니다. 메서드는 수신된 메시지를 처리하기 위한..

어그로 미안하다.. 그치만... 이렇게라도 하지 않으면... 아무도 안온다고.. 😭 이 글을 읽기 전에 스코프와 실행 컨텍스트의 개념을 알고 있으셔야 합니다. 2021.11.03 - [코딩/자바스크립트] - 자바스크립트 실행 환경(Execution Context)이란 무엇인가 자바스크립트 실행 환경(Execution Context)이란 무엇인가 🤔 실행 환경을 배워야 하는 이유 코드는 정적이다. 여러분들이 코딩을 끝마치고 컴파일을 하여도 변함이 없고 실제 런타임 때나 서버가 돌아가는 와중에도 코드는 자기가 스스로 변하지 않는 ablue-1.tistory.com 🤔 클로저의 의미 클로저(Closure).. 이름만으로는 무엇을 하는지 모르는 친구다. 유명한 JS서적에서도 각각 이 친구를 다르게 정의해 놓았다..