JS 복사 방법과 변수의 차이

1. 얕은 복사(Shallow Copy)와 깊은 복사(Deep Copy)

💻얕은 복사
자바스크립트에서 얕은 복사는 객체, 배열의 주소값을 복사하는 것을 뜻합니다.
주소값만 복사했기 때문에 복사본의 코드를 변경하면 원본의 코드도 변경이 됩니다.

let obj = { a: "안녕하세요?" };
let obj2 = obj;
console.log(obj); // { a: "안녕하세요?" };
console.log(obj2); // { a: "안녕하세요?" };

obj2.a = "반갑습니다.";

console.log(obj); // { a: "반갑습니다." };
console.log(obj2); // { a: "반갑습니다." };

💻깊은 복사
얕은 복사는 복사본의 값을 수정하면 원본의 코드도 변경되는 불편함이 있지만 깊은 복사는 주소값을 복사하는 것이 아닌 값 그 자체를 복사하는 것이기 때문에 복사본의 값을 변경하더라도 원본에 영향을 끼치진 않습니다.

let obj = { a: "안녕하세요?" };
let obj2 = JSON.parse(JSON.stringify(obj));
console.log(obj); // { a: "안녕하세요?" };
console.log(obj2); // { a: "안녕하세요?" };

obj2.a = "반갑습니다.";

console.log(obj); // { a: "안녕하세요?" };
console.log(obj2); // { a: "반갑습니다." };

2. var, let, const의 중복 선언 허용, 스코프, 호이스팅 관점

1. var

• 중복 선언 : 가능
• 스코프 : 함수 내에서 변수 지정하고 함수 밖에서 호출해도 오류가 나지 않음.
• 호이스팅 : 변수 선언 전에 호출이 가능하지만 undefined라는 결과가 나옴.

2. let

• 중복 선언 : 불가
• 스코프 : 함수 내에서 변수 지정하고 함수 밖에서 호출하면 오류남.
• 호이스팅 : 변수 선언 전 호출하면 오류남.

3. const

• 중복 선언 : 불가
• 스코프 : 함수 내에서 변수 지정하고 함수 밖에서 호출하면 오류남.
• 호이스팅 : 변수 선언 전 호출하면 오류남.