본문 바로가기

Front-end56

== 와 === 차이 명확하게 알아보기 ==는 Equal Operator이고, ===는 Strict Equal Operator이다. ==는 a == b 라고 할때, a와 b의 값이 같은지를 비교해서, 같으면 true, 다르면 false라고 한다.(값만 같으면 true이다.) ===는 Strict, 즉 엄격한 Equal Operator로써, "엄격하게" 같음을 비교할 때 사용하는 연산자이다. ===는 a === b 라고 할때, 값과 값의 종류(Data Type)가 모두 같은지를 비교해서, 같으면 true, 다르면 false라고 한다. 숫자와 문자열을 비교할 때, 문자열을 숫자로 변환한다. JavaScript는 문자열의 숫자 리터럴을 Number형의 숫자로 변환하려고 한다. 처음에 그 문자열의 숫자 리터럴부터 수학적인 값을 이끌어 낸다. 그 다음.. 2023. 4. 27.
Storybook 컴포넌트 기반 개발환경(Component-Driven Development)(CDD) Story는 args를 넘긴 UI Component 가 어떻게 렌더링 되는지 확인하기 위한 도구입니다. Storybook을 정적파일로 만들어 UI 배포용 웹으로 만들 수 있습니다. 하나의 UI Component는 하나 이상의 Story를 가질 수 있습니다. 사용자 인터랙션을 작성하고 화면을 전부 렌더링 해야하는 E2E 테스트보다 간편히 Component 테스트를 진행할 수 있습니다. Story 파일은 개발 전용이며, 상용 번들에 포함되지 않습니다. 사용법 : 1. 기존 프로젝트에 Storybook 설치 npx -p @storybook/cli sb init --type vue Storybook initial file tr.. 2023. 2. 15.
Vuex 부제 : Vue API 모듈 개발시 Axios 모듈만 별도 개발하지 않고 Vuex 에서 개발하는 이유 기반 지식 3줄 요약: Vue 에서 사용되는 MVVM(Model-View-ViewModel) 패턴은 ‘이벤트 기반 프로그래밍’ 을 단순화 하기 위해 만든 ‘프레젠테이션 모델 디자인패턴’에서 파생됐다. Vue 는 데이터(상태)를 중심으로 움직인다. 데이터(상태)가 바뀌면 ViewModel 객체가 바라보고 있다 감지하여 View를 자동으로 변경한다. 어떤 컴포넌트, 어떤 메서드에 의해, 언제 변경되는지 알기 힘들다. 이 때문에 Vuex 를 사용한다. 단방향으로 흐르는 Vuex : Vue Components 에서 액션 발생 → Action API 호출 후 데이터 변이 → Mutation 결과 데이터를 받아 상.. 2023. 2. 3.
함수형 Vue 함수형 프로그래밍 로직처리를 수학적 함수의 계산으로 취급하고 상태와 가변 데이터를 멀리하는 프로그래밍 패러다임 함수의 실행이 프로그램 실행에 영향을 미치지 않음 데이터의 변경이 필요한 경우, 원본 데이터 구조를 변경하지 않고 그 데이터의 복사본을 만들어서 그 일부를 변경하고, 변경한 복사본을 사용해 작업을 진행 반복이 for문이 아닌 재귀를 통해 이루어짐 (deep copy) (filter, map, reduce...), 재귀적 코드 스타일은 무한 루프에 빠질 위험 함수형 프로그래밍에서는 함수가 1급 객체가 된다. 1급 객체의 특징은 다음과 같다. 변수나 데이터 구조안에 담을 수 있다. 파라미터로 전달 할 수 있다. 반환값(return value)으로 사용할 수 있다. 할당에 사용된 이름과 관계없이 고유.. 2022. 12. 22.

티스토리툴바