Modern JavaScript 데이터타입과 변수

---

1. 데이터타입과 변수

 

 

• 변수 : 메모리상의 주소를 기억하는 저장소 (address)
• 동적타이핑 : js는 동적타입 언어로 변수의 타입지정 없이 값이 할당되는 과정에서 자동으로 변수타입이 결정된다.
• 원시타입 : 변경 불가능한 값, 값에 의한 전달

 

- Number : 모든 수를 실수로 처리

- Infinity   : 양의 무한대  / -Infinity : 음의 무한대

- NaN       : 산술연산 불가

- String    : js 특징으로 일부 문자를 변경할 수 없다. (새롭게 문자열을 할당해야한다.)

- Boolean : false / true

- Undefined 

- Null

- Symbol : 이름의 충돌을 줄이기 위해 유일한 객체 프로퍼티 키를 만들어 사용 (object의 프로퍼티가 많을때 같은 프로퍼티를 추가하여 생기는 코드오류 방지)

let obj = { 
  name: "cy"
};

let id = Symbol("id");

obj[id] = 1;

console.log( obj[id] )

 

 

Tip) Typeof 연산자로 값 타입 확인 가능

         Null 타입 확인시 일치연산자 ‘===‘사용

 

 

---

 

2. const / let / var 차이점

• let      : update 허용
• const : update 허용 x
• var     : 이전의 js 에서 쓰던 방식으로 update 가 어디서든 가능, 데이터가 보호 받기 힘듬 (실수로 연산해도 알려주지 않음)  

 

---

 

3. var 문제점

 

• 함수레벨 스코프 : 전역변수 남발
• 키워드생략허용 : 의도치않은 변수 전역화
• 중복 선언 허용
• 변수 호이스팅 : 변수 선언전 참조 가능
• 이를 보완하기 위해 Let / const 키워드가 도입

 

---

 

4. 호이스팅 

 

• 모든 선언문이 해당 Scope의 선두로 옮겨진 것처럼 동작하는 특성-위치와 상관없이 어디서든 호출가능
• 함수 선언문으로 정의된 함수는 엔진이 스크립트를 로딩하는 시점에 바로 초기화하고 VO에 저장한다. (선언, 초기화, 할당 한번에 이루어짐)
• 모든 선언문이 해당 Scope의 선두로 옮겨진 것처럼 동작하는 특성 (위치와 상관없이 어디서든 호출가능)
• 함수 선언문으로 정의된 함수는 엔진이 스크립트를 로딩하는 시점에 바로 초기화하고 VO에 저장한다. (선언,초기화,할당 한번에 이루어짐)

 

- 선언단계 : 변수개게 변수에 등록, 객체는 스코프 참조 대상

- 초기화단계 : 등록된 변수에 메모리 할당 변수는 undifined로 초기화

- 할당단계 : undifined로 초기화된 변수에 실제값 할당

 

//함수 표현식에서 정의

var res = square(5); // TypeError: square is not a function

var square = function(number) {

      return number * number;

}

 

---

 

5. Scope

• 함수레벨 스코프 : 함수내에 선언된 변수는 함수내에서만 유효 (지역변수)
• 블록레벨 스코프 : 코드 블록내에 선언된 변수는 블록내에서만 참조

 

참고 : https://isaac-yoon.tistory.com/9

 

---

 

6. 타입변환과 단축평가

• 명시적 타입 변환

       var x = 10;

       var str = x.toString();                // 숫자를 문자열로 타입 캐스팅한다.

       console.log(typeof str);           // string

 

• 암묵적 타입 변환 : 숫자 타입 x의 값을 바탕으로 새로운 문자열 타입의 값을 생성해 표현식을 평가

       var str = x + '';

       console.log(typeof str, str);    // string 10

       console.log(x);                         // 10 변수 x의 값이 변경된 것은 아님

 

• 문자열 타입 변환

        숫자 타입 => 문자열 타입       

        String 생성자 함수를 new 연산자 없이 호출하는 방법

        console.log(String(1));                  // "1"

       

        Object.prototype.toString 메소드를 사용하는 방법        

        console.log((1).toString());         // "1"

         

        문자열 연결 연산자를 이용하는 방법        

        console.log(1 + '');                       // "1"

 

• 숫자타입변환

       문자열 타입 => 숫자 타입       

        Number 생성자 함수를 new 연산자 없이 호출하는 방법 

        console.log(Number('0'));         // 0

        

        parseInt, parseFloat 함수를 사용하는 방법(문자열만 변환 가능)

        console.log(parseInt('0'));       // 0

       

        + 단항 연결 연산자를 이용하는 방법 

        console.log(+'0');                     // 0

       

       * 산술 연산자를 이용하는 방법 

       console.log('0' * 1);                    // 0

 

• 불린타입변환

       문자열 타입 => 불리언 타입

       Boolean 생성자 함수를 new 연산자 없이 호출하는 방법

       console.log(Boolean('x'));       // true

       

       ! 부정 논리 연산자를 두번 사용하는 방법

       console.log(!!'x');       // true