Bin's Blog

타입을 미리 정하기 애매할 때 Union Type(타입 2개 이상 합친 새로운 타입 만들기) // Union Type(타입 2개 이상 합친 새로운 타입 만들기) let 회원 :(number | string | boolean) = 123; 회원 = 123; // 숫자 or 문자가 가능한 array 타입지정 let 회원들 : (number | string)[] = [1, "2", 3]; // 숫자 or 문자가 가능한 object 타입지정 let 오브젝트: {data : string | number} = { data : '123' }; // 왜 타입맞는데 +1이 안 되니? // 타입은 엄격한 거 좋아한다고 했다. // union type은 허용하지 않는다. (새로운 타입을 만드는 거니까) // string ..

1. Component 더러운 html을 깔끔하게 한 단어로 축약하고 싶을때 componenet를 사용 첨보는 사람들도 이해할 수 있다 컴포넌트 만드는 법 function 만들고 다른 function 바깥에 만들자 영어 대문자로 시작 return()안에 html 담기 하나의 태그로 시작해서 하나의 태그로 끝나야한다. 병렬로 집어넣는게 안 돼 만약에 병렬기입하려면 div 두 개로 묶은 부분을 하나 더 크게 div로 묶는다. 의미없는 대신 사용가능 전문용어로 fragment라고 한다. 쓰기 이렇게도 사용 가능하다. 컴포넌트 언제 쓰면 좋은가? 반복적인 html 축약할 때 큰 페이지(페이지 전환시) 자주변경되는 UI && html 들 컴포넌트의 단점 State를 가져다 쓸 때 문제 생긴다. 다른 함수에 있을때..

1. 전략 패턴이란? 정책 패턴이라고도 하며, 행위를 바꾸고 싶은 경우 "직접" 수정하지 않고 전략이라고 부르는 "캡슐화한 알고리즘"을 컨텍스트 안에서 바꿔주면서 상호 교체가 가능하게 만드는 패턴이다. 예를 들어, 우리는 학교에 가는 방법으로 걷기, 자전거 타기, 버스 타기 등 여러 가지 방법을 선택할 수 있다. 전략 패턴은 이렇게 여러 가지 방법 중 하나를 선택해서 사용할 수 있도록 도와주는 도구이다. 이렇게 전략 패턴을 사용하면, 프로그램이 실행되는 도중에 어떤 작업을 어떻게 할지 바꿀 수 있어서 유연하게 대처할 수 있다. * 캡슐화? 데이터와 그 데이터를 처리하는 함수를 하나의 "캡슐"처럼 묶는 것을 말한다. 이렇게 하면 데이터와 관련된 기능들이 서로 관계가 있기 때문에 코드를 이해하고 유지보수하..

1. Map() 객체란? Map() 객체는 키-값 쌍을 저장하는 데이터 구조이다. ECMAScript 6(ES6-2015)에 도입됐다. 객체와 비슷하게 동작하지만 몇 가지 다른 특징이 존재한다. 2. Map() 객체의 특징 키의 다양성: 기존 객체에서는 문자열 또는 심볼만 키로 사용할 수 있었다. Map 객체는 다양한 데이터 타입을 키로 사용할 수 있다. 객체, 함수, 원시 타입(문자열, 숫자, boolean 등) 모두 가능하다. 순서 보존: Map 객체는 삽입 순서를 유지한다. 즉, 키-값 쌍을 순회할 때 삽입된 순서대로 처리된다. 기존의 객체는 원래 순서를 유지하지 않고 있다가 ES6부터는 대부분 자바스크립트 엔진에서 객체의 속성을 정의한 순서대로 속성을 순회한다. 단, 이는 문자열 키를 갖는 속성에..

1. 불변 객체란 이전에 참조형 데이터에 대해서 살펴봤을 때, 참조형 데이터의 가변은 데이터 자체가 아닌 내부 프로퍼티를 변경할 때만 성립한다. 데이터 자체를 변경하려고 하면 기본형 데이터와 마찬가지로 기존 데이터는 변하지 않는다. 불변성을 확보할 필요가 있을 경우에 불변 객체를 취급하고, 그렇지 않은 경우에 기존 방식대로 사용하는 식으로 상황에 따라 대처한다. 불변 객체가 필요한 경우는 값으로 전달받은 객체에 변경을 가하더라도 원본 객체는 변하지 않아야 하는 경우가 종종 발생한다. 객체의 가변성에 따른 문제점 let user = { name: "Jaenam", gender: "male" }; let changeName = (user, newName) => { let newUser = user; newU..