[멋쟁이 사자처럼 프론트엔드 스쿨] 32일차 TIL - 객체, 구조 분해 할당, 객체 복사, 가비지 컬렉션

🍰 목감기 3일 째, 수업 도중 뜨거운 물을 계속 들이켰다. 

🍴 객체

: key: value 쌍으로 구성된 엔티티(entity) 데이터 구조

const authUser = {
  uid: 'user-09077',
  name: 'lee',
  email: 'lee@naver.com',
  isSignIn: false,
  permission: 'paid', // paid | free
};

// 점 표기법으로 객체의 프로퍼티 출력
console.log(authUser.uid);

// 대괄호 표기법으로 출력
console.log(authUser['uid']);

🍴 프로퍼티 제거(remove) / 삭제(delete)

: 제거 - 비워둠, 삭제 - 메모리까지 날림

🍴 구조 분해 할당(destructuring assignments)

: 구조화된 배열 같은 이터러블 혹은 객체를 destructuring(비구조화)하여 1개 이상의 변수에 개별적으로 할당하는 것.

const arr = [1, 2, 3];

const [a1, a2, a3] = arr;
console.log(a1, a2, a3); // 1 2 3

변수에 기본값 설정 가능

• 기본값보다 할당된 값이 우선함

const [a, b = 10, c = 20] = [1, 2];

console.log(a, b, c); // 1, 2, 20

객체 구조 분해 할당

let user = { firstName: 'j', lastName: 'lee'};

const { lastName, firstName } = user;
console.log(firstName, lastName); // j lee

🍴 참조에 의한 복사

: 새로운 객체 생성하지 않고 기존 객체의 참조(주소)만 복사하는 것

let a = [1, 2, 3];
let b = a; // 참조 복사
b.push(4);

console.log(a); // [1, 2, 3, 4]
console.log(b); // [1, 2, 3, 4]

🍴 얕은 복사 (Shallow Copy)

: 객체의 1차원(첫 번째 레벨)만 복사, 중첩된 객체들은 여전히 원본 객체 참조

/* Object.assign()을 이용한 얕은 복사 */
let original = { a: 1, b: { c: 2 } };
let copy = Object.assign({}, original);

copy.a = 10;
copy.b.c = 20;

console.log(original); // { a: 1, b: { c: 20 } }
console.log(copy);     // { a: 10, b: { c: 20 } }

/* spread 연산자를 이용한 얕은 복사 */
let original = { a: 1, b: { c: 2 } };
let copy = { ...original };

copy.a = 10;
copy.b.c = 20;

console.log(original); // { a: 1, b: { c: 20 } }
console.log(copy);     // { a: 10, b: { c: 20 } }

🍴 깊은 복사 (Deep Copy)

: 객체의 모든 레벨을 복사하여 중첩된 객체들까지 새로운 객체로 만듦

🍴 가비지 컬렉션(GC)

: 런타임 환경에서 더 이상 사용되지 않는 동적 할당 메모리를 자동으로 해제하여 메모리 누수를 방지하고 프로그램의 메모리 사용을 최적화하는 메커니즘.