🍔2022-08-04🍔
ex7-01.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>객체 생성 및 활용</title>
</head>
<body>
<h3>객체 생성 및 활용</h3>
<hr>
<script>
// Date 객체 생성
let today = new Date();
// Date 객체의 toLocaleString() 메소드 호출
document.write("현재 시간 : " + today.toLocaleString() + "<br>");
// String 객체 생성
let mystr= new String("자바스크립트 공부하기");
document.write("mystr의 내용 : " + mystr + "<br>");
document.write("mystr의 길이 : " + mystr.length + "<br>");
// mystr.length=10; // 이 문장은 오류이다.
</script>
</body>
</html>
ex7-02.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>[]로 배열 만들기</title>
</head>
<body>
<h3>[]로 배열 만들기</h3>
<hr>
<script>
let plots = [20, 5, 8, 15, 20]; // 원소 5개의 배열 생성
document.write("var plots = [20, 5, 8, 15, 20]<br>");
for(let i=0; i<5; i++) { // 5 대신 plots.length로 해도 됨
let size = plots[i]; // plots 배열의 i번째 원소
while(size>0) {
document.write("*");
size--;
}
document.write(plots[i] + "<br>");
}
</script>
</body>
</html>
ex7-03.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Array 객체로 배열 만들기</title>
</head>
<body>
<h3>Array 객체로 배열 만들기</h3>
<hr>
<script>
let degrees = new Array(); // 빈 배열 생성
degrees[0] = 15.1;
degrees[1] = 15.4;
degrees[2] = 16.1;
degrees[3] = 17.5;
degrees[4] = 19.2;
degrees[5] = 21.4;
let sum = 0;
// for(let i=0; i<degrees.length; i++)
// sum += degrees[i];
for(let i of degrees){
sum += i;
}
document.write("평균 온도는 " + sum/degrees.length + "<br>");
</script>
</body>
</html>
ex7-04.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>[]로 배열 만들기</title>
</head>
<body>
<h3>[]로 배열 만들기</h3>
<hr>
<script>
let plots = [20, 5, 8, 15, 20]; // 원소 5개의 배열 생성
document.write("var plots = [20, 5, 8, 15, 20]<br>");
for(let i=0; i<5; i++) { // 5 대신 plots.length로 해도 됨
let size = plots[i]; // plots 배열의 i번째 원소
while(size>0) {
document.write("*");
size--;
}
document.write(plots[i] + "<br>");
}
</script>
</body>
</html>
ex7-07.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>String 객체의 메소드 활용</title>
</head>
<body>
<h3>String 객체의 메소드 활용</h3>
<hr>
<script>
let a = new String("Boys and Girls");
let b = "!!";
document.write("a : " + a + "<br>");
document.write("b : " + b + "<br><hr>");
document.write(a.charAt(0) + "<br>");
document.write(a.concat(b, "입니다") + "<br>");
document.write(a.indexOf("s") + "<br>");
document.write(a.indexOf("And") + "<br>");
document.write(a.slice(5, 8) + "<br>");
document.write(a.substr(5, 3) + "<br>");
document.write(a.toUpperCase() + "<br>");
document.write(a.replace("and", "or") + "<br>");
document.write(" kitae ".trim() + "<br><hr>");
let sub = a.split(" ");
document.write("a를 빈칸으로 분리<br>");
for(let i=0; i<sub.length; i++)
document.write("sub" + i + "=" + sub[i] + "<br>");
document.write("<hr>String 메소드를 실행 후 a와 b 변함 없음<br>");
document.write("a : " + a + "<br>");
document.write("b : " + b + "<br>");
</script>
</body>
</html>
ex7-10.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>리터럴 표기법으로 객체 만들기</title>
<script>
//사용자 객체 만들기
let account = {
// 프로퍼티 생성 및 초기화
owner : "황기태", // 계좌 주인
code : "111", // 계좌 코드
balance : 35000, // 잔액 프로퍼티
// 메소드 작성
inquiry : function () { return this.balance; }, // 잔금 조회
deposit : function(money) { this.balance += money; }, // 저금. money 만큼 저금
withdraw : function (money) { // 예금 인출, money는 인출하고자 하는 액수
// money가 balance보다 작다고 가정
this.balance -= money;
return money;
}
};
</script>
</head>
<body>
<h3>리터럴 표기법으로 사용자 객체 만들기</h3>
<hr>
<script>
document.write("account : ");
document.write(account.owner + ", ");
document.write(account.code + ", ");
document.write(account.balance + "<br>");
account.deposit(10000); // 10000원 저금
document.write("10000원 저금 후 잔액은 " + account.inquiry() + "<br>");
account.withdraw(5000); // 5000원 인출
document.write("5000원 인출 후 잔액은 " + account.inquiry() + "<br>");
</script>
</body>
</html>
ex7-11.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>프로토타입으로 객체 만들기</title>
<script>
// 프로토타입 만들기 : 생성자 함수 작성
function Account(owner, code, balance) {
// 프로퍼티 만들기
this.owner = owner; // 계좌 주인 프로퍼티 만들기
this.code = code; // 계좌 코드 프로퍼티 만들기
this.balance = balance; // 잔액 프로퍼티 만들기
// 메소드 만들기
this.inquiry = function () { return this.balance; }
this.deposit = function (money) { this.balance += money; }
this.withdraw = function (money) { // 예금 인출, money는 인출하는 액수
// money가 balance보다 작다고 가정
this.balance -= money;
return money;
}
}
</script>
</head>
<body>
<h3>Account 프로토타입 만들기</h3>
<hr>
<script>
// new 연산자 이용하여 계좌 객체 생성
let account = new Account("황기태", "111", 35000);
// 객체 활용
document.write("account : ");
document.write(account.owner + ", ");
document.write(account.code + ", ");
document.write(account.balance + "<br>");
account.deposit(10000); // 10000원 저금
document.write("10000원 저금 후 잔액은 " + account.inquiry() + "<br>");
account.withdraw(5000); // 5000원 인출
document.write("5000원 인출 후 잔액은 " + account.inquiry() + "<br>");
</script>
</body>
</html>
댓글