javascript18

표준 내장 객채의 확장

<표준 내장 객체>

 

표준 내장 객체(Standard Built-in Object)는 자바스크립트가 기본적으로 가지고 있는 객체(자바스크립트가 우리(개발자)에게 기본적으로 제공하는 객체)

· Object

· Function ·

· Array

· String

· Boolean
· Number

· Math

· Date

· RegExp

자바스크립트가 기본적으로 제공히는 언어는 이것 뿐이지만 javascript 호스트환경의 언어는 이것보다 많다.

위의 빌트인 되어있는 객체들이 가지고있는 메소드들이 있는데 그 중에는  우리가 필요한 기능이 없을수도 있다.

그러면 우리가 객체를 만들고 그 객체에 함수나 프로퍼티 같은 것들을 정리해서 우리가 사용할 수도 있을것

그렇게 사용하는 것이 '사용자 정의 객체'

즉, '사용자 정의 객체'란 사용자가 직접 정의해서 사용하는 객체로 표준 내장 객체와 대비되는 개념

'표준 내장 객체'란 자바스크립트나 호스트환경이 자바스크립트 개발자에게 제공하는 미리 만들어진 객체인 것이고, 

그리고 그러한 객체들을 조합해서 우리가 만드는 객체는 '사용자 정의 객체'가 되는 것

우리가 만들수도 있고(사용자 정의 객체) 자바스크립트가 제공하는 내장 객체도(표준 내장 객체) 쓸 수 있지만 이 두가지를 카이브리드(두 가지 대립 유전자를 동시에 지닌 경우를 가리키는 생물학 용어)한 형태가 있을수도 있다.

즉. 자바스크립트가 제공한 내장 객체에(표준 내장 객체) 우리가 필요에 따라서 어떠한 메소드를 추가할 수도 있다.

 

<배열의 확장>

 

arr중 랜덤 값 출력

var arr = new Array('seoul', 'new york', 'ladarkh', 'pusan', 'Tsukuba');
function getRandomValueFromArray(arr){
// return 값으로 arr을 주기 때문에 ()안에 arr을 적는다
	var index = Math.floor(arr.length*Math.random());
// Math.random() : 0~1사이에 있는 랜덤한 값(소수) 출력(0, 0.1, 0.2 등)
// Math.random()에 어떠한 값을 곱하면 그 값을 최대값으로 하고 0을 최소값으로 하는 어떠한 값이 출력
// var index = Math.random() : index값 중 랜덤한 숫자 출력
// arr.length : arr에 담겨있는 값의 수
// 하지만 arr.length*Math.random()를 하게 되면 곱해진 값이 소수이기 때문에 소수가 출력
// Math.floor() : 소수를 정수로 변환(뒤에 있는값 제거 0.1->0, 0.9->0, 1.1->1), floor : 내림
	return arr[index];
// 랜덤하게 획득한 arr의 index값 출력
}
console.log(getRandomValueFromArray(arr));
// arr의 index 값 중 랜덤한 값 출력

 

arr에 랜덤 값 추가

Array라는 생성자를 확장해서 모든 배열이 그 배열이 가지고 있는 값 중 어떤 특정 값을 랜덤하게 획득할 수 있는 기능을 모든 배열의 객체가 가질수 있는 코드

var arr = new Array('seoul', 'new york', 'ladarkh', 'pusan', 'Tsukuba');
function getRandomValueFromArray(arr){
	var index = Math.floor(arr.length*Math.random());
	return arr[index];
}
console.log(getRandomValueFromArray(arr));

Array.prototype.random = function(){
// prototype을 추가하는걸 통해서 Array(배열)생성자를 통해서 만들어진 객체가 random이라는 메소드를 가지고 있는데
// random이라는 메소드안에서 this(arr.length)는 그 배열 객체 자체를 가르킨다.
// 바로 new Array('seoul', 'new york', 'ladarkh', 'pusan', 'Tsukuba');를 통해서 만든 배열 객체가 바로 this가 되는 것
	var index = Math.floor(this.length*Math.random());
// 즉, "arr".length라고 할 필요없이 "this".length라고 하면 이 this가 가르키는 것은 arr가 된다.
	return this[index];
}
var arr = new Array('seoul', 'new york', 'ladarkh', 'pusan', 'Tsukuba');
console.log(arr.random());
// arr의 index 값 중 랜덤한 값 출력
// random이라는 메소드가 Array에 소속되어 있다는걸 쉽게 알 수 있는 코드가 된다.(가독성 상승)
// random이라는 메소드는 인자를 받지 않는데(random = function()) 인자를 받지않는다는건 사용자가 신경써야 하는게 적다는것
// 대신 (console.log(arr.random());)arr이라는 배열 객체에 .random을 하게 되면 random이라는 메소드가 내부적으로 this에 접근을 해서
// index값을 랜던하게 만들고 그것을 this[index];에 대입하는 걸 통해서 값을 랜덤하게 가지고 올 수 있는것
// 이렇게 프로토타입을 확장하는 걸 통해서 모든 배열이 공통적으로 가지고 있어야 하는 ApI를 사용자가 직접 정의할 수 있다는 것은 상당히 강력하고 멋진일
// 위의 주석처리된 코드를 아래 코드와 같이 표준 내장 객체를 프로토타입을 이용하여 확장하는 방법이 있다.