📗원시값

Primitive

초기의, 원시적인 단계의

원시값에 해당하는 값들은 그 이름의 의미처럼 원시적으로 작동합니다. 아래 자료형들은 원시값에 해당합니다.

1. 문자열

2. 불리언

3. 숫자

4. Null

5. Undefined

6. 심볼

7. BigInt

원시값의 작동 원리는 매우 간단합니다. 아마 여러분도 이미 잘 알고 계실 겁니다.

값의 비교

// 문자열은 원시값입니다.
const person1 = "wan";
const person2 = "wan";

const result = person1 === person2;

console.log(result); // ?

원시값의 경우에는 단순하게 생각하시면 됩니다.

값의 "모양"이 같다면, 서로 같은 값입니다. 값의 "모양"이 다르다면, 서로 다른 값입니다.

위의 예제에서 우리는 두 가지 변수를 만들었습니다. person1과 person2 모두 "wan"이라는 문자열을 담고 있습니다. 그렇기에, 두 가지 변수를 비교한다면 같다고 판별됩니다.

값의 복사

let a = 10;
const b = a;

a = 30;

console.log(b); // ?

위 예제에서 우리는 b라는 변수를 선언하고, a와 동일한 값을 할당해주었습니다. 그리고 a 변수의 값을 변경하였습니다.

과연 최종적인 b의 값은 무엇일까요?

비유 설명

우리가 변수를 만드는 행위를 포스트잇에 정보를 적는 행위와 같다고 생각해보세요. 다만, 아래와 같은 세 가지 조건이 있습니다.

• 변수를 만들 때마다 새로운 포스트잇을 사용합니다.

• 하나의 포스트잇에는 하나의 원시값만 적을 수 있습니다.

let a = 10;
const b = a;

a = 30;

console.log(b); // ?

위 예제 코드를 다시 보자면, 아래와 같다고 할 수 있습니다.

1. a 라는 포스트잇을 만들고, 10이라는 숫자를 적습니다.

2. b 라는 포스트잇을 만들고, a 포스트잇에 적힌 내용(10)을 동일하게 적습니다.

3. a 포스트잇의 내용을 30으로 변경합니다.

4. b 포스트잇에 적힌 글씨를 확인합니다.

5. b 포스트잇에 적힌 글씨는 무엇일까요?

이해가 조금 더 되었나요? 그림으로 한번 볼까요?

1. a 라는 포스트잇을 만들고, 10이라는 숫자를 적습니다.

2. b 라는 포스트잇을 만들고, a 포스트잇에 적힌 내용(10)을 동일하게 적습니다.

3. a 포스트잇의 내용을 30으로 변경합니다.

4. b 포스트잇에 적힌 글씨를 확인합니다.

5. b 포스트잇에 적힌 글씨는 무엇일까요?

정답은 간단하죠?

요약

실제 코드에서는 여러 가지 문맥이 엮여 있는 경우가 많아 조금 더 복잡할 수 있습니다만, 원시값의 기본적인 원리는 위와 동일합니다. 매우 단순한 편이고, 이해하는데 크게 어렵지 않습니다.

여러분이 다루고 있는 값이 원시값인지, 어떤 값이 어떤 변수에 언제 어떻게 대입되었는지만 잘 판단하시면 큰 무리가 없을 것이고, 나머지는 경험이 필요한 부분입니다.

또한 조금 반대로 말씀드리자면 얼핏 보면 쉬워 보일 수 있지만, 실제 코드 상황에서는 방심하여 실수가 많이 발생하는 부분이기도 합니다. 실수없이 정확하게 판단할 수 있어야 하므로 자만하지 말고 경험을 쌓으며 시간을 성실히 써보세요.

중요한 순간의 단 한번의 실수가 큰 차이를 만들 수 있습니다.

네카라쿠배 당토직야와 같은 좋은 회사에 가는 신입들은 어떤 차이가 있냐고 많이 여쭤보시죠. 그런 분들은 사소한 부분들에 대해 스스로에게 엄격합니다. 그리고 그것들이 쌓여 중요한 순간에 실수가 적어 기본기가 탄탄하다는 인상을 면접관들이 받게 되구요. 물론 소프트 스킬이나 다른 것들도 많지만..

오늘의 잔소리 그만..