The Debugging Chronicles : "코드의 미학"

스프레드 문법 (spread syntax): 전개 문법 : ... 은 하나로 뭉쳐있는 여러 값들의 집합을 펼쳐서(전개, 분산하여, spread) 개별적인 값들의 목록으로 만든다. ES6에서 도입되었다. 스프레드 문법을 사용할 수 있는 대상: for...of 문으로 순회할 수 있는 이터러블에 한정된다.=> Array, String, Map,Set, DOM 컬렉션(NodeList, HTMLCollection),arguments 스프레드 문법의 결과여러 값들의 값이 중요한 것이 아니라 값들의 목록이 중요하다.스프레드 문법의 결과는 값이 아니다.스프레드 문법 ... 이 피연산자를 연산하여 값을 생성하는 연산자가 아니라는 뜻이다.스프레드 문법의 결과는 변수에 할당 할 수 없다.const list = ...[1, ..

이터러블 하다는 것은  "하나씩 차례대로 꺼낼 수 있다" 라는 뜻이다. 자바스크립트에서는  배열, 문자열, Map, Set 등 과 같은 것들이 이터러블하다.즉 하나씩 순서대로 꺼내 볼 수 있다는 뜻이다. 특징1. 순서대로 꺼낼 수 있다.배열처럼 하나씩 차례대로 꺼낼 수 있다는 것을 말한다.특징2. 특별한 도구가 있다.자바스크립트에서 이터러블한 애들은 Symbol.iterator라는 숨겨진 도구를 가지고 있어서 꺼낼 수 있다. 예시 (for...of)const fruits = ['apple','banana','cherry'];//for...of를 쓰면 이터러블한 것을 하나씩 꺼낼 수 있다.for(const fruit of fruits){ console.log(fruit); //apple, banana, c..

자바스크립트에서 태그 하나를 DOM이라고 한다.그리고 DOM은 각 각 가지고 가지고  있는 속성을 Property라고 한다. 그런  propety 들이 모여있는 것을 가지고 온것을 Props라고 한다. 그래서 props는 태그가 가지고 있는 속성을 이야기한다. 그럼 props를 어떻게 보내고 가지고 올까? 그림으로 먼저 살펴 보자 A라는 사람의 정보를 컨테이너에서 컴포넌트로 보낸다고 생각해보자  그리고 B라는 사람이 있다고 생각해보자. 그럼 컴포넌트를 만들어서또 정보를 바꿔서 보내줘야한다.또 C라는 사람이 있다면? 그래서 차라리 정보를 변수로 전달하는 것이다. 만약에 홍길동이 값이 들어 왔을 때변수가 인식해서 사용자에게 값만 바꿔서 전달하는 것이다. 컴포넌트는 재사용하고 값이 들어온 것을 그대로 보여주자..

리액트 컴포넌트를 생성할 때 마다직접 작성하기 힘들다 이런 상용구를 단축키로 간편하게 만들 수 있는 extension이다.  확장 프로그램 이름은 Reactjs code snippets 제작자가 charalampos karypidis인 것을 설치하면 된다. 단축키를 살펴 보자면 tirggercontentrsc화살표 함수형 컴포넌트 생성rsf함수형 컴포넌트 생성rcc클래스 컴포넌트 생성rrc클래스 컴포넌트와 react-redux 리덕스를 연결하여 생성rcjcimport와 export 없이 클래스 컴포넌트 생성rwwwdimport 없이 클래스 컴포넌트 생성  rsc를 주로 많이 사용한다.! rsc 치고 tab을 누르면 짠하고 나타난다. 단축키의 더 자세한 내용은  Details에서 확인할 수 있다.