m1ndy5's coding blog

JavaScript 기초 - 변수, 연산 등 본문

프론트엔드/java script

JavaScript 기초 - 변수, 연산 등

정민됴 2023. 4. 30. 15:06

What is JavaScript?

자바스크립트는 웹 브라우저 상에서 동작을 구현할 수 있는 객체 기반의 언어

Variables

값을 보관해두기 위한 공간, 값 그 자체
값을 재할당할 수 있음
컴퓨터 내 메모리 공간에 저장하여 재사용가능할 수 있게 함

// 안녕하세요 저는 mindyo입니다.
const name = 'mindyo';
console.log(`안녕하세요 저는 ${name}입니다.');

저장되는 공간은 어디?

RAM에 위치, 일련의 주소값과 매칭됨

변수의 종류와 선언 및 초기화(할당)

  • var : 변수 -> 호이스팅이 일어남(코드 오류 발생 소지를 높임) -> 잘 사용하지 않음
  • *호이스팅이란? -> 선언 위치와 상관없이 최상단으로 끌어올림
  • let : 변수(값 재할당 가능) -> var대신 사용됨
  • const : 상수(값 재할당 불가)
    기본적으로는 const로 작성하고 필요한 부분에만 let하는 것이 이상적!!

정적 타입 언어 vs 동적 타입 언어

  • 정적 타입 언어 : 컴파일 타임에 타입을 확인함 (ex. C, Java etc)
    • 컴파일시 타입에 대해 미리 확인하기 때문에 타입 관련 런타임 오류를 방지 가능
    • 타입이 명시적으로 지정돼 있기 때문에 가독성이 좋음
  • 동적 타입 언어 : 런타임에 타입을 확인함 (ex. Python, JavaScript etc)
    • 정적 타입 언어에 비해 지켜야할 규칙이 적어 코드가 짧고 쉬움

컴파일타임 vs 런타임

  • 컴파일타임 : 코드에 오류가 있다면 컴파일 되지 않음
  • 런타임 : 일단 실행이 되고 오류가 있는 부분에서 에러남

연산자

자바스크립트는 1 == '1'이 true가 되는 말도 안되는(?) 일이 발생한다
그 이유는 암묵적 변환이 일어나기 때문!!
따라서 자료형, 값까지 완벽하게 일치하는지를 확인하려면 =을 3번 써서 확인해야한다 ===

기본 자료형 vs 참조 자료형

  • 기본 자료형 : 스택 메모리에 생성된 공간에 실제 변수값을 저장 (ex. const a = 5;)
  • 참조 자료형 : 실제 데이터 값은 힙 메모리에 저장하고, 스택 메모리 공간에는 힙 메모리 위치값을 저장 (ex. const xhr = new XMLHttpRequest();)

스택 메모리 vs 힙 메모리

  • 스택 메모리 : 함수의 호출과 관계되는 지역 변수와 매개변수가 저장되는 영역
    함수의 호출과 함께 할당되며, 함수의 호출이 완료되면 소멸
    접근 속도 빠름
  • 힙 메모리 : 사용자가 직접 관리할 수 있는 메모리 영역
    사용자에 의해 메모리 공간이 동적으로 할당되고 해제
    new나 포인터를 사용해 동적 메모리 할당
    접근 속도 느림