Coding/JavaScript

[자바스크립트] 3. 데이터 타입

미스터로즈 2021. 7. 7. 14:56

자바스크립트 기초 강의(ES5+) - 드림 코딩 by 엘리 강의 정리 입니다. 

자세한 내용을 공부하고 싶으시면 위의 링크에 들어가셔서 학습하시는 것을 추천드립니다.

 

 

프로그래밍에서 가장 중요한 것은?   입력 & 연산 & 출력

1. let 

let name = 'ellie';
console.log(name);
name = 'hello';
console.log(name);

 

 

let이라는 키워드를 이용해서 name을 만들면 포인터 형식으로 데이터를 가리킵니다.

ellie에서 hello로 변경됨

 

 

블록 안에서 만들어진 변수는 블록 밖에서 접근할 수 없습니다.

블록 밖에서 만들어진 변수는 블록 안, 밖에서 접근할 수 있습니다.

// 1. Use strict
//added in ES5
//use this for Valia Javascript

'use strict';

//2. Variable
// let(added in ES6)
let globalName = 'global name';

{
  let name = 'ellie';
  console.log(name);
  name = 'hello';
  console.log(name);
  console.log(globalName);
}

// 블록으로 감싸서 안으로 접근할 수 없습니다.
console.log(name);
console.log(globalName);

 

2. Var 는 사용 금지!!!

//var(don't ever use this!)
//var hoisting (move declaration from bottom to top)
console.log(age);
age = 4;
console.log(age);
var age;

//에러가 발생함
name = 4;
let name;

 

- var의 경우 선언을 하기도 전에 값을 선언해도 값이 출력이 됩니다.

하지만 let을 사용하면 바로 오류로 인식이 됩니다.

 

※Var hoisting 이란?

선언을 어디에 하든, 항상 선언을 제일 위로 끌어 올려주는 것을 의미합니다.

 

//has no block scope
{
  age = 4;
  var age;
}
console.log(age);

Var는 블록 안에서 선언을 해도 블록 밖에서 사용할 수 있습니다.

 

3. const는 변경 불가능!

//3. Constants
//favor immutable data type always for a few reasons:
//  - security
//  - thread safety
//  - reduce human mistakes
const daysInWeek = 7;
const maxNumber = 5;

- immutable data type , 값이 변경이 되지 않는 데이터 타입

- 보완상 이유로 사용

 

자바 스크립트에서 숫자에 대한 데이터 타입 : number 로 통일

//number로 통일
const count = 17;
const size = 17.1;
console.log(`value:${count}, type:${typeof count}`);
console.log(`value:${size}, type:${typeof size}`);

숫자의 범위 및 nan

//number - speicla numberic values :infinity, -infinity , NAN
const infinity = 1 / 0;
const negativeInfinity = -1 / 0;
const nAn = 'not a number' / 2;
console.log(infinity);
console.log(negativeInfinity);
console.log(nAn);

- 1/0은 무한대를 출력 -1/0 마이너스 무한대를 출력

- 숫자가 아닌 것을 넣으면 NAN을 출력

 

4. String

//string
const char = 'c';
const brendan = 'brendan';
const greeting = 'hello ' + brendan;
console.log(`value:${greeting}, type:${typeof greeting}`);
const helloBob = `hi ${brendan}!`;
console.log(`value:${size}, type:${typeof size}`);
console.log(`value:${helloBob}, type:${typeof helloBob}`);

- 자바스크립트에서는 char와 String을 따로 구분하지 않고 사용하면 됩니다.

- `` 백틱을 이용하는 이유는 +를 붙여 가며 일일히 작업을 하지 않아도 됩니다. 

 

5. boolean

// boolean
// false: 0, null, undefined,NAN,''
// true: any other value
const CanRead = true;
const test = 3 < 1;
console.log(`value:${CanRead}, type:${typeof CanRead}`);
console.log(`value:${test}, type:${typeof test}`);

- 참 거짓을 판별

 

6. null & undefined

//null
let nothing = null;
console.log(`value:${nothing},type:${typeof nothing}`);

// undefined
let x;
console.log(`value:${x}, type:${typeof x}`);

- null은 아무것도 아니라는 값을 지정해줌

- undefined는 선언은 되었지만 값을 넣지 않은 경우

 

7. symbol

//symbol
const symbol1 = Symbol('id');
const symbol2 = Symbol('id');
console.log(symbol1 === symbol2);
const symbol1 = Symbol.for('id');
const symbol2 = Symbol.for('id');
console.log(symbol1 === symbol2);

- 위에 콘솔에서는 같은 것을 심볼로 정의해도 유니크한 심볼이 되기 때문에 false가 되고

- 아래 콘솔에서는 주어진 것에 대한 심볼이기 때문에 true가 됩니다.

 

다이나믹 타이핑(Dynamic typing)

let text = 'hello';
console.log(text.charAt(0));
console.log(`value:${text}, type:${typeof text}`);
text = 1;
console.log(`value:${text}, type:${typeof text}`);
text = '7' + 5;
console.log(`value:${text}, type:${typeof text}`);
text = '8' / '2';
console.log(`value:${text}, type:${typeof text}`);
//에러 발생 console.log(text.charAt(0));

 

 

 

- 타입에 대한 지정의 필요성이 생김 -> 타입 스크립트