👨🏻‍💻 React Deep Dive[1장 동등비교]

🫨1장은 리액트 개발을 위해 꼭 알아야 할 자바스크립트다.
1장 학습한 내용을 작성하기 앞서,
1장만 무려 20페이지부터 114페이지까지가 1장이였다.
훑어보니 심지어 React에 대한 내용이 아닌 JS에 대한 내용이 다량이였다.
현재 나의 상황을 생각해보니 React로 팀프로젝트를 이번주 토요일부터 진행을
하는데 1장은 잠시 미루고 2장부터 진행을 하려다가 
JS에 대해 완벽히 숙지하고 있지도 않고 
내용량이 많은 이유가 있겠거니 하고 1장부터 진행을 하려고한다.

✅ 1.1 자바스크립트의 동등 비교

---

리액트의 가상 DOM과 실제 DOM의 비교,리액트 컴포넌트가 렌더링할지를 판단하는 방법, 변수나 함수의 메모이제이션 등 모든 작업은 자바스크립트의 동등 비교를 기반으로한다.

🎯 1.1.1 자바스크립트의 데이터 타입

데이터 타입 중 원시타입에는 7가지의 원시타입이 있다.
그 중에 Symbol에 대해 알아보았다.

• Symbol
  Symbol은 ES6에 새롭게 추가된 7번째 타입이다.
  중복되지 않는 고유한 값을 나타내기 위해 만들어졌다.
  심벌은 함수를 이용해서만 만들 수 있다.
  ex : Symbol()을 사용해야만 한다.

   <script>
  //Symbol 함수에 같은 인수를 넘겨주더라도 이는 동일한 값으로 인정되지않음.
  // 심벌 함수 내부에 넘겨주는 값은 Symbol 생성에 영향을 미치지 않음. (Symbol.for 제외)
  const key = Symbol('key');
  const key2 = Symbol('key');
  
  key === key2 // false 
  
  //동일한 값을 사용하려면 Symbol.for을 활용한다.
  Symbol.for('Hi') === Symbol.for('Hi')// true
  </script>

• 객체 타입
  객체 타입을 간단하게 정의하면 원시타입 외의 모든 타입이 객체타입이라고한다.
  배열 함수 정규식 클래스 등 포함이 된다.

  💡 객체타입(object type)은 참조를 전달한다고 해서 참조 타입(reference type)으로 불린다고한다.

   <script>
  typeof [] === 'object'; //true
  typeof {} === 'object'; //true
  
  function hello() {}
  typeof hello === 'function' // true
  
  const hello1 = function (){}
  
  const hello2 = function (){}
  
  //객체인 함수의 내용이 육안으로는 같아 보여도 참조가 다르기 때문에 false가 반환된다.
  hello1 === hello2 // false
  </script>

🧐 다음 글에는 동등 비교의 특징에 대해 알아보자.