9/9 학습

JS의 원시 타입과 참조 타입

let str = 'hello';
let num = 100;
let arr = [1, 2, 3];

• stack메모리에는 원시 타입의 값, 참조 타입의 메모리 주소, 변수가 저장된다. 추가적으로 함수, 클래스도 stack에 저장된다.(정적인 값들)
• heap메모리에는 참조 타입(배열, 객체)의 실체가 저장되어 있다.

전개 구문(spread syntax)

• 배열이나 문자열을 인수 또는 요소로 확장한다.

let arr = [1, 2, 3];

function arrMax(arg){
    return Math.max(...arg);
};

console.log(arrSum(arr));  //3

• for...of 구문을 사용할 수 있는 이터러블에 사용된다. 이터러블이 아닌 일반 객체는 사용할 수 없다.
• 전개 구문의 결과문은 값으로 사용할 수 없다.

let arr = [1, 2, 3];
let arrSpr = ...arr; //사용 불가

• spread를 이용한 새 배열 생성
  • 주의할 점은 현재 레벨보다 깊은 곳은 참조 주소가 복사된다.(얕은 복사)

let arr1 = [1, 2, 3];
let arr2 = [4, 5, [6, 7]];

let arrMerg = [...arr1, ...arr2];
console.log(arrMerg);  //[ 1, 2, 3, 4, 5, [ 6, 7 ] ]

//arrMerg의 원시 타입을 수정했을 경우
arrMerg[0] = 10;
console.log(arr1); //[ 1, 2, 3 ] 원본 배열은 그대로

//arrMerg의 참조 타입을 수정했을 경우
arrMerg[5][0] = 10;
console.log(arr2); //[ 4, 5, [ 10, 7 ] ] 원본 배열 변동

console.log(arr2[2] === arrMerg[5]);  //true   같은 메모리 주소를 참조한다

출처
https://aerocode.net/378?category=740143
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Spread_syntax
이웅모, 모던 자바스크립트 Deep Dive(2021)