[생활코딩] JS문법(객체지향)- 표준 내장 객체의 확장

표준 내장 객체란? 

• Standard Built-in Object 라고 하며 자바스크립트가 기본적으로 가지고 있는 객체들을 의미한다.
• JavaScript 언어 자체가 제공하는 객체는 아래에 나와있는 것이 전부이다.  = 자바스크립트의 코어엔진이 제공하는 API 
  
  • Object
  • Function(JS에서는 함수도 객체입니다.)
  • Array
  • String
  • Boolean
  • Number
  • Math
  • Date
  • RegExp(정규표현식)
• 언어 자체에서 제공하는 객체는 적은 편이지만 호스트환경에 따라 제공하는 API는 더 많을 수 있습니다. 즉, 기본 내장 코어엔진이 제공하는 API + 호스트환경이 제공하는 API 이용하여 소프트웨어를 만들게 되는 것이죠. 
• 표준 내장 객체와 호스트환경이 제공하는 API는 JS개발자에게 기본적으로 제공되는 미리 만들어진 객체인 것이며 사용자 정의 객체(개발자가 원하는 용도에 따라 직접 만든 객체)와 반대되는 개념입니다. 
• 또한, 내장 객체를 활용하여 내가 원하는 기능을 추가해서 내장 객체와 사용자 정의 객체를 하이브리드한 형식으로 만들 수도 있습니다. 아래에서 그 예시를 다뤄보도록 합시다.

배열을 확장

//array 에 랜덤하게 특정한 값을 추출하는 코드를 만들어보자
      const arr = new Array("seoul", "new york", "ladarkh", "pusan", "Tsukuba");
      function getRandomValueFromArr(arr) {
        let index = Math.floor(arr.length * Math.random());
        return arr[index];
      }
      console.log(getRandomValueFromArr(arr));

-> 이 코드를 좀 더 다듬어서 세련된 코드를 만들어보자. 그 방법은 해당 함수를 배열 객체에 포함시키는 것이다. 

//array 에 랜덤하게 특정한 값을 추출하는 코드를 만들어보자
      /*const arr = new Array("seoul", "new york", "ladarkh", "pusan", "Tsukuba");
      function getRandomValueFromArr(arr) {
        let index = Math.floor(arr.length * Math.random());
        return arr[index];
      }
      console.log(getRandomValueFromArr(arr));
      */

      Array.prototype.random = function () {
        let index = Math.floor(this.length * Math.random());
        return this[index];
      };
      const arr = new Array("seoul", "new york", "ladarkh", "pusan", "Tsukuba");

      document.write(arr.random());

• 배열객체의 원형(prototype내부에 생성되는 객체)에 random이라는 메소드를 추가
• random메소드는 위의 코드에서는 getRandomValueFromArr()이다. Array 객체에 소속되면서 메소드명을 길게하지 않아도 그 의미가 명확해진다. 그렇기 때문에 굳이 길게 이름을 지을 필요없다.
• this는 Array 생성자로 만들어진 객체를 의미하기 때문에 위에서 arr라고 arg명을 적은 부분을 this로 대체했다.
• 또한 random메소드는 위 코드와 다르게 인자를 받지 않고있습니다. ->사용자가 신경써야 할 부분이 적다는 의미
• 결론: 프로토타입(prototype)을 활용하여 내장객체를 확장할 수 있다.

객체를 생성하는 두 가지 방법 

1) const obj = new 생성자 함수이름();

• 괄호()를 쓴 경우는, 생성자 함수를 호출해서 (배열)객체를 생성한 경우입니다. 
• e.g.) const arr = new Array('Seoul', 'new york'); // 배열 객체의 생성자함수를 호출하여 배열객체를 생성한 것

2) const obj  = 리터럴 값 표현;

• 대괄호[]를 쓴 경우, 배열의 리터럴값을 표현하는 것
• e.g.) const arr = ['Seoul' , 'new york'];// 배열의 리터럴 값을 명시하여 (배열)객체를 생성했다.
• *리터럴 값? 변수도 아니고 함수도 아닌 실제 객체에 저장될 데이터 값 그 자체를 의미합니다. 
• e.g.) const b = "string"; 이라면 string이 리터럴 값입니다.

즉 생성자 함수에 []대괄호를 사용하게 되면 문법에러입니다. 

참고로, 사용자 정의 함수(객체)의 경우, 2번의 리터럴 값으로 표현을 사용하여 객체를 생성할 경우는 {}중괄호를 씁니다.