TIL) 위클리페이퍼 3주차 - 자바스크립트('==', '==='의 차이점, 얕은 복사, 깊은 복사)

oatraspberry·2023년 12월 9일

코드잇 스프린트

목록 보기
3/6
post-thumbnail

코드잇 스프린트 3주차 위클리페이퍼✏️

Q1. 자바스크립트에서 == 와 === 가 어떻게 다른지 설명해 주세요.

A. =====의 차이점

===== 모두 두 값 간의 비교하는 데 사용되는 연산자다.

  1. ==(동등 연산자)
  • 값을 비교하기 전에 데이터 유형을 강제로 변환하여 비교한다.
  • 강제 형변환을 통해 피연산자들을 공통 타입으로 만들고 그 값만 비교한다.
  • 문자열과 숫자 간의 비교 시 문자열을 숫자로 변환한다.

단점: 강제 변환으로 인해 예상치 못한 결과가 발생할 수 있다.

  1. ===(일치 연산자)
  • 값과 데이터 유형 모두를 엄격하게 비교한다.
  • 데이터 유형이 다르면 즉시 false를 반환하며, 값과 데이터 유형이 모두 일치해야 true를 반환한다.

장점: 강제 변환을 하지 않기 때문에 예상치 못한 결과가 줄어든다.


Q2. 자바스크립트에서 얕은 복사(Shallow Copy)와 깊은 복사(Deep Copy)에 대해 설명해 주세요.

A. 얕은 복사와 깊은 복사의 차이점

객체나 배열을 복사하는 두 가지 다른 방법을 나타낸다.

  1. 얕은 복사
  • 얕은 복사는 원본 객체나 배열의 최상위 수준의 속성만을 복사한다.
  • 내부의 객체나 배열은 참조로 복사되기 때문에 원본과 복사본이 서로 영향을 주고 받을 수 있다.
  • 얕은 복사는 Object.assign()이나 전개 연산자(...)를 사용하여 수행할 수 있다.
// Object.assign()을 사용한 얕은 복사
const originalObj = { 
  a: 1,
  b: {
    c: 2
  }
};
const shallowCopyObj = Object.assign({}, originalObj);

// 또는 전개 연산자를 사용한 얕은 복사
const shallowCopyObj2 = { ...originalObj };

originalObj.b.c = 3;
console.log(shallowCopyObj.b.c);  // 3, 내부 객체는 참조로 복사되었으므로 변경이 반영됨

originalObj.b.c = 100;
console.log(shallowCopyObj2.b.c); // 100

  1. 깊은 복사(Deep Copy)
  • 깊은 복사는 원본 객체나 배열과 그 내부의 모든 객체 및 배열을 재귀적으로 복사한다.

    🔎 재귀적으로 복사한다는 것은 무슨 의미일까?
    재귀적으로 복사하는 것은 복사 과정에서 객체나 배열 내부의 다른 객체나 배열이 있을 경우, 이 내부의 객체나 배열에 대해서도 복사를 수행하는 것을 의미한다. 이것은 주로 객체나 배열이 중첩된 경우에 사용된다.

  • 복사본은 원본과 완전히 독립적으로 존재하며, 한 쪽을 수정해도 다른 쪽에 영향을 미치지 않는다.

  • 깊은 복사를 수행하는 방법 중 하나는 외부 라이브러리(예: Lodash의 _.cloneDeep())를 사용하거나, JSON 문자열화와 파싱을 통해 수행할 수 있습니다.

  • 깊은 복사는 편리하지만, 모든 객체가 JSON으로 안전하게 변환 가능한 경우에만 사용할 수 있다. 또한, 내장된 객체나 함수와 같은 특정 데이터 유형은 JSON으로 변환할 수 없으므로 주의해야 한다.

// JSON.stringify()와 JSON.parse()를 사용한 깊은 복사
const originalObj = { a: 1, b: { c: 2 } };
const deepCopyObj = JSON.parse(JSON.stringify(originalObj));

originalObj.b.c = 3;
console.log(deepCopyObj.b.c);  // 2, 변경이 반영되지 않음

  1. 얕은 복사와 깊은 복사를 사용하는 이유

    1. 데이터 변경의 독립성 유지
    • 깊은 복사

      원본 객체나 배열과 그 내부의 객체나 배열이 완전히 분리되어 독립적으로 존재한다.
      이는 복사본을 수정해도 원본에 영향을 주지 않으며, 반대로 원본을 수정해도 복사본에 영향을 주지 않는다.
      따라서 데이터 변경의 독립성을 보장한다.

    • 얕은 복사

    원본과 복사본이 최상위 수준에서만 분리되어 있고, 내부의 객체나 배열은 참조로 복사되기 때문에 내부 객체를 변경하면 서로에게 영향을 미칠 수 있다.

    1. 성능 및 메모리 효율성
    • 얕은 복사

      일반적으로 얕은 복사는 더 가볍고 빠르게 수행된다.
      특히 데이터 구조가 크고 복잡한 경우, 깊은 복사는 성능적으로 부담이 될 수 있다.

    • 깊은 복사

      원본과 복사본이 완전히 독립되어 있기 때문에, 한 쪽에서 데이터를 수정하는 것이 다른 쪽에 영향을 미치지 않으므로 특정 상황에서는 안정성을 제공한다.

profile
개발자가 될테야

0개의 댓글