localhost와 배열과 객체의 비교

채재헌·2024년 6월 18일
1
post-thumbnail

📌localhost

라이브 서버를 사용해서 페이지를 열면 주소창에 localhost라는 문자가 나오게 된다.
이 localhost는 사용자의 컴퓨터 자체를 가리키는 ip 주소, 127.0.0.1과 같은 주소를 의미한다.

과연 둘은 서로 전혀 다르게 생겼는데 어떻게 같은 역할을 한다고 할 수 있을까?

이를 이해하기 위해서는 DNS(Domain Name System)이라는 개념을 알 필요가 있다.

쉽게 말하자면 우리가 어떠한 식당을 지칭할 때, 주소 하나하나를 이야기하는 경우는 거의 없을 것이다. 그러므로 우리는 이를 조금 더 이해하기 쉽고 직관적인 그 식당의 이름을 통해서 지칭한다.
이때 127.0.0.1과 같은 IP 주소가 해당 식당의 상세 주소와 같은것이고,localhost와 같이 우리가 이해하기 쉽고 직관적인 주소를 도메인이라 부른다.

DNS에 관한 자세한 정보는 아래의 링크를 통해 확인 할 수 있습니다.
DNS에 관한 자세한 정보 링크

localhost의 뒤에는 어떠한 숫자가 붙어져 나오는데요.
이 숫자는 port라고 한다. 그리고 사진에 보이는 5500이라는 port는 라이브 서버가 우리의 localhost로 접근할 수 있도록 열어둔 5500이라는 번호를 가진 문인것이다.

포트 번호에 대한 자세한 내용은 아래 링크를 통해 더 볼 수 있습니다. (IP/TCP/HTTP,등)
Port 번호와 관련된 자세한 내용 링크


🧨배열과 객체의 비교

원시타입과 참조 타입

사실 자바스크립트의 데이터타입은 크게 두가지 타입으로 나뉘게 된다.
바로 원시타입( Primitive type )참조타입( Refrence type ) 이다.

원시타입의 종류

자바스크립트에서의 원시타입은 아래 7개 이다.

  • String
  • Number
  • Boolean
  • Bigint
  • undefined
  • Symbol
  • null

참조타입의 종류

참조타입의 종류는 위의 7종류를 제외한 나머지 모든 것이 참조 타입이다.
간단히 말하자면 참조타입은 객체타입 이다 라고 봐도 무방하다.

원시타입의 특징

원시타입은 불변성이라는 특징을 가진다.
불변성이란 변하지 않는 속성인데, 말 그대로 데이터가 변하지 않는 속성이다.
아래 예시에서 자세히 알아보도록 하겠다..

우리가 box라는 변수에 ‘abc’라는 문자열을 할당하면 이 문자열은 101이라는 주소를 가진 메모리에 저장된다.
이후, 아래와 같이 box에 ‘def’를 재할당 하면...

‘def’ 는 아까 101주소의 메모리에 저장되어 있는 ‘abc’를 바꾸는 것이 아닌 102주소를 가진 메모리에 ‘def’를 저장 한 후 box에 102번 주소를 가진 메모리를 다시 할당된다.

이를 우리는 원시타입의 불변성이라고 부른다.

참조타입의 특징

참조타입의 특징은 눈치채신분도 계시겠지만 원시타입과 반대로 가변성 을 가지고 있다.
가변성은 불변성과 반대되는 속성을 가지고 있다.
즉, 101번 주소를 가지고 있던 메모리 값을 수정 할 수 있다는 뜻이다.

단, 참조타입에서 주의해야 할 점 이 있습니다. 아래에서 자세히 알아보도록 하자.

414 주소를 가진 메모리 에 객체의 정보가 저장되어있다.
메모리의 값은 참조타입의 특징 가변성 을 가지고 있고,

즉, 이 메모리의 주소는 참조만 해올 뿐 주소가 할당 되는 것이 아니다.따라서 변화가 가능하다.

하지만, 414번 주소를 할당한 201번 주소를 가진 메모리는 불변성을 지니고 있다.
201번 주소를 가진 메모리는 원시타입의 메모리 주소와 같은 원리를 가진다.
쉽게 생각해서객체의 껍데기주머니,객체의 안에 있는 데이터(property)들 이라고 하면
주머니는 바꿀 수 없지만 , 주머니 안의 공은 바꿀 수 있으며 심지어 삭제와 추가도 가능능하다는것이다.


0개의 댓글