데이터타입(type) & 변수(variable)

Sunwoo·2021년 4월 23일
0

데이터 타입 & 변수

let globalName = 'global name'; // 글로벌 스코프
{
  let name = 'sean';
  console.log(globalName); // 출력
  console.log(name); // 출력
}
console.log(globalName); // 출력
console.log(name); // 출력안됨

블록 처리된 곳으로 변수의 인식 범위가 그 안으로 한정된다. 이걸 로컬 스코프라고 한다. 그 안에 선언된 변수를 지역변수라고 한다. 반대로 가장 밖에선 선언된 변수를 전역변수라고 한다. 전역 변수는 어디서든지 불러올 수 있다.

자바스크립트에선 호이스팅이 자동으로 실행된다. 호이스팅이란 선언의 위치와 상관없이 선언을 최상단(우선 실행)으로 끌어올리는 것을 말한다. 그래서 유연한 var 를 사용해서 변수를 사용하면 블록과 상관없이 상단으로 올라가기 때문에 블록으로 감추고자 하는 변수가 노출되어 버린다. 따라서 var는 사용하지 말고 let만 사용하도록 하자.

변수 타입 const(constants)는 선언 이후 포인터를 잠궈 값을 변경할 수 없다. 이를 Immutable 타입 데이터라고 한다. 값은 선언하고 변경하지 않는 편이 좋다. 보안상의 이유, 동시 처리(thread)의 안정성, 개발자 실수 방지를 위함이다.

primitive 타입은 더 이상 작은 단위로 나눠질 수 없는 타입(single item)으로 number, string, boolean, null, undefined, symbol가 있다. object 타입은 single item 들을 묶어서 한 단위로 관리할 수 있는 타입을 말한다. function도 데이터 타입 중 하나이다. first-class function 지원이란, function도 다른 데이터 타입처럼 변수에 할당이 가능하고, 인자로도 전달이 가능하며 함수의 리턴 타입으로 function으로 리턴할 수 있는 것을 말한다. 자바스크립트가 여기에 해당한다.

자바스크립트는 동적 타입이 적용되기 때문에 어떤 숫자든 number로 처리한다. 이는 타입스크립트에서도 적용된다. number의 값 처리는 결과값이 무한인 경우 Infinity와 음의 무한대 -Infinity, 그리고 숫자가 아니라는 뜻의 NaN가 특수값으로 존재한다.

//bigInt
const bigInt = 123412412343123n; // 마지막에 n을 붙여주면 bin int가 된다. 
console.lgo(`value: ${binInt}, type: ${typeof bigInt}`);
Number.MAX_SAFE_INTEGER;

최근에 추가된 bigInt 타입은 기본 수의 표현 범위(-2^53~2^53)을 넘는 수를 표현 가능하며 아직은 크롬, 파이어폭스만 사용할 수 있다.

template literals (string)은 백틱으로 문장을 감싸고 ${}로 변수를 처리하는 포맷형식이다.

boolean타입은 유의할 것이 false로 처리되는 것의 종류이다. 0, null, undefined, NaN, '' 는 boolean에서 모두 false로 인지한다. 반대로 true는 그 외 값이다.

null은 값이 없다고 지정해주는 것이고, undefined는 선언은 되었지만 아무 것도 값이 지정되어 있지 않는 경우이다.

symbol은 map과 같은 고유한 식별자가 필요한 경우 우선순위와 같이 식별자를 이용할 때 사용된다. string으로 symbol을 만들어도 고유한 식별자가 되기 때문에 다르게 적용된다.

const symbol1 = Symbol('id');
const symbol2 = Symbol('id');
console.log(symbol1 === symbol2); // false
const gSymbol1 = Symbol.for('id'); //for를 사용하면 같은 식별자 가능
const gSymbol2 = Symbol.for('id');
console.log(gSymbol1 === gSymbol2); // true
console.log(`value: ${symbol1.description}, type: ${typeof symbol1}`);
//symbol은 description으로 string으로 변환하고 출력해줘야한다. 

주의해야 할 연산자 경우

자바스크립트는 동적 타입 언어로 런타임 즉, 프로그램이 동작할 때 결정된다.

let text = 'hello';
text.charAt(0); // h
text = 1; // type: number
text = '7' + 5; // 75 type:string
text = '8' / '2'; // 4 type:number
text = 1+''; // 1 type:string
text = '1'*1 // 1 type:number
~~text.charAt(0);~~ // text.charAt is not a function

따라서 타입이 변경되었지만 인지하지 못할 수 있다. 그래서 등장한 것이 타입 스크립트로 유연한 자바스크립트의 변수를 깐깐하게 처리하게 된다.

// || (OR) 셋중 하나라도 true이면 true
console.log(`or: ${value1 || value2 || check()}`);

// && (and) 셋 모두가 true이어야 true
console.log(`and: ${value1 && value2 && check()}`);

or 연산자와 and 연산자는 활용성이 크다. 조건 앞에서부터 검사하기 때문에 모두 결과가 true이면 통과하는 형태로 '검사' 할 수 있으면 앞에서 빨리 cut 하는 시스템이 더 효율적이다.

const stringFive = '5';
const numberFive = 5;
console.log(stringFive == nuberFive); // true
console.log(stringFive === nuberFive); // false

타입이 다르면 원래는 false로 되어야 하지만 자바스크립트의 유연성 때문에 해석해서 처리해준다. 따라서 ===로 검사하는 것이 맞다.

profile
한 줄 소개 너무나 어려운 질문이다.

0개의 댓글