컴퓨터는 잘못이 없다..

[JavaScript]plain object type 복사와 stack영역, heap영역 본문

공부/JavaScript

[JavaScript]plain object type 복사와 stack영역, heap영역

도토리까꿍v 2020. 11. 4. 20:46
Contents 접기

[plain object type 복사]

​

01) 예제 코드 확인

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Step03_object2.html</title>
</head>
<body>
    <script>

        //원본 키가 들어있는 mem1
        var mem1 = {num:1, name:"김구라", addr:"노량진"}
        
        //원본키를 mem2에 복사해준다. console에 mem2를 검색한 결과는? {num:1, name:"김구라", addr:"노량진"}
        var mem2 = mem1;

        //mem1을 바꾸면 mem2도 바뀔까?
        mem1.name="개구라";//바뀐다.

        //mem2를 바꾸면 mem1 내용도 바뀔까?
        mem2.num = 2;//바뀐다.

        //같이 바뀐다. 
        var a = mem1.name; //개구라
        var b = mem2.name; //개구라 
        var c = mem1.num; //2
        var d = mem2.num; //2


        //그렇다면? 위의 개념을 익히고 최종 e와 f에는 무엇이 들어있을지 예상해보자!
        //변수에 참조값을 넣지 않기 때문에 서로를 아무리 바꿔도 각자 바뀐다.
        var num1 = 10;
        var num2 = num1; //num2에 10을 대입

        num1 = 20; //num1에 20을 대입
        
        var e = num1; //e는 num1 인 20
        var f = num2; //f는 num2 인 10


    </script>
</body>
</html>

 

02) mem2 변수에 object type인 mem1을 대입연산자로 대입하면 어떻게 될까?

사물함 = 힙영역(Heap)

사물함 번호 = 참조값 (reference value)

​

03)Stack과 Heap 영역

var mem1 = {num:1, name:"kim",addr:"nrg"};

var mem2 = mem1;

var num1 = 10;

위 3줄의 코드 그림으로 확인하기!

​

→차이점

mem1과 mem2에는 참조값이 들어있고

num1엔 value값이 들어있다!

​

→정리

0. 모든 변수들은 stack영역에 있다. ★★★★★

1. object type은 변수에 value가 들어있지 않고 heap 영역을 참조할 수 있는 참조값이 들어있다. 실제 value들은 heap영역에 있다.

2. var mem2 = mem1 의 의미는 mem1의 참조값을 mem2에 대입해라!

3. mem1.num 의 의미는 mem1 즉 20번지에 있는 key가 num인 값을 보여주어라!

​

 

저작자표시

'공부 > JavaScript' 카테고리의 다른 글

[JavaScript]object type 내 함수와 this 예약어  (0) 2020.11.04
[JavaScript]plain object type  (0) 2020.11.04
[JavaScript]버튼을 누를때마다 버튼 속 숫자를 1씩 증가시키기  (0) 2020.11.04
'공부/JavaScript' Related Articles more
Comments