10강을 아이패드에 정리하느랴고 포스팅 못했다.
다시 자바스크립트가 지원하는 타입에 대해 살펴보면 원시타입과 객체타입으로 나뉜다.
원시타입 vs 객체타입
📌 원시타입은 변경 불가능한 값이고, 객체타입은 변경 가능한 값이다.
📌 원시 값을 변수에 할당하면 변수에는 실제 값이 저장되지만 객체를 할당하면 메모리공간 값(참조값)이 저장된다.
📌 원시 값을 갖는 변수를 다른 변수에 할당하면 원시값이 복사 = 값에 의한 전달
📌 객체를 가리키는 변수를 다른 변수에 할당하면 원본의 참조값이 복사 = 참조에 의한 전달
원시 값
한 번 생성된 원시 값은 읽기 전용으로서 변경할 수 없다.
값을 변경하지 못한다는 게 무슨 의미일까?
이 때 값과 변수를 구분지어 생각해야한다.
변수는 값을 저장하기 위한 메모리 공간 or 식별하기 위한 이름이고, 값은 표현식이 평가되어 생성된 결과이다.
할당된 값이 변경될 때,
1) var score;
메모리공간 000001 에 undefined 로 값 저장되어있음
2) var score = 80;
메모리공간 000002 에 80 로 값 저장되어있음
3) score=50; (재할당)
메모리공간 000003 에 50 로 값 저장되어있음
문자열과 불변성
숫자는 0이든 20이든 똑같이 8바이트가 필요하지만 문자타입의 경우 한 글자당 2바이트씩 필요하다.
자바스크립트는 문자열도 원시타입으로 제공하기 때문에 불변성을 가진다. 다만 유사 배열객체이기 때문에 인덱스 접근, length 프로퍼티를 갖지만 변경은 불가하다.
var str="Hello';
console.log(str[0]);//H
str[0]=h;
console.log(str);//Hello값이 변경되지 않고 그대로
값에 의한 전달
- 값이 할당되는 시점에 두 변수가 가리키는 값이 같다가 하나에 재할당이 일어났을 시 다른 메모리 주소 값을 가리킴.
- 값이 할당되는 시점부터 다른 메모리 주소를 가리킴.
객체
객체는 프로퍼티의 제한이 없기 때문에 미리 메모리의 주소를 지정할 수 없다.
변경가능한 값
객체는 원시값과 달리 생성과 변경이 부담이 많이 간다. 자바스크립트에서의 객체는 크기가 일정하지도 않고 계속해서 추가 변경이 가능하기 때문이다. 그래서 변경 가능하게 만들어뒀는데 대신 여러개의 식별자가 하나의 객체를 공유할 수 있다는 단점이 있다.
🤔 얕은 복사 vs 깊은 복사
- 얕은 복사 : 객체의 한 단계만 복사하는 것, 객체를 할당한 변수를 다른 변수에 할당하는 것
- 깊은 복사 : 중첩된 객체들까지 모조리 복사하는 것, 원시 값을 할당한 변수를 다른 변수에 할당하는 것
// 얕은복사
const 0={x:1,{y:2}};
const c1={...o};
//lodash 이용한 깊은 복사
//npm lodash 해줘야함
const _ = require('lodash');
const c2 = _.cloneDeep(o);참조에 의한 전달
여러개의 식별자가 하나의 객체를 공유하면 무슨 문제가 생길까?
const person={
name:'Lee'
}
// 얕은복사
const p1=person;지금 p1 에 해당하는 메모리 주소 값에 person 에 있는 참조 값과 같은 값이 들어가있음.
p1 : 000001
person : 000001
000001: const person={
name:'Lee'
}
이런식으로 있다고 생각하자.저장된 메모리 주소는 다르지만 참조 값이 같기 때문에 한쪽에서 재할당이 일어나도 두 곳에 영향을 미친다.
const person={
name:'Lee'
}
// 얕은복사
const p1=person;
person.age=20;
console.log(p1===person)//true 똑같아여마지막 퀴즈
var person1={
name="Lee"
}
var person2={
name="Lee"
}
console.log(person1===person2); //1. false
console.log(person1.name===person2.name); //2. true1번 같은 경우에는 참조값이 다르기 때문. fasle
2번은 표현식이기 때문에 원시값으로 비교된다. 같으니까 true
