항해 99 2주차 Node.js 과제

Seong Hyeon Kim·2022년 5월 17일
0

항해99

목록 보기
1/16

JavaScript의 타입과 자료구조

  • 모든 프로그래밍 언어에는 내장된 자료구조가 존재하지만 보통 그 내용은 언어마다 다릅니다. 이 글에서는 JavaScript에서 사용할 수 있는 내장 자료구조와 그 속성에 대해 알아보겠습니다. 그러면 이 자료구조들을 다른 자료구조 개발에 사용할 수 있을 것입니다. 가능하다면 다른 언어와도 비교해보겠습니다.

동적타입

  • JavaScript는 느슨한 타입(loosely typed)의 동적(dynamic) 언어입니다. JavaScript의 변수는 어떤 특정 타입과 연결되지 않으며, 모든 타입의 값으로 할당 (및 재할당) 가능합니다.

[예시]

let foo = 42 // foo가 숫자
foo = 'bar' // foo가 이제 문자열
foo = true // foo가 이제 불리언

자바스크립트의 데이터 타입

  • 자바스크립트에는 6가지의 기본 자료형과 Object라는 자료형까지해서 총 7개의 자료형이 있다.

기본 자료형

1. Boolean 타입

Boolean타입은 true와 false 둘 중 하나의 값을 갖는 논리적인 요소를 뜻한다.
A라는 물체가 물인지 아닌지를 표현한다고 하면

var isWater = true;			///이와 같이 true 또는 false로 나타내는 경우 사용한다.

2. Number 타입

Number 타입은 -(253 -1) 와 253 -1 사이의 숫자값 하나를 갖는다.
이 범위보다 크거나 작은 숫자라면 그 수는 더 이상 안전하지 않다.
때문에 매우 큰 수를 다루게 된다면, Number.isSafeInteger()를 사용하여 확인해볼 수 있다.

var ten = 10;

3. String 타입

String 타입은 텍스트 데이터를 나타낼 때 사용한다.

var welcomeText = "안녕하세요 반갑습니다";

4. Null 타입

빈 값을 뜻하는 null타입이다. 이 경우, Null타입으로, 타입은 존재하지만, 값은 없다고 볼 수 있다.

5. Undefined

Undefined는 값도 없고, 타입도 지정되지 않은 상태이다.

6. Symbol 타입

Symbol은 유일하고 변경 불가능한 기본값이다.

let Sym1 = Symbol("Sym")
let Sym2 = Symbol("Sym")

console.log(Sym1 === Sym2) // returns "false"

/// === 연산자는 타입과 값이 동일한지를 조사하는 연산자인데, 둘 다 Symbol("Sym")으로 같다고 생각할 수 있지만, 
	서로 다른 객체로 취급된다.

Object (객체)

  • 객체는 식별자로 참조할 수 있는 메모리에 있는 값을 뜻한다. 쉽게 말하면, 속성들을 담고 있는 주머니라고 볼 수 있다.
const hojune = {
  "name": "호준",
  "age": 27,
  "gender": "남자",
  "location": "서울"
}
  • 여기서 hojune이라는 객체는 name, age, gender, location 의 속성을 갖는다.

식별자 : hojune

key 값 : name, age, gender, location String (타입 또는 Symbol 타입이 사용될 수 있다.)

"호준", 27, "남자", "서울"은 각 키에 해당하는 값이라고 불리며, 어떠한 자료형도 올 수 있다.

자바스크립트에서는 Undefined를 제외하고는 모두 객체이다.


* 느슨한 언어

자바스크립트(javascript)라는 언어의 가장 큰 특징 중 하나가 '타입 선언'이 필요없다는 점이다. 자바나 C 같은 언어는 정작 타입 언어로 변수 선언에 타입을 명시해야한다. 이 후 해당 변수에 호환 되지 않는 타입을 사용할 때 컴파일 에러가 발생한다.

int foo = 10;

foo = 10.3f // Error!!

foo = (int)10.3f // OK!!

위 코드를 예로 들면, int foo 로 선언된 변수에는 정수형 데이터만 담을 수 있다. 만약 1.02f 같은 실수형 데이터를 할당하면 컴파일 에러가 발생한다. 강제로 입력하기 위해서는 타입 변환(Type Casting)을 해야한다. 자바나 C 같은 언어의 기초 단계에서 배우는 내용이다.

하지만 자바스크립트는 이런 변수 타입이 없다. 자바스크립트의 변수 타입은 미리 선언할 필요가 없고, 값을 변수에 할당하는 순간 결정된다. 이러한 특징을 가진 프로그래밍 언어를 '느슨한 타입(loosely typed)' 혹은 '동적 타이핑(dynamic typing)' 언어라고 한다.

var foo = 10;
var foo = 10.3;
var foo = "10.3";
자바 스크립트에서는 이렇게 변수의 타입이 런타임(Runtime)에 결정된다.


* undefined 와 null의 특징

  • null과 undefined를 보이는 그대로 해석하면 ‘빈 값’과 ‘없는 값’을 의미하는 것처럼 보이지만 사실 큰 차이점이 있다.

* undefined와 null의 공통점

  • 둘다 각각의 타입명(undefined, null)의 값이 유일하다.
  • undefined 타입의 값은 undefined가 유일한다.
  • null 타입의 값은 null이 유일하다.

* undefined 타입의 특징

  • undefined는 원시 자료형 undefined로 분류된다.
  • undefined는 ‘아무 값도 할당받지 않은 상태’를 의미한다.
  • var 키워드로 선언한 변수는 암묵적으로 undefined로 초기화된다.
  • 변수 선언에 의해 확보된 메모리 공간을 처음 할당이 이뤄질 때까지 빈 상태( *대부분 비어 있지 않고 쓰레기 값이 들어 있다. )로 내버려두지 않고 자바스크립트 엔진이 undefined로 초기화한다.
  • 따라서 변수를 선언한 이후 값을 할당하지 않은 변수를 참조하면 undefined가 반환된다.
  • 변수를 참조했을 때 undefined가 반환된다면 선언 이후 값이 할당되지 않은 즉, 초기화되지 않은 변수라는 것을 알 수 있다.
var a;
console.log(a); // undefined
console.log(typeof a); // undefined
  • 이처럼 undefined는 개발자가 의도적으로 할당하기 위한 값이 아니라 자바스크립트 엔진이 변수를 초기화 할 때 사용하는 값이다.자바스크립트 엔진이 변수를 초기화라는 데 사용하는 undefined를 개발자가 의도적으로 변수에 할당한다면 undefined의 본래의 취지와 어긋나고 또한 혼란을 야기하므로 권장하지 않는다.
  • 선언과 정의
    undefined를 직역하면 ‘정의되지 않은’이란 의미이다.
    자바스크립트 undefined에서 말하는 정의란 ‘변수의 값을 할당하여 변수의 실체를 명확히 하는 것’를 의미한다.
    자바스크립트의 경우 변수를 선언하면 암묵적으로 정의가 이뤄지기 때문에 선언과 정의의 구분이 모호하다.
    ECMAScript 사양에서 변수는 ‘선언한다.’라고 표현하고, 함수는 ‘정의한다.’라고 표현한다.

그렇다면 변수에 값이 없다는 것을 명시하고 싶을 때는 어떻게하면 좋을까? 바로 undefined를 할당하는 것이 아니라 null을 할당한다.

* null 타입의 특징

  • null은 원시 자료형 null로 분류된다.
  • 자바스크립트는 대소문자를 구분하므로 null은 Null, NULL 등과는 다르다.
  • null은 ‘비어있는, 존재하지 않는 값'(값의 부재)을 의미한다.
  • 프로그래밍 언어에서 null은 변수에 값이 없다는 것을 의도적으로 명시(의도적 부재)할 때 사용한다.
  • 변수에 null을 할당하는 것은 변수가 이전에 참조하던 값을 더 이상 참조하지 않겠다는 의미이다.
  • 이는 이전에 할당되어 있던 값에 대한 참조를 명시적으로 제거하는 것을 의미하며, 자바스크립트 엔진은 누구도 참조하지 않은 메모리 공간에 대해 가비지 콜렉션을 수행할 것이다.

* 자바스크립트의 형변환

프로그래밍을 하다보면 여러가지 경우에 데이터의 타입을 변화시켜야할 경우가 생깁니다. 자바스크립트에서 문자열을 숫자로, 숫자를 문자열로 바꾸는 등의 형을 변화시키는 방법은 크게 두가지가 있는데요.

연산의 결과에 의해 암시적으로 형이 변화하는 암시적 형변환과 개발자가 직접 형을 변화시켜주는 명시적 형변환 방법이 있습니다.

* 암시적 형변화

  • (+)연산을 할 경우, 숫자와 문자열을 더하거나 불리언과 문자열을 더할 경우 모두 문자열로 변환한후 문자열을 연결합니다.
var a = 10 + "10";     //-> "1010"
var a = true + "10";   //-> "true10"
  • 불리언과 숫자를 더할 경우 true는 1 false는 0으로 평가하여 숫자로 더하게 됩니다.
var a = true + 10;     //-> 11
  • 연산자(+) 를 이용해 문자열을 숫자로 변경할 수 있습니다.
var n = "42";
+n  //-> 42

* 문자열로 형변환하기

  • Number 객체의 메서드를 이용해 숫자를 문자열로 변환할 수 있습니다.
/* 숫자를 문자열로 형변환 */
var n = 15;

// 숫자를 문자열로 변환한다.
n.toString();    //-> "15"

// 인수로 기수를 전달해 진법을 결정할 수 있다.
n.toString(16);  //-> "f"

// 인수로 전달한 숫자만큼의 소수점 자리수를 포함한 문자열로 변환한다.
var n = 12.345
n.toFixed(1)  //-> '12.3'
n.toFixed(3)  //-> '12.345'

// 인수로 전달한 유효숫자만큼 표시한다.
n.toPrecision(1)  //-> '1e+1'
n.toPrecision(3)  //-> '12.3'
  • String함수를 이용해 함수의 인수를 문자열로 변환합니다.
String(15);    //-> '15'
String(true);  //-> 'true'

* 숫자로 형변환하기

parseInt와 parseFloat 함수를 사용해 문자열을 숫자로 변환합니다.
parseInt 함수는 문자열을 정수로 변환하고, parseFloat 함수는 문자열을 부동소수점으로 변환합니다.

/* parseInt */
parseInt("1010");  //-> 1010

// parseInt의 두번째 인자로 진수를 지정할 수 있습니다.
parseInt("16 volts", 10);  // 16

// 문자열을 16진수로 해석해서 10진수로 변경
parseInt("3a", 16);        //=> 58

/* parseFloat */
parseFloat("10.10");  //-> 10.1
  • Number 함수를 이용해 함수의 인수를 숫자로 변환합니다.
Number("10.10");  //-> 10.1
Number(false);    //-> 0
  • Date 객체를 숫자로 변경할 수 있습니다.
var d = new Date();
d.valueOf();  //-> UTC 1970/1/1 기준 밀리초

* 불리언으로 형변환하기

/* 불리언으로 형변환 */
var n = 0;
!!n;        //-> false
Boolean(n)  //-> false

profile
삽질도 100번 하면 요령이 생긴다. 부족한 건 경험으로 채우는 백엔드 개발자

0개의 댓글