|
프론트엔드 개발자 허원호입니다.

Yarn berry 적응기 1 (함수형 코딩 스터디)

함수형 스터디 시작 약 5년간 프론트엔드 개발 업무를 진행하면서 적극적이고 주도적인 스터디를 진행해본적이 없는 것 같아 주변 지인분에게 먼저 스터디 제안을 하였고 긍적적인 답변을 받아 최근 “쏙쏙 들어오는 함수형 코딩” 스터디를 시작하게 되었습니다. 아무래도 기록을 남기고 서로 의견을 공유하는 더 의미있는 스터디를 진행해보고자 하는 의견을 받게 되었고 스스로도 기록을 남기는데에 중요성을 느끼게 되어 직접 코드도 작성해보고 서로 리뷰 및 질의 응답을 하는 방식으로 진행하는 것으로 결정 되었습니다. typescript, jest 를 적용하여 각자 연습문제를 리팩토링 or 구현을 하여 PR을 올리면 git action을 통해 테스트 코드로 검증하도록 저장소를 구축하기로 결론을 내렸습니다. Yarn Berry 적응기 1탄 Yarn Berry에 대한 다양한 블로그 포스팅 글과 기존 프로젝트에 적용해보고자 하는 호기심이 있었는데 이번 스터디 저장소가 규모도 작고 기록용이다보니 부담없이 적용해…

August 06, 2023
삽질
Set과 Map

Set 중복되지 않은 유일한 값들의 집합 Set객체는 인덱스로 접근할 수 없으며 요소 순서에 의미가 없고 중복값을 포함하지 않는 특징을 가지고 있습니다. Set 객체 생성 Set은 Set 생성자 함수를 통해 생성하며 인수를 비우면 빈 Set객체를 반환하며 인수에는 이터러블만 전달 할 수 있습니다. Set 객체 요소 추가, 개수 확인, 삭제, 존재 여부 확인, 요소 일괄 삭제 요소 순회 Set 객체의 요소 순회는 Set.prototype.forEach 메서드를 통해 순회가능하며 forEach 내부의 콜백함수의 인수로 첫번째와 두번째는 요소값 세번째는 set 객체 자체를 전달 받습니다. 인수에 동일한 요소값임에도 불구하고 전달하는 이유는 Array.prototype.forEach 메서드의 콜백함수와 동일한 구조를 취하기 위함입니다. Set 객체또한 이터러블이기 때문에 for of 문으로 순회가 가능합니다. 단 Set 객체는 요소의 순서에 의미가 없으나 순회시에는 요소가 추가된 순서대로…

July 31, 2023
자바스크립트 딥다이브
이터러블

이터러블 이터레이션 프로토콜 순회 가능한 데이터 컬렉션(자료구조)를 만들기 위해 ECMAScript 사양에 정의하여 미리 약속한 규칙 이터러블 프로토콜 Well-known Symbol 인 Symbol.iterator 를 프로퍼티 키로 사용한 메서드를 직접 구현하거나 프로토타입 체인을 통해 상속 받은 Symbol.iterator 를 호출하면 이터레이터 프로토콜을 준수한 이터레이터를 반환한다. 이터러블 프로토콜을 준수한 객체를 이터러블이라고하며 for of 문으로 순회 할 수 있으며 스프레드 문법과 배열 디스트럭쳐링 할당의 대상으로 사용할 수 있다. 이터레이터 프로토콜 Symbol.iterator를 호출해 반환된 이터레이터는 next 메서드를 소유하며 이를 호출하게되면 value와 done을 갖는 이터레이터 리절트 객체를 반환한다. 이터레이터 프로토콜을 준수한 객체를 이터레이터라고 함 이터레이터는 이터러블 요소를 탐색하기위한 포인터 역할을 함 이터러블 Symbol.iterator를 프…

July 30, 2023
자바스크립트 딥다이브
Symbol

심벌? ES6에서 도입된 7번째 데이터 타입이자 원시타입의 값으로 변경 불가능하며 중복되지 않는 유일 무이한 값이다. 심벌 값의 생성 Symbol 함수 다른 원시타입의 값과 달리 Symbol 값은 리터럴이 아닌 Symbol 함수를 사용해야만 생성할 수 있다. 이때 생성된 값은 절대 중복 되지 않는 값이 된다. 또한 외부에 노출되지 않는 값이다. 심벌 값은 암묵적으로 문자열이나 숫자 타입으로 변환되지 않고 불리언 타입으로만 변환이 가능하다. Symbol.for / Symbol.keyFor Symbol.for 메서드는 인수로 전달받은 문자얼을 키로 사용하여 키와 심벌값의 쌍들이 저장되어있는 전역 심벌레지스트리에서 해당 키와 일치하는 심벌 값을 검색한다. Symbol 함수는 매번 새로운 심벌값을 생성하지만 Symbol.for를 사용하면 중복되지 않는 단 하나의 심벌 값을 생성하여 어플리케이션 전역에 공유할 수 있다. 검색에 성공하면 검색된 값을 반환하며 검색에 실패하면 심벌 레지스트리에…

July 30, 2023
자바스크립트 딥다이브
More