피리부는 사나이 (pied piper)

[자바스크립트] 객체안에 프로퍼티 유무 확인법 본문

Java Script

[자바스크립트] 객체안에 프로퍼티 유무 확인법

코더 451 2022. 1. 11. 22:23

✍🏻객체안에 프로퍼티가 존재하는지 확인하는 방법 두 가지

첫 번째 방법 (undefined)

let user = {}; // 빈 객체 선언 e
console.log (user.noSuchProperty === undefiend); 

  user라는 객체안에 .noSuchProperty라는 프로퍼티를 붙이는 것은 user라는 객체안에 있는 .뒤에 프로퍼티를 호출하는 것

그 프로퍼티를 선택했는데 === undefiend와 비교됐을때 ‘true’가 뜬다는 이야기는 이 프로퍼티안에 어느 것도 정의되지 않았다는 이야기.

즉 undefined와 비교했는데 true가 뜬다는 이야기는 = 프로퍼티 없음

 

⚠️두 번째 방법 (in 연산자)

 // 기본문법 "key" in object 

let user = { name: "John", age: 30};

alert("age"in user); // 있으니 true 
alert("blabla" in user); // 없으니 false 

  여기서 유의사항은

내가 여기서 유의해야할 점

정확히 말하면 문법은 "Key" in object

"" 이 큰 따옴표를 잊으면 안된다. 이게 정말 문제였다는 것이다.

+굳이 in 연산자를 쓰는 이유 : 값으로 undefined를 갖는 프러퍼티가 있으면 혼란스럽기 때문

 

for.. in 반복문

객체의 모든 키를 순회할 수 있음 (for 반복문과 다르다)

// 기본문법 for (key in object) {
		 각 프로퍼티 키를 이용해서 본문을 실행한다.
}

let Person = {
	name: "Chi",
	age: 28,
	isKorean: true;
} 

//반복문 실행의 두 가지 

for (let key in Person) }

console.log(key); // 키 (name, age, isKorean) 호출
console.log(Person[key]; // Chi, 28, true 해당 키에 값 호출

객체 비어있는지 확인하기 (문제)

 

 💡 Q : 객체에 프로퍼티가 하나도 없는 경우 true, 그렇지 않은 경우 false를 반환해주는 함수 isEmpty(obj)를 만들어라 

 

아래와 같이 동작해야 한다 

let schedule = {};

alert( isEmpty(schedule) ); // true

schedule["8:30"] = "get up";

alert( isEmpty(schedule) ); // false
  • 정답
    function isEmpty(obj) {
      for (let key in obj) { //오브젝트내 모든 프로퍼티 출력
    
        // if the loop has started, there is a property
        return false;
      }
      return true;
    }
    
    .

프로퍼티 합계 구하기 문제

 

 💡 모든 팀원의 월급에 대한 정보를 담고 있는 객체가 있다고 해봅시다. 모든 팀원의 월급을 합한 값을 구하고, 그 값을 변수 sum에 저장해주는 코드를 작성해라

let salaries = {
  John: 100,
  Ann: 160,
  Pete: 130
}

(참고) 더하기 할당 (+=) : 오른쪽 피연산자의 값을 변수에 더한 결과를 다시 변수에 할당 

더하기 할당을 사용하는 좋은 예시 코드니 여기서 이 연산자가 어떻게 쓰이는지 확인하기

  • 정답프로퍼티 값 두 배로 불리기<aside> 💡 이 문제에는 typeof : 자료형을 반환하는 연산자를 포함한다.
    let menu = { 
    width: 200, 
    height: 300,
    title: "my menu"
    };
    
    function multiplyNumberic(menu) {
    for let key in menu) {
    if typeof menu[key] == 'number') {
    			menu[key] *= 2; 
    		} 
    	};
    };
    
    console.log(multiplyNumberic(menu));
    console.log(menu);
    
    //{width: 400, height: 600, title: 'My menu'}height: 600title: "My menu"width: 400[[Prototype]]: Object
    
     let sum = 0; for (let key in salaries) { sum += salaries[key]; }
  • key에 해당하는 것들이 //+= 연산자를 통해 연산을 계속해감
  • 최종적으로 sum은 390이라는 값을 가짐

'Java Script' 카테고리의 다른 글

[JS] 함수 표현식 VS 함수 선언식  (0) 2022.02.17
[JS] 배열과 객체의 차이  (0) 2022.02.16
[JS] 콜백 함수  (0) 2022.02.16
메서드와 This  (0) 2022.02.15
지역변수와 전역변수  (0) 2022.01.06
Comments