(Javascript) 자바스크립트 심화 (9) 표준내장객체

안녕하세요~ 영감을 주는 개발자 방민방민입니다.

오늘은 자바스크립트에서 지원하는 표준 내장 객체에 대하여 알아보고자 합니다.

자바스크립트는 표준으로 내장된 객체를 제공합니다. 

이러한 다양한 객체를 사용하면 프로그램의 작성을 더욱 효과적으로 할 수 있습니다.

자바스크립트는 아래의 표준 내장 객체를 제공합니다.

1. Object
2. Function
3. Array
4. String
5. Boolean
6. Number
7. Math
8. Date
9. RegExp

내장객체가 가지고 있는 기능을 그대로 사용할 수도 있지만, 앞에서 배운것 처럼, Prototype 기능을 활용하여 적절하게 확장하며 사용할 수 있습니다. 

표준 내장 객체의 활용과 확장, 지금 바로 시작하도록 하겠습니다!

1. 배열의 확장

배열에 저장된 도시들 중에 임의의 도시를 뽑고 싶습니다. 이럴때는 어떻게 해야 할까요? 아래의 코드를 살펴 보도록 하겠습니다.

var arr = new Array('Seoul', 'New York', 'Pusan', 'Tokyo','Tsukuba');

function getRandom(arr){
	var index = Math.floor(arr.length*Math.random());//랜덤한 인덱스 설정
	return arr[index];
}
alert(getRandom(arr));

위의 예제에서는 자바스크립트가 제공하는 Array, Math 등의 표준 내장 객체를 활용하였습니다.

그리고 서울부터 츠쿠바 까지 의 도시들 중에 랜덤한 도시를 알람하게됩니다. 이를 조금 변경해 보도록 하겠습니다.

Array.prototype.random = function(){
	var index = Math.floor(this.length * Math.random());//this 는 array 객체 자신
	return this[index];//this 는 array 객체 자신
	}

var arr = new Array('Seoul', 'New York', 'Pusan', 'Tokyo','Tsukuba');
alert(arr.random());

기존에 function getRandom 을 만들고, arr 이라는 배열을 넣어 랜덤한 도시명을 가져오는 것에서, Array 자체에 prototype 에 접근하여 random 함수를 추가하고, arr 객체 자체에서 해당 내용을 수행하도록 구현하였습니다 

이처럼 javaScript 가 제공하는 표준 내장 객체 또한 앞에서 배운것처럼 prototype 명령어를 통해 그 기능의 확장이 가능합니다.

2. Object();

Object 는 기본 객체입니다. 가장 기본적인 형태의 객체이며, 자바스크립트에서 생성되는 모든 객체는 기본적으로 Object 를 상속받습니다. 그렇기 때문에 Object 가 가지고 있는 모든 프로퍼티와 메서드를 가지고 있을 것입니다.

오브젝트는 정말 많은 프로퍼티와 메서드를 가지고 있습니다. 그렇기 때문에 모든 것들을 외울필요는 없으며 이를 찾아서 확인하고 사용할 필요가 있습니다. 아래의 사이트 링크를 참조합니다.

링크

이처럼 오브젝트와 관련된 많은 프로퍼티들과 메서드에 대한 활용을 확인 할 수 있습니다.

이에 대한 내용은 방대하기 때문에 이후에 기회가 된다면 순차적으로 다루도록 하겠습니다.

3. Object의 확장

앞선 배열의 기능을 확장하였던 것 처럼, Object 가 가진 프로토 타입 또한 확장이 가능합니다.

아래의 코드를 먼저 확인해 보도록 하겠습니다.

var o = {'name':'Bangmin', 'city':'Seoul'}
console.log(o.contain('Bangmin'));

var a = ['Bangmin','Minseok','BangminBangmin'];
console.log(a.contain('Minseok'));

객체로 선언된 o 와 배열로 선언된 a 가 있습니다. 여기에서 배열도 객체라는 사실을 명심해 두시기 바랍니다.

우리는 contain 이라는 메서드를 통해 객체 내부에 그 값이 있는지를 확인하고, 있다면 true, 없다면 false 를 출력하고 싶습니다.

그러나 , contain 이라는 메서드는 Object 내부에 정의된 메서드가 아닙니다. 그렇기 때문에 지금부터 Object 를 확장하여 contain 이라는 메서드를 만들어주어야 합니다.

Object.prototype.contain = function(value){//contain 메서드 생성
	for(var name in this){//해당 객체를 돔
		if(this[name]===value){
			return true;
		}
	}
	return false;
}
var o = {'name':'Bangmin', 'city':'Seoul'}
console.log(o.contain('Bangmin'));

var a = ['Bangmin','Minseok','BangminBangmin'];
console.log(a.contain('Minseok'));

앞에서와 마찬가지로 Object.prototype 를 통해서 새로운 function 인 contain 을 생성해 주었습니다. 그리고 그 객체 내부를 돌며 입력된 value 값이 있는지를 확인하였습니다.

그러면 콘솔에서 true 를 출력하는 것을 확인할 수 있습니다.

이렇게 오브젝트 또한 확장이 가능하긴하지만, 이는 모든객체에 영향을 주기 때문에 그 확장에 대하여 정말 신중하게 결정해야하며 이는 개발자에게 혼란이 될수 있기 때문에 가급적 확장하지 않는 것이 좋습니다.

오늘은 정말 간단하게 표준 내장객체의 활용과 그 확장에 대하여 알아보았습니다

지금까지 영감을 주는 개발자 방민방민이었습니다!