[SEB FE] section 1 unit 10 (1) 원시자료형과 참조자료형 + 종합퀴즈

동화·2022년 10월 6일
0

코드스테이츠

목록 보기
9/32

원시자료형

"hello world!"
"hello codestates!"
// "hello world!" 와 "hello codestates!"는 모두 변경할 수 없는 고정된 값입니다.

let word = "hello world!"
word = "hello codestates!"
// 하지만, word라는 변수에 재할당을 하여 변수에 담긴 내용을 변경하는 것은 가능합니다.

const num1 = 123;
num1 = 123456789; // 에러 발생
// const 키워드로 선언하면, 재할당은 불가합니다.
  • 변수에는 하나의 데이터만 담는다
  • string, number, bigint, boolean, undefined, symbol, (null)
let a = 1;
a = b;
b = 2;
a; // ==> 2



참조자료형

  • 크기가 동적으로 변하는 데이터 보관함
  • 원시자료형이 할당될 때에는 변수에 값(value)자체가 담기고, 참조 자료형이 할당될 때에는 보관함의 주소(reference)가 담김.
  • 그래서 참조자료형은 고정된 크기의 보관함이 아니라 동적으로 크기가 변하는 특별한 보관함 사용
  • array, object, function
let e = [10, 20];
lef f = e;
f[0] = 50;
e; // ==> [50, 20]







종합퀴즈 ⁉️

3. 다음 코드가 실행된 후, 콘솔에 찍히는 값은 각각 무엇인지 고르세요.

console.log('codestates' === 'codestates');
console.log(3.14 === 3.14);
console.log([1,2,3] === [1,2,3]);
console.log({ foo: 'bar' } === { foo: 'bar' });

답 : true true false false

자바스크립트는 머리를 씁니다. 그러면 메모리에 공간은 내가 알아서 부여하고, 변수는 그 공간의 주소만 참조하도록 하자! 그래서 참조 자료형이 탄생하게 됩니다.

값의 크기가 수시로 변하는 것을 처리하기 위해서 참조자료형은 heap이라는 별도의 메모리 저장공간 사용
참조 자료형의 ===(strict equality)는 주소값이 같은지를 확인

console.log([1,2,3] === [1,2,3]);

이 코드를 읽으면서 컴퓨터는 이미 두개의 heap 저장 공간의 주소 확보
미리 주소값과 메모리 값을 잡아둔다 --> [] === [] 도 true 가 나오지 않음



4. 다음 코드가 실행된 후, x.foo의 값은 무엇인지 고르세요.

let x = { foo: 3 };
let y = x;
y = 2;

답 : 3

let x = { foo: 3};
let y = x;				// 여기서 y는 x의 주소값 할당
y = 2;					// 하지만 다시 2를 할당

이 과정에서 참조 자료형 {foo : 3}에는 아무런 영향을 미치지 않았기 때문에
x.foo는 그대로 3



5. 다음 코드가 실행된 후, myArray의 값은 무엇인지 고르세요.

let myArray = [2, 3, 4, 5];
let ourArray = myArray;
ourArray[2] = 25;
ourArray = undefined;

답 : [2, 3, 25, 5]

  • 변수 ourArray에 myArray의 주소값이 할당
  • ourArray 주소값에 위치한 배열의 2번째 요소를 25로 변경
    (ourArray와 myArray의 주소값은 같음으로 현재 myArray는 [2, 3, 25, 5])
  • 변수 ourArray에 원시 자료형 undefined가 할당되었기 때문에, myArray에 접근x
    (하지만 myArray는 그대로 [2, 3, 25, 5])


6. 다음 코드가 실행된 후, player.score의 값은 무엇인지 고르세요.

let player = { score: 3 };
function doStuff(obj) { 
  obj.score = 2;
}

doStuff(player);

답 : 2

doStuff(player);
  • 함수 doStuff에 변수 player를 인자로 전달하여 호출
function doStuff(obj) { 
  obj.score = 2;
}
  • 함수가 호출되면 (실행되면) 매개변수 obj에 변수 player의 값이 할당 - { score: 3 }의 주소값
  • obj.score에 2를 할당하면, obj와 player는 같은 주소값을 가지고 있기 때문에, player.score도 2


7. 다음 코드가 실행된 후, score 의 값은 무엇인지 고르세요.

let score = 80;
function doStuff(value) {
  value = 90;
}

doStuff(score)

답 : 80

doStuff(score)
  • 함수 doStuff에 score의 값을 인자로 전달하여 실행
function doStuff(value) {
  value = 90;
}
  • 매개변수 value에 score의 값 80이 전달되고, value = 90에서 value에 90이 할당
  • 다만 변수 score의 값 80은, 참조 자료형이 아니기 때문에 주소값을 전달하지 않고, 값 자체를 복사하여 전달
  • 따라서 함수에서 어떤 일이 발생했던가와 관련이 없이 score는 초기에 할당된 값 80이 그대로 유지

0개의 댓글