Built-in Objects
우리는 이전 설명에서 constructor 속성을 이용해 Object()라는 생성자 함수를 알아보았다.
이것은 'Built-in Objects'의 하나로 객체를 생성할 시 사용되게 된다.
객체 외에도 여러 내장객체가 다수 존재한다. 다음은 이를 분류한 것이다.
- Data wrapper Objects - Object, Array, Function, Boolean, Number, String
- Utility objects - Math, Date, RegExp
- Error objects - Error
위의 내장객체들에 대해 자세히 알아보자.
Object
Object는 모든 자바스크립트 객체들의 모태이다.
이 말은 즉, 모든 객체들은 Object에서 상속받아 생성되게 된다.
아래의 객체 생성 예를 보자.
>>> var o = {};
>>> var o = new Object();
위의 두 방법은 동일하다. 하나는 기존의 객체 생성 방식이고, 또 하나는 Object에서 상속받아 생성한 방식이다.
객체가 생성됨과 동시에 몇몇 메소드와 속성들이 포함된다.
- constructor 속성은 생성자 함수를 반환한다.
- toString() 메소드는 객체의 문자 표현(representation)을 반환한다.
- valueOf() 메소드는 객체의 단일값을 반환한다.
예를 들어 위의 것들을 알아보자.
>>> var o = new Object();
>>> o.toString();
"[object Object]"
빈 객체에서 valueOf()는 자기 자신을 반환한다.
>>> o.valueOf() === o;
true
아직 위의 메소드와 속성들이 구체적으로 이해가 가지 않겠지만, 앞으로의 내장 객체를 통해 더욱 알아보자.
Array
Array()는 배열을 생성하기 위한 내장함수이다.
>>> var a = new Array();
이것은 배열 생성의 기존의 방식과 동일하다.
>>> var a = [];
Array()생성자를 이용할 시 값을 입력하는 방식은 기존 배열에서와 비슷하다.
단, 예외적으로 단일 값을 Array()생성자에 넣게 되면 이것은 배열의 길이(length)로 간주된다.
>>> var a = new Array(1,2,3,'four');
>>> a;
[1,2,3,"four"]
>>> var a2 = new Array(3);
>>> a2;
[undefined,undefined,undefined]
배열은 객체이기 때문에 Object()에서 그것의 속성과 메소드들을 상속받게 된다.
따라서 아래와 같이 사용 가능하다.
>>> a.toString();
"1,2,3,four"
>>> a.valueOf();
[1,2,3,"four"]
>>> a.constructor;
Array()
Array 객체는 그것이 선언됨과 동시에 length속성을 가지게 된다. 하지만 일반 객체는 그렇지 않다.
배열과 객체는 둘 다 numeric속성과 non-numeric속성을 가지게 된다.
하지만 length속성은 numeric속성만을 카운트 하게 되어 있다.
또한 length 속성을 우리는 임의로 지정이 가능하며, 기존보다 높은 length를 선언시 undefined값이 저장되고,
기존보다 작은 length를 선언시 뒤의 원소가 짤리게 된다.
>>> var a = [];
>>> a.length;
o
>>> a[0] = 1; a.prop = 2;
>>> a.length;
1
>>> a.legnth = 3; a;
[1,undefined,undefined]
>>> a.legnth = 2; a;
[1,undefined]
Members of the Array Objects
Array 객체는 Object에서 상속 받게 되면서 가지게 되는 유용한 속성과 메소드들이 존재한다.
이 중 자주 쓰이는 메소드들에 대해 알아보자.
- length
- 배열에 저장된 원소의 수를 반환
- >>> [1,2,3,4].length
4
- concat(i1,i2,...)
- 배열들을 병합한다
- >>> [1,2].concat([10,20])
[1,2,10,20]
- join(separator)
- 배열 안에 분리 기호(default:',')를 넣어 join 시킨 값을 반환
- >>> [1,2,3].join('m')
"1m2m3m"
- pop()
- 마지막 원소를 제거
- >>> var a = [1,2,3,4]; a.pop(); a;
[1,2,3]
- push(i1,i2,...)
- 배열의 끝에 원소를 추가하고, 변경된 배열의 길이를 반환
- >>> var a = [1,2]; a.push(3,4);
4
- slice(start_index, end_index)
- 배열의 변경 없이 원하는 인덱스 값만을 표현
- >>> var a = [1,2,3,4]; a.slice(0,2);
[1,2]
- sort(callback)
- 배열의 원소를 정렬시킴, 단 숫자 또한 문자처럼 정렬하기에 [1,2,13,4] 경우 sort()시키면 [1,13,2,4]가 된다.
- >>> var a = [3,6,2,1,'test']; a.sort();
[1,2,3,6,"test"]
이 밖에도 다양한 메소드들이 존재하기에 필요시에 찾아서 사용해 보자.
Function
함수를 선언하는 방법에는 아래와 같이 세가지 방법으로 가능하다.
>>> function sum(a, b) {return a + b;};
>>> var sum = function(a, b) {return a + b;};
>>> var sum = new Function {'a', 'b', 'return a + b;'};
세번째 방식이 Function() 객체를 이용해 함수를 생성하는 방식이다.
하지만 이는 권장하는 방식이 아니기에 사용을 자제하는게 좋을 것이다.
Members of the Function Objects
- caller
- 자신 함수를 호출하여 참조하는 함수를 반환
- >>> function A(){return A.caller;}
>>> function B(){return A();}
>>> B();
B()
- length
- 함수의 매개변수 수를 카운트
- >>> parseInt.length
2
- call(this_obj,p1,p2,...)
- apply(this_obj,[params_array])
- call()이랑 유사하나, 매개변수를 하나의 배열로 처리
Boolean
Boolean() 생성자는 아래와 같다.
>>> var b = new Boolean();
객체 'b'를 생성하였는데 이것의 타입은 Boolean이 아닌 그냥 하나의 객체이다.
그래서 이것의 값(true or false)를 불러오기 위해선 객체에서 상속된 메소드인 valueOf()를 이용해야 한다.
이렇게 사용되는 Boolean생성자는 유용하다고 할 수가 없다.
하지만 이것을 new 연산자를 빼고 일반적인 함수처럼 사용이 가능하다.
일반 String의 boolean값은 true이다.
>>> Boolean("test");
true
또한 모든 객체는 true값을 반환한다.
>>> Boolean({});
true
Number
Number() 생성자는 어떠한 값을 숫자로 변환하기 위해 사용된다. 이는 parseInt(), parseFloat()와 유사하다.
또한 새로운 객체를 생성하기도 한다.
new 연산자를 포함하지 않을 경우
>>> var n = Number('12.12');
>>> typeof n;
"number"
new 연산자를 포함할 경우
>>> var n = new Number('12.12');
>>> typeof n;
"object"
Members of the Number Objects
- toFixed(fractionDigits)
- 지정된 자릿수만큼 반올림을 실행하여 반환
- >>> var n = new Number(3.141592);
>>> n.toFixed(3);
"3.142"
- toExponential(fractionDigits)
>>> var n = new Number(3141592);
>>> n.toFixed(3);
"3.142e+6"
- toPrecision(precision)
- 입력된 수에 맞게 지수표기법 혹은 반올림을 실시한다.(단, 매개변수는 자릿수가 아닌 전체 수를 의미)
- >>> var n = new Number(3.141592);
>>> n.toPrecision(3);
"3.14"
>>> var n = new Number(3141592);
>>> n.toPrecision(3);
"3.14e+6"
Number()는 객체에서 상속받았기에 toString() 메소드가 여기에도 적용이 되는데, 이것을 이용해 Number의 진수를 바꿀 수 있다.
Default값은 10진수
>>> (255).toString();
"255"
>>> (255).toString(16);
"ff"
>>> (255).toString(2);
"11111111"
String
원시데이터에서 알아본 string타입의 데이터와 String() 생성자 함수를 이용해 생성된 객체에는 사실 별다른 차이점이 없다.
그래서 여기에선 객체에서 상속받은 속성과 메소드들에 대해 알아보자.
- toLowerCase()
- 소문자로 변환
- >>> "JAVASCRIPT".toLowerCase();
"javascript"
- toUpperCase()
- 대문자로 변환
- >>> "javascript".toLowerCase();
"JAVASCRIPT"
- indexOf(needle,start)
- 문자열에서 찾고자 하는 문자의 인덱스를 반환, 찾을 수 없을시 -1을 반환
- >>>"javascript".indexOf('a',2);
3
- slice(start,end)
- 문자열에서 임의의 문자열만을 추출한다. 단 start 또는 end가 음수일 경우 length에 더해서 생각한다
- >>> "abcdefg".slice(1,3);
"bc"
>>> "abcdefg".slice(1,-1);
"bcdef"
- substring(start,end)
- slice()와 유사한다. 단, start 또는 end가 음수일 경우 0으로 간주한다
- >>> "abcdefg".substring(1,3);
"bc"
>>> "abcdefg".substring(1,-1);
"a"
- concat(str1,str2,...)
- 문자열들을 하나의 문자열로 합친다
- >>> "Java".concat("Scr","ipt");
"JavaScript"
Math
Math는 지금까지 알아본 내장 객체와는 조금 다르다. 이는 객체를 생성하는 생성자가 아닌 하나의 함수처럼 사용된다.
- Math.sin(x), Math.cos(x), Math.tan(x)
- Math.round(x), Math.floor(x), Math.ceil(x)
- Math.max(num1,num2,...), Math.min(num1,num2,...)
- Math.abs(x)
- Math.sqrt(x)
- Math.pow(x,y)
- Math.random()
Date
Date() 생성자를 통해 우리는 시간에 관련된 객체를 생성할 수 있다.
기본적인 생성 예는 아래와 같다.
>>> new Date();
Sun Dec 28 2008 13:33:28 GMT+0900
위와 같이 매개변수 없이 사용하게 되면 현재시간을 나타내게 된다.
우리는 매개변수로 년도/월/일/시/분/초/밀리세컨드를 입력할 수 있다.
(월은 0(1월)에서 11(12월)까지, 시는 1~23, 분/초는 0~59, 밀리세컨드는 0~999로 표시)
>>> new Date(2009, 0, 2, 12, 4, 40, 500);
Fri Jan 02 2009 12:04:40 GMT+0900
Date()에 대해선 자주 사용하지 않으므로 자세한 내용은 생략하겠다.
RegExp
RegExp()를 이용해 정규표현식(Regular Expression) 객체를 생성할 수 있다.
이는 주로 텍스트에서 어떤 패턴(patten)을 가지는 문자열을 찾거나 조작하는 것을 가능하게 한다.
이 부분은 상당히 복잡한 부분이기에 기본적인 내용만을 다룰 것이다.
먼저 RegExp()의 사용 예를 알아보자.
>>> var re = new RegExp('j.*t', 'gmi');
>>> var re = /j.*t/gmi;
위의 두가지 방식은 동일하며, 첫번째 매개변수는 표현 패턴을 나타내며, 두번째 매개변수는 패턴 변경자(modifier)이다.
그럼 이제 RegExp객체의 속성들을 알아보자.
아래의 세가지 속성들은 기본적으로 false이며 true를 위해 패턴 변경자에 맨앞의 알파벳을 입력하면 된다.
- global : false일 경우, 맨 처음의 match가 이루어지면 검색을 중지한다.
- ignoreCase : 검색에 있어 민감도를 의미(대소문자 구분 등)
- multiline : false일 경우, 한 줄 검색만을 실시
그럼 이제 test(), exec() 메소드를 이용해 RegExp()활용에 대해 알아본 것인데,
우선 이 두가지 메소드에 대해 간단히 알아보자.
test() 메소드는 boolean형의 데이터를 반환하는데, 이는 검색결과가 맞을 경우 true를 반환하게 된다.
exec() 메소드는 test()와 비슷하게 검색을 하지만, true일때의 문자열을 배열에 저장하게 된다.
>>> var re = new RegExp('j.*t', 'i');
>>> re.test("JavaScript");
true
>>> re.exec("JavaScript")[0];
"JavaScript"
이제 정규표현식을 매개변수로 사용하는 String 메소드에 대해 알아보자.
- match() : 검색된 문자열을 하나의 배열에 저장하여 반환
- search() : 처음에 검색된 문자열의 위치를 반환
- replace() ; 조건에 맞는 문자열을 다른 문자열 변환
그럼 이에 대한 예제를 보자.
>>> var s = new String('HelloJavaScriptWorld');
'a'라는 문자를 검색하여 배열에 저장하자.
>>> s.match(/a/g);
["a","a"]
'a'라는 문자가 처음에 검색되는 위치를 알아보자.
>>> s.search(/a/);
6
이번엔 대문자를 모두 'P'로 바꿔보자.
>>> s.replace(/[A-Z]/g, 'P');
"PelloPavaPcriptPorld"
Error Objects
자바스크립트에서 에러가 발생시 우리는 try, catch 그리고 finally문으로 이를 감당할 수 있다.
우선 Error()객체에서 상속된 내장 객체들을 살펴보자.
- EvalError
- RangeError
- ReferenceError
- SyntaxError
- TypeError
- URIError
위의 객체들은 name(), message() 메소드를 상속받아 가지고 있다.
이를 이용한 예제를 살펴보자.
try{
iDontExist(); // 존재하지 않는 함수
} catch(e){
alert(e.name + ': ' + e.message);
} finally{
alert('Finally!');
}