Posts built-in 객체에 대해 알아보자
built-in 객체에 대해 알아보자
Cancel

built-in 객체에 대해 알아보자

빌트인 객체에 대해 오늘 조금 공부를 해볼 것이다.
완전 처음 듣는 built-in 객체..
너는 뭐냐?


자바스크립트 객체의 분류

자바스크팁트 객체는 크게 3가지로 분류할 수 있다고 한다.

  1. 표준 빌트인 객체 (standard built-in objects)
    표준 빌트인 객체는 ECMAScript 사양에 적의된 객체며, 전역의 공통 기능을 제공한다.
    별도의 선언 없이 전역 변수처럼 언제나 참조 가능!

  2. 호스트 객체 (host objects)
    호스크 객체는 자브스크립트 실행 환경에서 추가 제공되는 객체들이다.

  3. 사용자 정의 객체 (user-defined objects)
    우리가 직접 정의하는 객체들이다.

이제 얘네들을 하나씩 한 번 알아보자.


표준 빌트인 객체

이름만 처음 듣지 사실 우리가 늘 쓰던 녀석들이다.
표준 빌트인 객체의 종류는 다음과 같다.
String, Object, Number, Boolean, Date, Math, RegExp, Array, Map/Set, Promise
Error 등 40여 가지 객체를 자바스크립트가 제공해준다.

이들 중 몇 개를 제외한 객체는 모두 인스턴스를 생성할 수 있는 생성자 함수 객체다.
생성자 함수 객체라는 것은 new 연산자를 통해 인스턴스를 만드는 것을 말한다.

1
2
3
new Date()
new String("HI")
new Array(1,2,3)  ...

이렇게 표준 빌트인 객체로 생성된 인스턴스들은 표준 빌트인 객체의 prototype 프로퍼티에 바인딩된 객체다.
표준 빌트인 객체의 prototype 프로퍼티에 바인딩 된다는 것은
표준 빌트인 객체의 메서드를 사용할 수 있다는 것이다.

1
new Number(1).toFixed()

그런데 사실 우리는 new 없이도 해당 메서드를 잘 사용하고 있어서 이 부분은 잘 이해가 가지 않는다..


원시값과 래퍼 객체

우리는 문자열, 숫자 등을 그냥 선언 및 변수로 만들 수 있다.
그런데 왜 얘네들을 만들어 주는 빌트인 객체가 또 존재할까?
아무래두 원시 값으로 만드는 것과 빌트인 객체로 만드는 것의 차이점이 분명 있을 것이다.

우리가 생성자로 만들지 않아도 원시값들도 마치 객체처럼 메서드를 사용할 수 있다.

1
2
3
const a = "HI"
a.length
a.toUpperCase()

그동안 왜 이것을 몰랐을까?
자바스크립트에서 .은 객체의 프로퍼티를 나타내는 것인데
마치 당연한 것인듯 써오고 있었다.

이렇게 사용할 수 있는 이유는 자바스크립트 엔진이 일시적으로 객체로 변환해 주기 때문이다.
원시값을 객체로 사용하면 자바스크립트는 암묵적으로 연관된 객체를 생성하여 프로퍼티에 접근하거나
메서드를 호출한 다음 다시 원시값으로 돌려놓는다.

우리가 모르는 사이이 자바스크립트가 이렇게 놀라운 일을 하고 있었다니..

이렇게 임시적으로 객체에 접근하는 것을 래퍼 객체라고 한다.

임시적으로 래퍼 객체를 만든다는 것은 어쨌든 기존의 원시값을 대체한다는 것이다.
그리고 나서 다시 원시 값으로 되돌리면 래퍼 객체는 가비지 컬렉션의 대상이 된다.


전역 객체

전역 객체는 코드가실행되기 전에 자바스크립트 엔진에 의해 먼저 생성되는 특수한 객체이다.
뿐만 아니라, 어떤 객체에도 속하지 않은 최상위 객체다.

전역 객체는 이름이 환경에 따라 조금씩 다르다.
window, global, this, frames, self 등등..

전역 객체는 어디에도 속하지 않는 최상위 객체이다.
그래서 표준 빌트인 객체, 호스트 객체, var 등 전역 변수와 전역 함수를 프로퍼티로 갖게 된다.
우리가 전에 var를 선언하면 전역 객체 안에서 불러올 수 있는 이유가 여기 있었다.

전역 객체는 짱짱맨이기 때문에 그 누구도 전역 객체를 생성하거나 생성자 함수로 만들 수 없다.

이러한 전역 객체 또한 몇 가지 메서드와 프로퍼티를 갖고 있다.
한 번 알아보자.


빌트인 전역 프로퍼티

전역 객체 프로퍼티에는 다음과 같은 기능이 있다.

Infinity

무한대를 나타내는 숫자값이다.

1
typeof Infinity

NaN

숫자가 아님을 나타내는 숫자 값이다.

1
2
3
Number("xu") // NaN
window.NaN // NaN
typeof NaN // number

undefined

원시 타입 undefiend를 값으로 갖는다.

1
window.undefiend // undefiend

빌트인 전역 함수

eval

자바스크립트 코드를 나타내는 문자열을 인수로 전달 받아
런타임에 넣어 실행한다.
실제로 쓸 일은 없을 듯.

isFinite

전달 받은 수가 유한하면 true, 무한하면 false를 반환한다.
NaN도 false로 나온다.

1
2
isFinite(0) //true
isFinite('10') // false

isNaN

인수가 NaN인지 아닌지 검사해준다.
전달받은 인수가 숫자가 아니라면 우선 숫자 타입으로 변환 후 검사한다.

1
2
isNaN(10) // false
isNaN("ASD") // NaN

parseInt

전달 받은 문자열 인수를 정수로 해석해서 반환한다.

1
2
parseInt("10.23") // 10
parseInt("10") // 10

얘는 또 다른 능력이 있는데 10진수를 우리가 원하는 진수로 바꿔서 나오게 한다.

1
2
parseInt("10", 2) // 2
parseInt("10", 8) // 8

여기까지 알아보았다.
몇 가지 뺴먹은 내용들도 있는데
너무 쓸모없어 보여서 일단은 뺐다.

최소 주 1회는 공부하자.

This post is licensed under CC BY 4.0 by the author.

strict mode에 대해 알아보자

Apollo InmemoryCache에 대해 짧은 공부

Comments powered by Disqus.