14. 객체
2024. 11. 2. 14:57ㆍ자바스크립트(Javascript)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>객체</title>
</head>
<body>
<script>
//리터럴 표기법
const Rucy = {
name: '루시',
age : 14,
color : `white`,
birthday : `20091210`,
'weight' : 4.5,
['height'] : 0.8,
[`owner-name`] : '김사과',
getBirthday : function(){
return this.birthday
}
}
console.log(Rucy.name) // 루시
console.log(Rucy.age) // 14
console.log(Rucy.weight) // 4.5
console.log(Rucy.height) // 0.8
console.log(Rucy['owner-name']) // 김사과
console.log(Rucy.getBirthday()) // 20091210
console.log(Rucy.getBirthday)
// ƒ (){
// return this.birthday
// }
Rucy.family = '포메'
console.log(Rucy.family) // 포메
delete Rucy[`weight`]
console.log(Rucy)
// {name: '루시', age: 14, color: 'white', birthday: '20091210', height: 0.8, …}
console.log(Rucy[`weight`]) // undefined
//동적으로 프로퍼티에 접근하는 함수
function getValue(obj, key){
return obj[key]
}
console.log(getValue(Rucy, `age`)) // 14
//동적으로 프러퍼티를 추가하는 함수
function addKey(obj, key, value){
obj[key] = value
}
addKey(Rucy, `weight`, 4.2)
console.log(Rucy)
// {name: '루시', age: 14, color: 'white', birthday: '20091210', height: 0.8, …}
//동적으로 프러퍼티를 삭제하는 함수
function deletekey(obj, key){
delete obj[key]
}
deletekey(Rucy, `owner-name`)
console.log(Rucy)
// {name: '루시', age: 14, color: 'white', birthday: '20091210', height: 0.8, …}
console.log(`------------------`)
//생성자를 이용한 객체
function Dog(name, color){
this.name = name
this.color = color
this.eat = function(){
return `${this.name} 사료를 먹습니다.`
}
}
const PPomi = new Dog(`뽀미`, `흰색`)
const PPory = new Dog(`뽀리`, `흰색`)
console.log(PPomi.name) // 뽀미
console.log(PPory.name) // 뽀리
console.log(PPomi.eat()) // 뽀미 사료를 먹습니다.
console.log(PPory.eat()) // 뽀리 사료를 먹습니다.
</script>
</body>
</html>
728x90
LIST
'자바스크립트(Javascript)' 카테고리의 다른 글
16. 프로토타입 (10) | 2024.11.04 |
---|---|
15. 클래스 (3) | 2024.11.02 |
13. 화살표 함수 (0) | 2024.11.02 |
12. 함수 (0) | 2024.11.02 |
11. 배열과 반복문 (2) | 2024.11.02 |