자바스크립트 property 가지고 놀기

let my = {

  name: '심명섭',

  age: 345,

  height: 371,

  myNull: null,

  hobby: {

    title: '개발',

    lang: 'javascript'

  }

}

 

라는 object가 있다. 이 오브젝트 안에 속성값을 수정, 추가, 삭제가 가능할까 ? 

정답은 당연히 가능하다 이다. 아래 코드를 보자

 

// 수정
console.log(my.name); // 심명섭
my.name = '원빈';
console.log(my.name); // 원빈 

// 추가 / undefined이기 때문에 이건희 할당이 가능하다.
console.log(my.ceo); // undefined
my.ceo = '이건희';
console.log(my.ceo); // 이건희

// 삭제
console.log(my.age); // 345
delete my.age; // 삭제 - delete 연산자
console.log(my.age); // undefined

 

이후 my 전체를 출력한다면 ?

 

위와 같은 값이 나온다.

심명섭이 원빈으로 수정 되었고

ceo 이건희가 추가 되었고

345값을 가진 나이가 삭제되었다. 

 

그리고 속성값이 존재하는지 알아볼 때 사용하는 코드도 알아보자 !

property가 존재하는지 알아볼 때에 undefined를 활용하면 알 수 있다. 

 

 

console.log(my.name !== undefined); 라고 출력을 하게 된다면 ?

console에 찍히는 값은 true 이다. 왜냐 ? name 이 존재하니까 !

 

하지만 보통 undefined보다는 in연산자를 주로 활용한다. 

 

in연산자를 통해서 확인 / 사용 문법은 propertyName in object 이다. 리턴형은 bool형이다. 

 

console.log('name' in my); // name이 존재함으로 true 반환

console.log('weight' in my); // weight가 존재하지 않음으로 false 반환

 

 

in 연산자의 사용이유

 

undefined를 사용하여도 되지만 만약 개발자가 실수로 undefined를 값에 할당해 버리거나 다른 함수나 동작에 의해 value 값에 undefined가 할당이 되어버린다면(물론 일반적인 경우는 아니지만), undefined를 사용하면 반환값이 원하는 값이 아닐 수도 있다. 그래서 조금 더 안전하게 사용하고 깔끔한 코드를 위해 in 연산자를 활용한다.

그리고 반환값이 bool형태 임으로 if문에서 조건을 줄 때에도 많이 사용한다.