1. Array 객체
07-01.html
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8" />
<title>07-01</title>
</head>
<body>
<script type="text/javascript">
// Array
var ary1 = ['홍길동', '이순신', '강감찬', '을지문덕', '광개토대왕'];
var ary2 = ['이나영', '임수정', '이영애', '김혜수'];
document.writeln(ary1.concat(ary2), '<br/>'); // 홍길동,이순신,강감찬,을지문덕,광개토대왕,이나영,임수정,이영애,김혜수
document.writeln(ary1.join('／'), '<br/>'); // 홍길동／이순신／강감찬／을지문덕／광개토대왕
document.writeln(ary1.slice(1), '<br/>'); // 이순신,강감찬,을지문덕,광개토대왕
document.writeln(ary1.slice(1, 2), '<br/>'); // 이순신
document.writeln(ary1.splice(1, 2, '계백', '김유신'), '<br/>'); // 이순신,강감찬
document.writeln(ary1, '<br/>'); // 홍길동,계백,김유신,을지문덕,광개토대왕
document.writeln('<br/>');
document.writeln(ary1.pop(), '<br/>'); // 광개토대왕
document.writeln(ary1, '<br/>'); // 홍길동,계백,김유신,을지문덕
document.writeln(ary1.push('권율'), '<br/>'); // 5
document.writeln(ary1, '<br/>'); // 홍길동,계백,김유신,을지문덕,권율
document.writeln(ary1.shift(), '<br/>'); // 홍길동
document.writeln(ary1, '<br/>'); // 계백,김유신,을지문덕,권율
document.writeln(ary1.unshift('세종대왕', '장영실'), '<br/>'); // 6
document.writeln(ary1, '<br/>'); // 세종대왕,장영실,계백,김유신,을지문덕,권율
document.writeln('<br/>');
document.writeln(ary1.reverse(), '<br/>'); // 권율,을지문덕,김유신,계백,장영실,세종대왕
document.writeln(ary1, '<br/>'); // 권율,을지문덕,김유신,계백,장영실,세종대왕
document.writeln(ary1.sort(), '<br/>'); // 계백,권율,김유신,세종대왕,을지문덕,장영실
document.writeln(ary1, '<br/>'); // 계백,권율,김유신,세종대왕,을지문덕,장영실
document.writeln('<br/>');
document.writeln(ary1.length, '<br/>'); // 6
document.writeln(ary1.toString(), '<br/>'); // 계백,권율,김유신,세종대왕,을지문덕,장영실
</script>
</body>
</html>
출력화면
2. String 객체
07-02.html
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8" />
<title>07-02</title>
</head>
<body>
<script type="text/javascript">
// String
var str1 = 'better tomorrow';
document.writeln(str1.indexOf('t'), '<br/>'); // 2
document.writeln(str1.lastIndexOf('t'), '<br/>'); // 7
document.writeln(str1.indexOf('t', 3), '<br/>'); // 3
document.writeln(str1.lastIndexOf('o', 3), '<br/>'); // -1 3번인덱스부터 역방향이므로
document.writeln(str1.indexOf('mo'), '<br/>'); // 9
document.writeln('<br/>');
var str2 = 'JavaScript';
document.writeln(str2.charAt(4), '<br/>'); // s
document.writeln(str2.slice(5, 8), '<br/>'); // cri
document.writeln(str2.substring(5, 8), '<br/>'); // cri
document.writeln(str2.substr(5, 3), '<br/>'); // cri
document.writeln(str2.split('S'), '<br/>'); // Java,cript
document.writeln('<br/>');
document.writeln(str2.concat('프로젝트'), '<br/>'); // JavaScript프로젝트
document.writeln(str2.length, '<br/>'); // 10
document.writeln('<br/>');
</script>
</body>
</html>
출력 화면
3. Number 객체
07-03.html
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8" />
<title>07-03</title>
</head>
<body>
<script type="text/javascript">
// Number
var num1 = 255;
document.writeln(num1.toString(16), '<br/>'); // ff
document.writeln(num1.toString(8), '<br/>'); // 377
document.writeln('<br/>');
var num2 = 123.45678;
document.writeln(num2.toExponential(2), '<br/>'); // 1.23e+2
document.writeln(num2.toFixed(3), '<br/>'); // 123.457
document.writeln(num2.toFixed(7), '<br/>'); // 123.4567800
document.writeln(num2.toPrecision(10), '<br/>'); // 123.4567800
document.writeln(num2.toPrecision(6), '<br/>'); // 123.457
document.writeln('<br/>');
</script>
</body>
</html>
출력화면
4. Math 객체
07-04.html
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8" />
<title>07-04</title>
</head>
<body>
<script type="text/javascript">
// Math
document.writeln(Math.abs(-15), '<br/>'); //15
document.writeln(Math.max(10, 15), '<br/>'); // 15
document.writeln(Math.min(-10, 0), '<br/>'); // -10
document.writeln(Math.pow(2, 3), '<br/>'); // 8
document.writeln(Math.random(), '<br/>'); // 0.7477149321894746
document.writeln('<br/>');
document.writeln(Math.ceil(1.58), '<br/>'); // 2
document.writeln(Math.floor(1.58), '<br/>'); // 1
document.writeln(Math.round(1.58), '<br/>'); // 2
document.writeln(Math.ceil(-1.58), '<br/>'); // -1
document.writeln(Math.floor(-1.58), '<br/>'); // -2
document.writeln(Math.round(-1.58), '<br/>'); // -2
document.writeln('<br/>');
document.writeln(Math.sqrt(3), '<br/>'); // 1.7320508075688772
document.writeln('<br/>');
document.writeln(Math.PI, '<br/>'); // 3.141592653589793
document.writeln('<br/>');
</script>
</body>
</html>
출력화면
5. Data 객체
첫 번째는 현재시간 두 번째는 문자열 이용 세 번째는 년월일시분초밀리세컨 순서
07-05.html
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8" />
<title>07-05</title>
</head>
<body>
<script type="text/javascript">
// Date
var dat = new Date(2012, 11, 10, 22, 10, 33, 500);
document.writeln(dat, '<br/>'); // Mon Dec 10 2012 22:10:33 GMT+0900
document.writeln(dat.getFullYear(), '<br/>'); // 2012
document.writeln(dat.getMonth(), '<br/>'); // 11
document.writeln(dat.getDate(), '<br/>'); // 10
document.writeln(dat.getDay(), '<br/>'); // 1
document.writeln(dat.getHours(), '<br/>'); // 22
document.writeln(dat.getMinutes(), '<br/>'); // 10
document.writeln(dat.getSeconds(), '<br/>'); // 33
document.writeln(dat.getMilliseconds(), '<br/>'); // 500
document.writeln(dat.getTime(), '<br/>'); // 1355145033500
document.writeln('<br/>');
var dat2 = new Date();
dat2.setFullYear(2012);
dat2.setMonth(11);
dat2.setDate(12);
dat2.setHours(14);
dat2.setMinutes(45);
dat2.setSeconds(30);
dat2.setMilliseconds(999);
document.writeln('<br/>');
document.writeln(dat2.toLocaleString(), '<br/>'); // 2012년 12월 12일 수요일 오후 2:45:30
document.writeln(dat2.toGMTString(), '<br/>'); // Wed, 12 Dec 2012 05:45:30 GMT
document.writeln(dat2.toUTCString(), '<br/>'); // Wed, 12 Dec 2012 05:45:30 GMT
document.writeln(dat2.toDateString(), '<br/>'); // Wed Dec 12 2012
document.writeln(dat2.toTimeString(), '<br/>'); // 14:45:30 GMT+0900
document.writeln(dat2.toLocaleDateString(), '<br/>'); // 2012년 12월 12일 수요일
document.writeln(dat2.toLocaleTimeString(), '<br/>'); // 오후 2:45:30
document.writeln('<br/>');
document.writeln(Date.parse('2012/12/08'), '<br/>'); // 1354892400000
document.writeln(Date.UTC(2012, 12, 30), '<br/>'); // 1359504000000
document.writeln('<br/>');
</script>
</body>
</html>
출력화면
6. JSON 객체
parse는 서버로 받을 때 stringify는 서버로 JSON을 보낼 때 사용함.
07-06.html
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8" />
<title>07-06</title>
</script>
</head>
<body>
<script type="text/javascript">
// JSON
var orderJSON = '{ "name" : "홍길동", "address" : "서울특별시 관악구 낙성대동", "orderItems" : [ {"item" : "멈추면, 비로소 보이는 것들", "price" : 15000, "qty" : 1 }, {"item" : "어떻게 원하는 것을 얻는가?", "price" : 18000, "qty" : 1 } ], "baroOn" : true }';
// JSON 문자열을 파싱하여 자바스크립트 객체로 변환합니다.
var order = JSON.parse(orderJSON);
document.writeln('order.name: ' + order.name + '<br/>');
document.writeln('order.address: ' + order.address + '<br/>');
document.writeln('<br/>');
for (var i = 0; i < order.orderItems.length; i++) {
for (var prop in order.orderItems[i]) {//인덱스가 문자열일때는 이렇게 for in 문을 써야됨
document.writeln(prop + ' : ' + order.orderItems[i][prop] + '<br/>');
}
document.writeln('<br/>');
}
document.writeln('order.baroOn: ' + order.baroOn + '<br/>');
document.writeln('<br/>');
</script>
</body>
</html>
출력화면
