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: ⚾

//객체 생성 방법은 자바스크립트 생성자와 동일하다!