12) 자바스크립트 X ES -3 (표준 내장객체)

0. Intro

리액트 문법을 중 class를 이해하기 위한 포스팅

자바스크립트 X 리액트

1. 객체

모든 객체는 자신의 prototype으로부터 constructor 속성을 상속받는다.

즉, 모든 객체는 생성자 함수로 비롯되었으며 우리가 일반적으로 쓰는 문법들은 축약형임.

// 🍎 객체
var obj = {}
var obj2 = new Object()

obj.constructor === obj2.constructor
// true
obj.constructor === Object
// true

// 🍎 배열
var arr = []
var arr2 = new Array()

arr.constructor === arr2.constructor
// true
arr.constructor === Array
// true

// 🍌 심지어 원시타입까지
var n = 3
var n2 = new Number(6)
n.constructor === n2.constructor
// true
n.constructor === Number
// true

💡 💡 💡 변수 n 은 원시타입을 참조하는 객체(생성자는 Number)이다. 3 자체는 원시타입이며 객체가 아니며, 불변하는 데이터다!!

자바스크립트 X ES - 1>variable

// 인스턴스 객체
var a = new Number(3) // a === 3은 false
a instanceof Number // true
console.log(a) // Number {3}

// 원시타입 데이터
var b = Number(6) // b === 6은 true
b instanceof Number // false
console.log(b) // 6

new : Number 생성자로 생성된 Number {3} 객체는 원시타입 데이터 3을 참조한다.

not new : 원시타입을 Number() 함수를 사용해 생성하거나, 형변환.

2. 함수를 정의하는 3가지 방법

2-1. 함수 선언문

function a() {}

basic

2-2. 함수 표현식

const a = function() {}
const b = function b() {}

익명함수를 a 변수에 바로 초기화해서 사용가능.

물론 이름 붙이는 것도 가능

2-3. Function 생성자 함수

const square = new Function()

함수도 하나의 객체라는 사실 명심 또명심!

3. 생성자 함수

객체랑 생성자 함수 확실히 구분짓기!! 생성자함수로 만들어지는 것이 객체! 생성자함수로 만들어진 함수도 객체..!!

💡 💡 💡 원시타입 데이터도 이 생성자함수로 만들어진다~~~!!!

var types = [
  new Array(),
  [],
  new Boolean(),
  true, // 바뀌지 않음
  new Date(),
  new Error(),
  // ⭐
  new Function(),
  function() {},
  Math,
  new Number(),
  1, // 바뀌지 않음
  new Object(),
  {},
  new RegExp(),
  /(?:)/,
  new String(),
  'test', // 바뀌지 않음
]

출처

🐥 생성자 함수 공부

MDN문서


Written by@taenyKim
웹 프론트엔드 공부 블로그 / Learn in Public

GitHubFacebook