데이터와 형태

📌변수란?

데이터를 처리하기 위해, 기억해야 한다.

• 데이터를 처리하는 과정에서, 처리 흐름마다 값들을 기억해둘 필요가 있다.
• 컴퓨터는 데이터를 기억하기위해 메모리를 활용
  • 메모리란: 컴퓨터의 기억장치
• 메모리
  • 메모리에 데이터를 담아 기억
  • 각각의 위치 주소값이 존재
  • 위치를 찾기 위해서는 메모리의 주소값사용

메모리의 주소값의 별칭, 변수

• 메모리 주소값을 대신할 식별자를 지정하고, 식별자를 통해서 데이터 접근
• 식별자 == 변수

  변수란,

• 데이터를 담아둔 메모리의 주소를 쉽게 식별하기 위해 붙인 이름

📌변수 생성 방법과 호이스팅

3단계를 거쳐 생성되는 변수

1.선언단계: 변수를 변수 객체에 등록

2.초기화단계: 변수를 메모리에 할당하고, undefined로 초기화

3. 할당 단계: undefined로 초기화된 변수에 실제로 값을 할당

변수 생성 3단계는 키워드별로 다르게 동작한다.(var, const, let)

var 키워드

• 코드평가단계: 선언과 동시에 초기화 진행
• 코드실행단계: 값 할당 진행
• 코드 평가 시점에 초기화가 되어있으므로,

  변수의 할당문이 실행되기 전에도 참조가 가능하다.(호이스팅)

  호이스팅: 모든 선언문이 해당 scope의 선두로 옮겨진 것처럼 동작하는 특성

var 키워드 - 단점

• 키워드의 생략 가능
• 중복 선언 가능
• 변수 호이스팅

var 키워드 - 단점 - 전역변수화

• 전역 변수화 되어, 무분별한 변수 접근
• 스코프:
  • 코드가 실행되는 과정에서,
    변수와 같은 식별자를 찾아야하는 코드가 있을때 자바스크립트가 갖고 있는 규칙
  • 전역 스코프(global), 지역스코프(local)
• 의도치 않은 변수값 변경, 코드 예측이 어려워짐

const, let 키워드

• 코드 평가단계: 선언 진행
• 코드 실행단계: 초기화 진행, 할당 진행
• 코드 평가시점에 선언만 진행되므로, 변수의 할당문이 실행되기 전에 참조가 불가능합니다.
  • ReferenceError가 발생

블록 레벨 스코프

• 코드 블록 내에서 접근 가능한 스코프
• 변수에 한정적으로 접근이 가능하므로,
• 예측 가능한 범위 내에서 변수 변경이 일어남

const 키워드

• 수정 불가능한 "상수 변수"를 선언할 때 사용
• 무조건 값을 할당

let 키워드

• 재할당이 가능한 변수 타입
• 값을 할당하지 않아도 생성

📌자료형이란?

컴퓨터는 데이터를 어떻게 처리를 할까?

• 우리는 컴퓨터에게 데이터의 종류를 지정해주고, 알려주어서, 데이터 종류에 맞게 적합한 로직처리를 할 수 있게 해주어야 한다.
• 여기서 말하는 데이터의 종류를 데이터 타입, 자료형이라고 한다.

데이터 타입, 자료형

• 언어별로 지원하는 데이터 타입은 모두 다르다.
• c언어: 문자, 정수, 실수 ...
• Java: 문자, 정수, 실수, 논리,
• python: 문자, 정수, 실수

자바스크립트 데이터 타입 - 원시 타입

• 자바스크립트는 7가지의 원시 타입을 제공
  • string, number, bigint, undefined, null, boolean, symbol
• 원시 타입의 특징
  • 값은 변경 불가능한 값이다. immutable value
  • "값" 으로써 전달된다.(참조 형태로 전달되는 것이 아닌)
• 자바스크립트에는 원시 래퍼 객체가 따로 존재한다.
• 원시 데이터를 사용할 경우, 해당 래퍼 객체들을 상속받아 사용할 수 있다.
• 원사 래퍼 객체와 원시 타입을 헷갈리지 말기

객체타입

• 원시 타입의 값을 제외한 자바스크립트에서의 모든 것은 객체다.
  • 객체는 여러 형태로 분류할 수 있다.
  • 일반 객체와 함수, 날짜, 인덱스 컬렉션, 키 컬렉션, ...
• 객체 타입의 특징
  • 객체는 참조방식으로 전달된다.
  • 객체는 속성들을 변경할 수 있는 mutable한 값

📌Number Type, Biglnt Type

Number Type

• 숫자에는 정수, 실수가 존재
  • 자바스크립트에는 하나의 숫자 타입만 존재 = Number
• 자바스크립트는 모든 숫자를 실수로 처리
  • 정수타입 없음
• 숫자형에는 우리가 아는 숫자 이외에 infinty, NaN이라는 값도 존재한다.
  • infinity: 무한대를 나타내는 숫자
  • NaN: Not A Number의 줄임말, 숫자가 아님을 나타낸다.

Biglnt Type

• 임의 정밀도로 정수를 나타낼 수 있는 자바스크립트 숫자 원시 값

📌String Type, Boolean Type

String type

• 텍스트 데이터를 나타낼 때 사용
• utf-16 코드 단위의 시퀀스로 표현
  • 16 bit 정수값의 요소로 구성된 집합
  • 각 요소가 string 한 자리
  • 0번째 index부터 시작
• 원시값 불변 == 문자값 불변
• 따옴표나 쌍따옴표, 백팃으로 감싸서 문자열임을 표현
• 템플릿 리터릴 표기법(``)
  • 문자열 처리 기능 제공(줄바꿈 제공, 표현식 삽입 가능)

Boolean Type

• 논리적 데이터 유형
• 참 혹은 거짓의 값만 가질 수 있다.

📌undefined 와 null Type, Symbol Type

undefined Type

• 변수를 선언한 후 값을 할당하지 않은 변수에 할당이 되는 값
• 개발자가 의도해서 넣은 값이 아니다
• 의도해서 넣을 수도 있따.

Null Type

• 값이 없다는 것을 의도적으로 표현할 때 null을 사용
• 의도적으로 더이상 참조하지 않겠다는 뜻
• 타입체크는 일치연산자(===) 사용

Symbol Type

• ES6에 추가된 타입
• 중복되지 않는 유니크한 값이다.
  • 객체의 key로 사용될 수 있다.
  • 클래스나 객체형식의 내부에서만 접근할 수 있또록 전용 객체 속성의 키로 사용
• symbol함수를 호출하여 생성

📌Reference type

객체 타입

• 객체타입, object type, reference type
• 객체 타입: 다양한 타입의 값을 하나의 단위로 구성한 복합적인 자료구조
  • 객체: 데이터(속성), 데이터에 관련한 동작을(method) 포함하는 개념적 존재
• 원시 타입의 값을 제외한 자바스크립트에서의 모든 것은 객체

mutable

• 변경 가능한 값: 객체의 속성을 변경, 추가, 삭제 가능
  • 원시값: immutable한 값
• 힙 메모리에 저장
  • 동적으로 변화 가능하므로, 메모리 공간 확보 및 저장
• 참조 타입이므로, 참조값으로 처리

📌동적 타입 언어

동적 타입 언어

• 자바스크립트는 동적 타입 언어
• 의도적으로 타입을 변환할 수도 있지만, 의도와 상관없이 변경되기도 함
  • 명시적 타입 변환
  • 암묵적 타입 변환

명시적 타입 변환

• 원시 래퍼 객체를 활용하여 개발자가 의도적으로 타입을 변경할 수 있다.
  • 값.toString() 문자열 타입으로 변환
  • Number(값) 숫자타입으로 변환
  • Boolean(값) 불리언 타입으로 변환

암묵적 타입 변환

• 개발자가 의도하지 않았지만, 타입이 변경될 때
  • 값 + "" 문자열 타입으로 변환
  • 값 * 1 숫자타입으로 변환
  • !!값 불리언 타입으로 변환
• 값이 전달될 때, 참조되어있는 변수 값 타입이 개발자의 의도와 다르게 암묵적 타입변환으로 변경될 가능성
  -> 타입추론이 어려워져, 불필요한 디버깅 시간 발생
• 해결하기 위해
  • 전달되는 시점마다 typeof나 일치연산자를 사용하여 타입 guard구현
  • 자바스크립트 superSet 타입스크립트 사용