이상한 Reference data type과 더 이상한 예제 3개
Primitive data type
- 그냥 문자와 숫자
- 변수에 값이 그대로 저장됨
Reference data type
var 변수 = 1234;
var 어레이 = [1,2,3]; // 변수에 [1,2,3]이 저장된 게 아니라, reference가 저장됨
- Array, Object는 변수에 값이 저장이 안된다. 변수에 **reference**가 저장된다.
- [1,2,3]이 저쪽에 있어요(화살표) 를 저장함
종류
- Array
- Object
Reference data type 다루기 예시 1: 복사
Primitive data type
var 이름1 = '김';
var 이름2 = 이름1;
console.log(이름1); // 김
console.log(이름2); // 김
이름1 = '박';
console.log(이름1); // 박
console.log(이름2); // 김
Reference data type
var 이름1 = { name: '김' };
var 이름2 = 이름1;
console.log(이름1); // { name: '김'}
console.log(이름2); // { name: '김'}
이름1.name = '박';
console.log(이름1); // { name: '박'}
console.log(이름2); // { name: '박'} -> 이름2는 데이터를 변경한 적이 없는데?
Reference data type은 이름1에는 {name: '김'}이게 저장되는 게 아니라, {name:'김'}이 담긴 **PC의 메모리가 저기있어요** 라고 가리키는 **화살표(reference)가 저장**된다.
코드를 다시 보자. 이름2는 {name: '김'} 오브젝트가 있는 게 아니라, 이름1의 화살표를 복사한다.
var 이름1 = 화살표;
var 이름2 = 이름1 = 화살표;
그림으로 나타내면 이렇다.
![01](.\images\01.png)
이름1.name = '박'으로 바꾸면,
![02](.\images\02.png)
그래서 array, object는 함부로 복사하면 큰일난다!
그럼 복사하고 싶을 땐 어떻게 하나?
- object 복사 기계(constructor)를 만들어서 찍어내면 된다(다음시간에 배울 것임).
- 각각 다른 reference를 가지도록 작성한다.
var 이름1 = { name: '김'};
var 이름2 = { name: '박'};
새 중괄호를 할당할 때마다 새로운 화살표를 만든다.
![](.\images\03.png)
Reference data type 다루기 예시 2:
var 이름1 = { name: '김'};
var 이름2 = { name: '김'};
console.log(이름1 == 이름2); // false
이름1의 화살표 !== 이름2의 화살표. 따라서 false다.
![](.\images\04.png)
Reference data type 다루기 예시 3:
오브젝트를 변경해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj.name = 'Park';
}
변경(이름1); // {name: 'Park'}
➡️ 변경 성공
오브젝트를 재할당해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj = { name: 'park'};
}
변경(이름1);
console.log(이름1); // { name: '김'}
➡️ 실패. 안바뀜.
parameter와 reference datda type의 합작이다. **파라미터는 변수생성 & 할당과 똑같다.**
오브젝트에 이름1을 넣으면,
변경(이름1) = 변경(var obj = 이름1)
이거랑 똑같다. 이름1 화살표를 하나 복사해서 obj에 집어넣은거다. 그래서 obj도 이름1과 똑같은 곳을 화살표로 가리킨다.
![](.\images\05.png)
그리고 이 obj에 새로운 오브젝트를 할당하자. 그러면 이렇게 된다.
![](.\images\06.png)
그래서 이름1에 재할당한게 아니라, obj에 재할당한거다. 그래서 이름1은 그대로다.
**그 파라미터 변수에 = {} 해봤자 원래 이름1 오브젝트는 변화가 없다.**
Primitive data type
- 그냥 문자와 숫자
- 변수에 값이 그대로 저장됨
Reference data type
var 변수 = 1234;
var 어레이 = [1,2,3]; // 변수에 [1,2,3]이 저장된 게 아니라, reference가 저장됨
- Array, Object는 변수에 값이 저장이 안된다. 변수에 **reference**가 저장된다.
- [1,2,3]이 저쪽에 있어요(화살표) 를 저장함
종류
- Array
- Object
Reference data type 다루기 예시 1: 복사
Primitive data type
var 이름1 = '김';
var 이름2 = 이름1;
console.log(이름1); // 김
console.log(이름2); // 김
이름1 = '박';
console.log(이름1); // 박
console.log(이름2); // 김
Reference data type
var 이름1 = { name: '김' };
var 이름2 = 이름1;
console.log(이름1); // { name: '김'}
console.log(이름2); // { name: '김'}
이름1.name = '박';
console.log(이름1); // { name: '박'}
console.log(이름2); // { name: '박'} -> 이름2는 데이터를 변경한 적이 없는데?
Reference data type은 이름1에는 {name: '김'}이게 저장되는 게 아니라, {name:'김'}이 담긴 **PC의 메모리가 저기있어요** 라고 가리키는 **화살표(reference)가 저장**된다.
코드를 다시 보자. 이름2는 {name: '김'} 오브젝트가 있는 게 아니라, 이름1의 화살표를 복사한다.
var 이름1 = 화살표;
var 이름2 = 이름1 = 화살표;
그림으로 나타내면 이렇다.
![01](.\images\01.png)
이름1.name = '박'으로 바꾸면,
![02](.\images\02.png)
그래서 array, object는 함부로 복사하면 큰일난다!
그럼 복사하고 싶을 땐 어떻게 하나?
- object 복사 기계(constructor)를 만들어서 찍어내면 된다(다음시간에 배울 것임).
- 각각 다른 reference를 가지도록 작성한다.
var 이름1 = { name: '김'};
var 이름2 = { name: '박'};
새 중괄호를 할당할 때마다 새로운 화살표를 만든다.
![](.\images\03.png)
Reference data type 다루기 예시 2:
var 이름1 = { name: '김'};
var 이름2 = { name: '김'};
console.log(이름1 == 이름2); // false
이름1의 화살표 !== 이름2의 화살표. 따라서 false다.
![](.\images\04.png)
Reference data type 다루기 예시 3:
오브젝트를 변경해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj.name = 'Park';
}
변경(이름1); // {name: 'Park'}
➡️ 변경 성공
오브젝트를 재할당해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj = { name: 'park'};
}
변경(이름1);
console.log(이름1); // { name: '김'}
➡️ 실패. 안바뀜.
parameter와 reference datda type의 합작이다. **파라미터는 변수생성 & 할당과 똑같다.**
오브젝트에 이름1을 넣으면,
변경(이름1) = 변경(var obj = 이름1)
이거랑 똑같다. 이름1 화살표를 하나 복사해서 obj에 집어넣은거다. 그래서 obj도 이름1과 똑같은 곳을 화살표로 가리킨다.
![](.\images\05.png)
그리고 이 obj에 새로운 오브젝트를 할당하자. 그러면 이렇게 된다.
![](.\images\06.png)
그래서 이름1에 재할당한게 아니라, obj에 재할당한거다. 그래서 이름1은 그대로다.
**그 파라미터 변수에 = {} 해봤자 원래 이름1 오브젝트는 변화가 없다.**
Primitive data type
- 그냥 문자와 숫자
- 변수에 값이 그대로 저장됨
Reference data type
var 변수 = 1234;
var 어레이 = [1,2,3]; // 변수에 [1,2,3]이 저장된 게 아니라, reference가 저장됨
- Array, Object는 변수에 값이 저장이 안된다. 변수에 **reference**가 저장된다.
- [1,2,3]이 저쪽에 있어요(화살표) 를 저장함
종류
- Array
- Object
Reference data type 다루기 예시 1: 복사
Primitive data type
var 이름1 = '김';
var 이름2 = 이름1;
console.log(이름1); // 김
console.log(이름2); // 김
이름1 = '박';
console.log(이름1); // 박
console.log(이름2); // 김
Reference data type
var 이름1 = { name: '김' };
var 이름2 = 이름1;
console.log(이름1); // { name: '김'}
console.log(이름2); // { name: '김'}
이름1.name = '박';
console.log(이름1); // { name: '박'}
console.log(이름2); // { name: '박'} -> 이름2는 데이터를 변경한 적이 없는데?
Reference data type은 이름1에는 {name: '김'}이게 저장되는 게 아니라, {name:'김'}이 담긴 **PC의 메모리가 저기있어요** 라고 가리키는 **화살표(reference)가 저장**된다.
코드를 다시 보자. 이름2는 {name: '김'} 오브젝트가 있는 게 아니라, 이름1의 화살표를 복사한다.
var 이름1 = 화살표;
var 이름2 = 이름1 = 화살표;
그림으로 나타내면 이렇다.
![01](.\images\01.png)
이름1.name = '박'으로 바꾸면,
![02](.\images\02.png)
그래서 array, object는 함부로 복사하면 큰일난다!
그럼 복사하고 싶을 땐 어떻게 하나?
- object 복사 기계(constructor)를 만들어서 찍어내면 된다(다음시간에 배울 것임).
- 각각 다른 reference를 가지도록 작성한다.
var 이름1 = { name: '김'};
var 이름2 = { name: '박'};
새 중괄호를 할당할 때마다 새로운 화살표를 만든다.
![](.\images\03.png)
Reference data type 다루기 예시 2:
var 이름1 = { name: '김'};
var 이름2 = { name: '김'};
console.log(이름1 == 이름2); // false
이름1의 화살표 !== 이름2의 화살표. 따라서 false다.
![](.\images\04.png)
Reference data type 다루기 예시 3:
오브젝트를 변경해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj.name = 'Park';
}
변경(이름1); // {name: 'Park'}
➡️ 변경 성공
오브젝트를 재할당해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj = { name: 'park'};
}
변경(이름1);
console.log(이름1); // { name: '김'}
➡️ 실패. 안바뀜.
parameter와 reference datda type의 합작이다. **파라미터는 변수생성 & 할당과 똑같다.**
오브젝트에 이름1을 넣으면,
변경(이름1) = 변경(var obj = 이름1)
이거랑 똑같다. 이름1 화살표를 하나 복사해서 obj에 집어넣은거다. 그래서 obj도 이름1과 똑같은 곳을 화살표로 가리킨다.
![](.\images\05.png)
그리고 이 obj에 새로운 오브젝트를 할당하자. 그러면 이렇게 된다.
![](.\images\06.png)
그래서 이름1에 재할당한게 아니라, obj에 재할당한거다. 그래서 이름1은 그대로다.
**그 파라미터 변수에 = {} 해봤자 원래 이름1 오브젝트는 변화가 없다.**
Primitive data type
- 그냥 문자와 숫자
- 변수에 값이 그대로 저장됨
Reference data type
var 변수 = 1234;
var 어레이 = [1,2,3]; // 변수에 [1,2,3]이 저장된 게 아니라, reference가 저장됨
- Array, Object는 변수에 값이 저장이 안된다. 변수에 **reference**가 저장된다.
- [1,2,3]이 저쪽에 있어요(화살표) 를 저장함
종류
- Array
- Object
Reference data type 다루기 예시 1: 복사
Primitive data type
var 이름1 = '김';
var 이름2 = 이름1;
console.log(이름1); // 김
console.log(이름2); // 김
이름1 = '박';
console.log(이름1); // 박
console.log(이름2); // 김
Reference data type
var 이름1 = { name: '김' };
var 이름2 = 이름1;
console.log(이름1); // { name: '김'}
console.log(이름2); // { name: '김'}
이름1.name = '박';
console.log(이름1); // { name: '박'}
console.log(이름2); // { name: '박'} -> 이름2는 데이터를 변경한 적이 없는데?
Reference data type은 이름1에는 {name: '김'}이게 저장되는 게 아니라, {name:'김'}이 담긴 **PC의 메모리가 저기있어요** 라고 가리키는 **화살표(reference)가 저장**된다.
코드를 다시 보자. 이름2는 {name: '김'} 오브젝트가 있는 게 아니라, 이름1의 화살표를 복사한다.
var 이름1 = 화살표;
var 이름2 = 이름1 = 화살표;
그림으로 나타내면 이렇다.
![01](.\images\01.png)
이름1.name = '박'으로 바꾸면,
![02](.\images\02.png)
그래서 array, object는 함부로 복사하면 큰일난다!
그럼 복사하고 싶을 땐 어떻게 하나?
- object 복사 기계(constructor)를 만들어서 찍어내면 된다(다음시간에 배울 것임).
- 각각 다른 reference를 가지도록 작성한다.
var 이름1 = { name: '김'};
var 이름2 = { name: '박'};
새 중괄호를 할당할 때마다 새로운 화살표를 만든다.
![](.\images\03.png)
Reference data type 다루기 예시 2:
var 이름1 = { name: '김'};
var 이름2 = { name: '김'};
console.log(이름1 == 이름2); // false
이름1의 화살표 !== 이름2의 화살표. 따라서 false다.
![](.\images\04.png)
Reference data type 다루기 예시 3:
오브젝트를 변경해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj.name = 'Park';
}
변경(이름1); // {name: 'Park'}
➡️ 변경 성공
오브젝트를 재할당해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj = { name: 'park'};
}
변경(이름1);
console.log(이름1); // { name: '김'}
➡️ 실패. 안바뀜.
parameter와 reference datda type의 합작이다. **파라미터는 변수생성 & 할당과 똑같다.**
오브젝트에 이름1을 넣으면,
변경(이름1) = 변경(var obj = 이름1)
이거랑 똑같다. 이름1 화살표를 하나 복사해서 obj에 집어넣은거다. 그래서 obj도 이름1과 똑같은 곳을 화살표로 가리킨다.
![](.\images\05.png)
그리고 이 obj에 새로운 오브젝트를 할당하자. 그러면 이렇게 된다.
![](.\images\06.png)
그래서 이름1에 재할당한게 아니라, obj에 재할당한거다. 그래서 이름1은 그대로다.
**그 파라미터 변수에 = {} 해봤자 원래 이름1 오브젝트는 변화가 없다.**
Primitive data type
- 그냥 문자와 숫자
- 변수에 값이 그대로 저장됨
Reference data type
var 변수 = 1234;
var 어레이 = [1,2,3]; // 변수에 [1,2,3]이 저장된 게 아니라, reference가 저장됨
- Array, Object는 변수에 값이 저장이 안된다. 변수에 **reference**가 저장된다.
- [1,2,3]이 저쪽에 있어요(화살표) 를 저장함
종류
- Array
- Object
Reference data type 다루기 예시 1: 복사
Primitive data type
var 이름1 = '김';
var 이름2 = 이름1;
console.log(이름1); // 김
console.log(이름2); // 김
이름1 = '박';
console.log(이름1); // 박
console.log(이름2); // 김
Reference data type
var 이름1 = { name: '김' };
var 이름2 = 이름1;
console.log(이름1); // { name: '김'}
console.log(이름2); // { name: '김'}
이름1.name = '박';
console.log(이름1); // { name: '박'}
console.log(이름2); // { name: '박'} -> 이름2는 데이터를 변경한 적이 없는데?
Reference data type은 이름1에는 {name: '김'}이게 저장되는 게 아니라, {name:'김'}이 담긴 **PC의 메모리가 저기있어요** 라고 가리키는 **화살표(reference)가 저장**된다.
코드를 다시 보자. 이름2는 {name: '김'} 오브젝트가 있는 게 아니라, 이름1의 화살표를 복사한다.
var 이름1 = 화살표;
var 이름2 = 이름1 = 화살표;
그림으로 나타내면 이렇다.
![01](.\images\01.png)
이름1.name = '박'으로 바꾸면,
![02](.\images\02.png)
그래서 array, object는 함부로 복사하면 큰일난다!
그럼 복사하고 싶을 땐 어떻게 하나?
- object 복사 기계(constructor)를 만들어서 찍어내면 된다(다음시간에 배울 것임).
- 각각 다른 reference를 가지도록 작성한다.
var 이름1 = { name: '김'};
var 이름2 = { name: '박'};
새 중괄호를 할당할 때마다 새로운 화살표를 만든다.
![](.\images\03.png)
Reference data type 다루기 예시 2:
var 이름1 = { name: '김'};
var 이름2 = { name: '김'};
console.log(이름1 == 이름2); // false
이름1의 화살표 !== 이름2의 화살표. 따라서 false다.
![](.\images\04.png)
Reference data type 다루기 예시 3:
오브젝트를 변경해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj.name = 'Park';
}
변경(이름1); // {name: 'Park'}
➡️ 변경 성공
오브젝트를 재할당해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj = { name: 'park'};
}
변경(이름1);
console.log(이름1); // { name: '김'}
➡️ 실패. 안바뀜.
parameter와 reference datda type의 합작이다. **파라미터는 변수생성 & 할당과 똑같다.**
오브젝트에 이름1을 넣으면,
변경(이름1) = 변경(var obj = 이름1)
이거랑 똑같다. 이름1 화살표를 하나 복사해서 obj에 집어넣은거다. 그래서 obj도 이름1과 똑같은 곳을 화살표로 가리킨다.
![](.\images\05.png)
그리고 이 obj에 새로운 오브젝트를 할당하자. 그러면 이렇게 된다.
![](.\images\06.png)
그래서 이름1에 재할당한게 아니라, obj에 재할당한거다. 그래서 이름1은 그대로다.
**그 파라미터 변수에 = {} 해봤자 원래 이름1 오브젝트는 변화가 없다.**
Primitive data type
- 그냥 문자와 숫자
- 변수에 값이 그대로 저장됨
Reference data type
var 변수 = 1234;
var 어레이 = [1,2,3]; // 변수에 [1,2,3]이 저장된 게 아니라, reference가 저장됨
- Array, Object는 변수에 값이 저장이 안된다. 변수에 **reference**가 저장된다.
- [1,2,3]이 저쪽에 있어요(화살표) 를 저장함
종류
- Array
- Object
Reference data type 다루기 예시 1: 복사
Primitive data type
var 이름1 = '김';
var 이름2 = 이름1;
console.log(이름1); // 김
console.log(이름2); // 김
이름1 = '박';
console.log(이름1); // 박
console.log(이름2); // 김
Reference data type
var 이름1 = { name: '김' };
var 이름2 = 이름1;
console.log(이름1); // { name: '김'}
console.log(이름2); // { name: '김'}
이름1.name = '박';
console.log(이름1); // { name: '박'}
console.log(이름2); // { name: '박'} -> 이름2는 데이터를 변경한 적이 없는데?
Reference data type은 이름1에는 {name: '김'}이게 저장되는 게 아니라, {name:'김'}이 담긴 **PC의 메모리가 저기있어요** 라고 가리키는 **화살표(reference)가 저장**된다.
코드를 다시 보자. 이름2는 {name: '김'} 오브젝트가 있는 게 아니라, 이름1의 화살표를 복사한다.
var 이름1 = 화살표;
var 이름2 = 이름1 = 화살표;
그림으로 나타내면 이렇다.
![01](.\images\01.png)
이름1.name = '박'으로 바꾸면,
![02](.\images\02.png)
그래서 array, object는 함부로 복사하면 큰일난다!
그럼 복사하고 싶을 땐 어떻게 하나?
- object 복사 기계(constructor)를 만들어서 찍어내면 된다(다음시간에 배울 것임).
- 각각 다른 reference를 가지도록 작성한다.
var 이름1 = { name: '김'};
var 이름2 = { name: '박'};
새 중괄호를 할당할 때마다 새로운 화살표를 만든다.
![](.\images\03.png)
Reference data type 다루기 예시 2:
var 이름1 = { name: '김'};
var 이름2 = { name: '김'};
console.log(이름1 == 이름2); // false
이름1의 화살표 !== 이름2의 화살표. 따라서 false다.
![](.\images\04.png)
Reference data type 다루기 예시 3:
오브젝트를 변경해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj.name = 'Park';
}
변경(이름1); // {name: 'Park'}
➡️ 변경 성공
오브젝트를 재할당해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj = { name: 'park'};
}
변경(이름1);
console.log(이름1); // { name: '김'}
➡️ 실패. 안바뀜.
parameter와 reference datda type의 합작이다. **파라미터는 변수생성 & 할당과 똑같다.**
오브젝트에 이름1을 넣으면,
변경(이름1) = 변경(var obj = 이름1)
이거랑 똑같다. 이름1 화살표를 하나 복사해서 obj에 집어넣은거다. 그래서 obj도 이름1과 똑같은 곳을 화살표로 가리킨다.
![](.\images\05.png)
그리고 이 obj에 새로운 오브젝트를 할당하자. 그러면 이렇게 된다.
![](.\images\06.png)
그래서 이름1에 재할당한게 아니라, obj에 재할당한거다. 그래서 이름1은 그대로다.
**그 파라미터 변수에 = {} 해봤자 원래 이름1 오브젝트는 변화가 없다.**
이상한 Reference data type과 더 이상한 예제 3개이상한 Reference data type과 더 이상한 예제 3개
Primitive data type
- 그냥 문자와 숫자
- 변수에 값이 그대로 저장됨
Reference data type
var 변수 = 1234;
var 어레이 = [1,2,3]; // 변수에 [1,2,3]이 저장된 게 아니라, reference가 저장됨
- Array, Object는 변수에 값이 저장이 안된다. 변수에 **reference**가 저장된다.
- [1,2,3]이 저쪽에 있어요(화살표) 를 저장함
종류
- Array
- Object
Reference data type 다루기 예시 1: 복사
Primitive data type
var 이름1 = '김';
var 이름2 = 이름1;
console.log(이름1); // 김
console.log(이름2); // 김
이름1 = '박';
console.log(이름1); // 박
console.log(이름2); // 김
Reference data type
var 이름1 = { name: '김' };
var 이름2 = 이름1;
console.log(이름1); // { name: '김'}
console.log(이름2); // { name: '김'}
이름1.name = '박';
console.log(이름1); // { name: '박'}
console.log(이름2); // { name: '박'} -> 이름2는 데이터를 변경한 적이 없는데?
Reference data type은 이름1에는 {name: '김'}이게 저장되는 게 아니라, {name:'김'}이 담긴 **PC의 메모리가 저기있어요** 라고 가리키는 **화살표(reference)가 저장**된다.
코드를 다시 보자. 이름2는 {name: '김'} 오브젝트가 있는 게 아니라, 이름1의 화살표를 복사한다.
var 이름1 = 화살표;
var 이름2 = 이름1 = 화살표;
그림으로 나타내면 이렇다.
![01](.\images\01.png)
이름1.name = '박'으로 바꾸면,
![02](.\images\02.png)
그래서 array, object는 함부로 복사하면 큰일난다!
그럼 복사하고 싶을 땐 어떻게 하나?
- object 복사 기계(constructor)를 만들어서 찍어내면 된다(다음시간에 배울 것임).
- 각각 다른 reference를 가지도록 작성한다.
var 이름1 = { name: '김'};
var 이름2 = { name: '박'};
새 중괄호를 할당할 때마다 새로운 화살표를 만든다.
![](.\images\03.png)
Reference data type 다루기 예시 2:
var 이름1 = { name: '김'};
var 이름2 = { name: '김'};
console.log(이름1 == 이름2); // false
이름1의 화살표 !== 이름2의 화살표. 따라서 false다.
![](.\images\04.png)
Reference data type 다루기 예시 3:
오브젝트를 변경해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj.name = 'Park';
}
변경(이름1); // {name: 'Park'}
➡️ 변경 성공
오브젝트를 재할당해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj = { name: 'park'};
}
변경(이름1);
console.log(이름1); // { name: '김'}
➡️ 실패. 안바뀜.
parameter와 reference datda type의 합작이다. **파라미터는 변수생성 & 할당과 똑같다.**
오브젝트에 이름1을 넣으면,
변경(이름1) = 변경(var obj = 이름1)
이거랑 똑같다. 이름1 화살표를 하나 복사해서 obj에 집어넣은거다. 그래서 obj도 이름1과 똑같은 곳을 화살표로 가리킨다.
![](.\images\05.png)
그리고 이 obj에 새로운 오브젝트를 할당하자. 그러면 이렇게 된다.
![](.\images\06.png)
그래서 이름1에 재할당한게 아니라, obj에 재할당한거다. 그래서 이름1은 그대로다.
**그 파라미터 변수에 = {} 해봤자 원래 이름1 오브젝트는 변화가 없다.**
Primitive data type
- 그냥 문자와 숫자
- 변수에 값이 그대로 저장됨
Reference data type
var 변수 = 1234;
var 어레이 = [1,2,3]; // 변수에 [1,2,3]이 저장된 게 아니라, reference가 저장됨
- Array, Object는 변수에 값이 저장이 안된다. 변수에 **reference**가 저장된다.
- [1,2,3]이 저쪽에 있어요(화살표) 를 저장함
종류
- Array
- Object
Reference data type 다루기 예시 1: 복사
Primitive data type
var 이름1 = '김';
var 이름2 = 이름1;
console.log(이름1); // 김
console.log(이름2); // 김
이름1 = '박';
console.log(이름1); // 박
console.log(이름2); // 김
Reference data type
var 이름1 = { name: '김' };
var 이름2 = 이름1;
console.log(이름1); // { name: '김'}
console.log(이름2); // { name: '김'}
이름1.name = '박';
console.log(이름1); // { name: '박'}
console.log(이름2); // { name: '박'} -> 이름2는 데이터를 변경한 적이 없는데?
Reference data type은 이름1에는 {name: '김'}이게 저장되는 게 아니라, {name:'김'}이 담긴 **PC의 메모리가 저기있어요** 라고 가리키는 **화살표(reference)가 저장**된다.
코드를 다시 보자. 이름2는 {name: '김'} 오브젝트가 있는 게 아니라, 이름1의 화살표를 복사한다.
var 이름1 = 화살표;
var 이름2 = 이름1 = 화살표;
그림으로 나타내면 이렇다.
![01](.\images\01.png)
이름1.name = '박'으로 바꾸면,
![02](.\images\02.png)
그래서 array, object는 함부로 복사하면 큰일난다!
그럼 복사하고 싶을 땐 어떻게 하나?
- object 복사 기계(constructor)를 만들어서 찍어내면 된다(다음시간에 배울 것임).
- 각각 다른 reference를 가지도록 작성한다.
var 이름1 = { name: '김'};
var 이름2 = { name: '박'};
새 중괄호를 할당할 때마다 새로운 화살표를 만든다.
![](.\images\03.png)
Reference data type 다루기 예시 2:
var 이름1 = { name: '김'};
var 이름2 = { name: '김'};
console.log(이름1 == 이름2); // false
이름1의 화살표 !== 이름2의 화살표. 따라서 false다.
![](.\images\04.png)
Reference data type 다루기 예시 3:
오브젝트를 변경해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj.name = 'Park';
}
변경(이름1); // {name: 'Park'}
➡️ 변경 성공
오브젝트를 재할당해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj = { name: 'park'};
}
변경(이름1);
console.log(이름1); // { name: '김'}
➡️ 실패. 안바뀜.
parameter와 reference datda type의 합작이다. **파라미터는 변수생성 & 할당과 똑같다.**
오브젝트에 이름1을 넣으면,
변경(이름1) = 변경(var obj = 이름1)
이거랑 똑같다. 이름1 화살표를 하나 복사해서 obj에 집어넣은거다. 그래서 obj도 이름1과 똑같은 곳을 화살표로 가리킨다.
![](.\images\05.png)
그리고 이 obj에 새로운 오브젝트를 할당하자. 그러면 이렇게 된다.
![](.\images\06.png)
그래서 이름1에 재할당한게 아니라, obj에 재할당한거다. 그래서 이름1은 그대로다.
**그 파라미터 변수에 = {} 해봤자 원래 이름1 오브젝트는 변화가 없다.**
이상한 Reference data type과 더 이상한 예제 3개
Primitive data type
- 그냥 문자와 숫자
- 변수에 값이 그대로 저장됨
Reference data type
var 변수 = 1234;
var 어레이 = [1,2,3]; // 변수에 [1,2,3]이 저장된 게 아니라, reference가 저장됨
- Array, Object는 변수에 값이 저장이 안된다. 변수에 **reference**가 저장된다.
- [1,2,3]이 저쪽에 있어요(화살표) 를 저장함
종류
- Array
- Object
Reference data type 다루기 예시 1: 복사
Primitive data type
var 이름1 = '김';
var 이름2 = 이름1;
console.log(이름1); // 김
console.log(이름2); // 김
이름1 = '박';
console.log(이름1); // 박
console.log(이름2); // 김
Reference data type
var 이름1 = { name: '김' };
var 이름2 = 이름1;
console.log(이름1); // { name: '김'}
console.log(이름2); // { name: '김'}
이름1.name = '박';
console.log(이름1); // { name: '박'}
console.log(이름2); // { name: '박'} -> 이름2는 데이터를 변경한 적이 없는데?
Reference data type은 이름1에는 {name: '김'}이게 저장되는 게 아니라, {name:'김'}이 담긴 **PC의 메모리가 저기있어요** 라고 가리키는 **화살표(reference)가 저장**된다.
코드를 다시 보자. 이름2는 {name: '김'} 오브젝트가 있는 게 아니라, 이름1의 화살표를 복사한다.
var 이름1 = 화살표;
var 이름2 = 이름1 = 화살표;
그림으로 나타내면 이렇다.
![01](.\images\01.png)
이름1.name = '박'으로 바꾸면,
![02](.\images\02.png)
그래서 array, object는 함부로 복사하면 큰일난다!
그럼 복사하고 싶을 땐 어떻게 하나?
- object 복사 기계(constructor)를 만들어서 찍어내면 된다(다음시간에 배울 것임).
- 각각 다른 reference를 가지도록 작성한다.
var 이름1 = { name: '김'};
var 이름2 = { name: '박'};
새 중괄호를 할당할 때마다 새로운 화살표를 만든다.
![](.\images\03.png)
Reference data type 다루기 예시 2:
var 이름1 = { name: '김'};
var 이름2 = { name: '김'};
console.log(이름1 == 이름2); // false
이름1의 화살표 !== 이름2의 화살표. 따라서 false다.
![](.\images\04.png)
Reference data type 다루기 예시 3:
오브젝트를 변경해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj.name = 'Park';
}
변경(이름1); // {name: 'Park'}
➡️ 변경 성공
오브젝트를 재할당해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj = { name: 'park'};
}
변경(이름1);
console.log(이름1); // { name: '김'}
➡️ 실패. 안바뀜.
parameter와 reference datda type의 합작이다. **파라미터는 변수생성 & 할당과 똑같다.**
오브젝트에 이름1을 넣으면,
변경(이름1) = 변경(var obj = 이름1)
이거랑 똑같다. 이름1 화살표를 하나 복사해서 obj에 집어넣은거다. 그래서 obj도 이름1과 똑같은 곳을 화살표로 가리킨다.
![](.\images\05.png)
그리고 이 obj에 새로운 오브젝트를 할당하자. 그러면 이렇게 된다.
![](.\images\06.png)
그래서 이름1에 재할당한게 아니라, obj에 재할당한거다. 그래서 이름1은 그대로다.
**그 파라미터 변수에 = {} 해봤자 원래 이름1 오브젝트는 변화가 없다.**
이상한 Reference data type과 더 이상한 예제 3개
Primitive data type
- 그냥 문자와 숫자
- 변수에 값이 그대로 저장됨
Reference data type
var 변수 = 1234;
var 어레이 = [1,2,3]; // 변수에 [1,2,3]이 저장된 게 아니라, reference가 저장됨
- Array, Object는 변수에 값이 저장이 안된다. 변수에 **reference**가 저장된다.
- [1,2,3]이 저쪽에 있어요(화살표) 를 저장함
종류
- Array
- Object
Reference data type 다루기 예시 1: 복사
Primitive data type
var 이름1 = '김';
var 이름2 = 이름1;
console.log(이름1); // 김
console.log(이름2); // 김
이름1 = '박';
console.log(이름1); // 박
console.log(이름2); // 김
Reference data type
var 이름1 = { name: '김' };
var 이름2 = 이름1;
console.log(이름1); // { name: '김'}
console.log(이름2); // { name: '김'}
이름1.name = '박';
console.log(이름1); // { name: '박'}
console.log(이름2); // { name: '박'} -> 이름2는 데이터를 변경한 적이 없는데?
Reference data type은 이름1에는 {name: '김'}이게 저장되는 게 아니라, {name:'김'}이 담긴 **PC의 메모리가 저기있어요** 라고 가리키는 **화살표(reference)가 저장**된다.
코드를 다시 보자. 이름2는 {name: '김'} 오브젝트가 있는 게 아니라, 이름1의 화살표를 복사한다.
var 이름1 = 화살표;
var 이름2 = 이름1 = 화살표;
그림으로 나타내면 이렇다.
![01](.\images\01.png)
이름1.name = '박'으로 바꾸면,
![02](.\images\02.png)
그래서 array, object는 함부로 복사하면 큰일난다!
그럼 복사하고 싶을 땐 어떻게 하나?
- object 복사 기계(constructor)를 만들어서 찍어내면 된다(다음시간에 배울 것임).
- 각각 다른 reference를 가지도록 작성한다.
var 이름1 = { name: '김'};
var 이름2 = { name: '박'};
새 중괄호를 할당할 때마다 새로운 화살표를 만든다.
![](.\images\03.png)
Reference data type 다루기 예시 2:
var 이름1 = { name: '김'};
var 이름2 = { name: '김'};
console.log(이름1 == 이름2); // false
이름1의 화살표 !== 이름2의 화살표. 따라서 false다.
![](.\images\04.png)
Reference data type 다루기 예시 3:
오브젝트를 변경해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj.name = 'Park';
}
변경(이름1); // {name: 'Park'}
➡️ 변경 성공
오브젝트를 재할당해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj = { name: 'park'};
}
변경(이름1);
console.log(이름1); // { name: '김'}
➡️ 실패. 안바뀜.
parameter와 reference datda type의 합작이다. **파라미터는 변수생성 & 할당과 똑같다.**
오브젝트에 이름1을 넣으면,
변경(이름1) = 변경(var obj = 이름1)
이거랑 똑같다. 이름1 화살표를 하나 복사해서 obj에 집어넣은거다. 그래서 obj도 이름1과 똑같은 곳을 화살표로 가리킨다.
![](.\images\05.png)
그리고 이 obj에 새로운 오브젝트를 할당하자. 그러면 이렇게 된다.
![](.\images\06.png)
그래서 이름1에 재할당한게 아니라, obj에 재할당한거다. 그래서 이름1은 그대로다.
**그 파라미터 변수에 = {} 해봤자 원래 이름1 오브젝트는 변화가 없다.**
이상한 Reference data type과 더 이상한 예제 3개
Primitive data type
- 그냥 문자와 숫자
- 변수에 값이 그대로 저장됨
Reference data type
var 변수 = 1234;
var 어레이 = [1,2,3]; // 변수에 [1,2,3]이 저장된 게 아니라, reference가 저장됨
- Array, Object는 변수에 값이 저장이 안된다. 변수에 **reference**가 저장된다.
- [1,2,3]이 저쪽에 있어요(화살표) 를 저장함
종류
- Array
- Object
Reference data type 다루기 예시 1: 복사
Primitive data type
var 이름1 = '김';
var 이름2 = 이름1;
console.log(이름1); // 김
console.log(이름2); // 김
이름1 = '박';
console.log(이름1); // 박
console.log(이름2); // 김
Reference data type
var 이름1 = { name: '김' };
var 이름2 = 이름1;
console.log(이름1); // { name: '김'}
console.log(이름2); // { name: '김'}
이름1.name = '박';
console.log(이름1); // { name: '박'}
console.log(이름2); // { name: '박'} -> 이름2는 데이터를 변경한 적이 없는데?
Reference data type은 이름1에는 {name: '김'}이게 저장되는 게 아니라, {name:'김'}이 담긴 **PC의 메모리가 저기있어요** 라고 가리키는 **화살표(reference)가 저장**된다.
코드를 다시 보자. 이름2는 {name: '김'} 오브젝트가 있는 게 아니라, 이름1의 화살표를 복사한다.
var 이름1 = 화살표;
var 이름2 = 이름1 = 화살표;
그림으로 나타내면 이렇다.
![01](.\images\01.png)
이름1.name = '박'으로 바꾸면,
![02](.\images\02.png)
그래서 array, object는 함부로 복사하면 큰일난다!
그럼 복사하고 싶을 땐 어떻게 하나?
- object 복사 기계(constructor)를 만들어서 찍어내면 된다(다음시간에 배울 것임).
- 각각 다른 reference를 가지도록 작성한다.
var 이름1 = { name: '김'};
var 이름2 = { name: '박'};
새 중괄호를 할당할 때마다 새로운 화살표를 만든다.
![](.\images\03.png)
Reference data type 다루기 예시 2:
var 이름1 = { name: '김'};
var 이름2 = { name: '김'};
console.log(이름1 == 이름2); // false
이름1의 화살표 !== 이름2의 화살표. 따라서 false다.
![](.\images\04.png)
Reference data type 다루기 예시 3:
오브젝트를 변경해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj.name = 'Park';
}
변경(이름1); // {name: 'Park'}
➡️ 변경 성공
오브젝트를 재할당해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj = { name: 'park'};
}
변경(이름1);
console.log(이름1); // { name: '김'}
➡️ 실패. 안바뀜.
parameter와 reference datda type의 합작이다. **파라미터는 변수생성 & 할당과 똑같다.**
오브젝트에 이름1을 넣으면,
변경(이름1) = 변경(var obj = 이름1)
이거랑 똑같다. 이름1 화살표를 하나 복사해서 obj에 집어넣은거다. 그래서 obj도 이름1과 똑같은 곳을 화살표로 가리킨다.
![](.\images\05.png)
그리고 이 obj에 새로운 오브젝트를 할당하자. 그러면 이렇게 된다.
![](.\images\06.png)
그래서 이름1에 재할당한게 아니라, obj에 재할당한거다. 그래서 이름1은 그대로다.
**그 파라미터 변수에 = {} 해봤자 원래 이름1 오브젝트는 변화가 없다.**
이상한 Reference data type과 더 이상한 예제 3개
Primitive data type
- 그냥 문자와 숫자
- 변수에 값이 그대로 저장됨
Reference data type
var 변수 = 1234;
var 어레이 = [1,2,3]; // 변수에 [1,2,3]이 저장된 게 아니라, reference가 저장됨
- Array, Object는 변수에 값이 저장이 안된다. 변수에 **reference**가 저장된다.
- [1,2,3]이 저쪽에 있어요(화살표) 를 저장함
종류
- Array
- Object
Reference data type 다루기 예시 1: 복사
Primitive data type
var 이름1 = '김';
var 이름2 = 이름1;
console.log(이름1); // 김
console.log(이름2); // 김
이름1 = '박';
console.log(이름1); // 박
console.log(이름2); // 김
Reference data type
var 이름1 = { name: '김' };
var 이름2 = 이름1;
console.log(이름1); // { name: '김'}
console.log(이름2); // { name: '김'}
이름1.name = '박';
console.log(이름1); // { name: '박'}
console.log(이름2); // { name: '박'} -> 이름2는 데이터를 변경한 적이 없는데?
Reference data type은 이름1에는 {name: '김'}이게 저장되는 게 아니라, {name:'김'}이 담긴 **PC의 메모리가 저기있어요** 라고 가리키는 **화살표(reference)가 저장**된다.
코드를 다시 보자. 이름2는 {name: '김'} 오브젝트가 있는 게 아니라, 이름1의 화살표를 복사한다.
var 이름1 = 화살표;
var 이름2 = 이름1 = 화살표;
그림으로 나타내면 이렇다.
![01](.\images\01.png)
이름1.name = '박'으로 바꾸면,
![02](.\images\02.png)
그래서 array, object는 함부로 복사하면 큰일난다!
그럼 복사하고 싶을 땐 어떻게 하나?
- object 복사 기계(constructor)를 만들어서 찍어내면 된다(다음시간에 배울 것임).
- 각각 다른 reference를 가지도록 작성한다.
var 이름1 = { name: '김'};
var 이름2 = { name: '박'};
새 중괄호를 할당할 때마다 새로운 화살표를 만든다.
![](.\images\03.png)
Reference data type 다루기 예시 2:
var 이름1 = { name: '김'};
var 이름2 = { name: '김'};
console.log(이름1 == 이름2); // false
이름1의 화살표 !== 이름2의 화살표. 따라서 false다.
![](.\images\04.png)
Reference data type 다루기 예시 3:
오브젝트를 변경해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj.name = 'Park';
}
변경(이름1); // {name: 'Park'}
➡️ 변경 성공
오브젝트를 재할당해주는 함수
var 이름1 = { name: '김'};
function 변경(obj) {
obj = { name: 'park'};
}
변경(이름1);
console.log(이름1); // { name: '김'}
➡️ 실패. 안바뀜.
parameter와 reference datda type의 합작이다. **파라미터는 변수생성 & 할당과 똑같다.**
오브젝트에 이름1을 넣으면,
변경(이름1) = 변경(var obj = 이름1)
이거랑 똑같다. 이름1 화살표를 하나 복사해서 obj에 집어넣은거다. 그래서 obj도 이름1과 똑같은 곳을 화살표로 가리킨다.
![](.\images\05.png)
그리고 이 obj에 새로운 오브젝트를 할당하자. 그러면 이렇게 된다.
![](.\images\06.png)
그래서 이름1에 재할당한게 아니라, obj에 재할당한거다. 그래서 이름1은 그대로다.
**그 파라미터 변수에 = {} 해봤자 원래 이름1 오브젝트는 변화가 없다.**
'Front-End: Web > JavaScript' 카테고리의 다른 글
[코딩애플] js part 2-4. 상속기능을 구현하는 다른 방법 (0) | 2022.10.21 |
---|---|
[코딩애플] js part 2-3. Object 생성기계인 constructor를 만들어 써보자 (0) | 2022.10.21 |
[코딩애플] js part 2-1. 자바스크립트 함수 업그레이드하기 (default parameter/arguments) (0) | 2022.10.21 |
[코딩애플] js part 1-7. Spread Operator (...)와 apply / call (0) | 2022.10.09 |
[코딩애플] js part 1-6. 자바스크립트가 문자 다루는 신기한 방법 - Template literals (strings) (0) | 2022.10.09 |