JavaScript
object
jineric
2022. 11. 12. 22:52
//dog 객체
let dog{
name:'루시',
age:13,
'dog-weight':3.5, //특수문자를 사용할 때 ' '필요(-, . , ~등등...)
['dog-height]:0.8 // 속성접근
}
console.log(dog.name); //'루시',
console.log(dog['age']); // 13,
dog.family = '포메'; //필드 추가하기! dog객체,family키, 포메 값!
console.log(dog.family); //포메
console.log(dog['family']); //포메
delete dog['dog-height']; //dog 객체, dog-height 키를 삭제!
console.log(dog['dog-height']); // 삭제되고 출력할 때 undefined 가 나옴!
//동적으로 속성에 접근하고 싶을 때
function getValue(obj, key){
return obj[key];
}
console.log(getValue(dog, 'name')); //obj ->dog, key-> name dog 객체의 name을 출력하기!
//필드를 추가하고 싶을 때 addKey 사용
// obj, 필드명, 값
function addKey(obj, key, value){
obj[key] = value;
}
//필드를 삭제하고 싶을 때 deleteKey 사용
//obj, key
function deleteKey(obj, key){
delete obj[key];
}
예제
addKey(dog, 'dog-height',0.7); //객체dog 에 키dog-height 에 0.7 추가!
console.log(dog); //출력
deleteKey(dog, 'dog-height'); //객체 dog의 key 'dog-height'삭제 //자동으로 값 0.7삭제
console.log(dog);
add key
{
name: '루시',
age: 13,
'dog-weight': 3.5,
family: '포메',
'dog-height': 0.7
}
deleteKey
{ name: '루시', age: 13, 'dog-weight': 3.5, family: '포메' }
//객체 생성 함수
function makeObj(name, age){
return{
name, age
};
}
console.log(makeObj('apple', 20));
{ name: 'apple', age: 20 }
생성자
const apple = { //객체
name:'apple',
display: function(){
console.log(`${this.name}:⚽`);
}
}
const orange = { //객체
name: 'orange',
display: function(){
console.log(`${this.name}:⚾`);
}
}
console.log(apple);
apple.display();
console.log(orange);
orange.display();
{ name: 'apple', display: [Function: display] }
apple:⚽
{ name: 'orange', display: [Function: display] }
orange:⚾
//생성자 함수
function Fruit(name,emoji){
this.name = name;
this.emoji = emoji;
this.display = () => {
console.log(`${this.name}: ${this.emoji}`);
}
//return this; //생략가능
}
const apple2 = new Fruit('apple','⚽'); //객체 이면서 인스턴스
const orange2 = new Fruit('apple','⚾');//객체 이면서 인스턴스
console.log(apple2);
apple2.display();
console.log(orange2);
orange2.display();
Fruit { name: 'apple', emoji: '⚽', display: [Function (anonymous)] }
apple: ⚽
Fruit { name: 'apple', emoji: '⚾', display: [Function (anonymous)] }
apple: ⚾
//객체 생성 방법은 자바스크립트 생성자와 동일하다!