[JAVASCRIPT-모던자바스크립트] 객체 기본에 대해서 알아보자3

undefined와 비교하는 것 이외에도 in을 사용하게 되면 프러퍼티 존재 여부를 확인할 수 있다.

"Key" in object

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

alert("age" in user); // user.age가 존재하므로 true가 출력
alert("blabla" in user); // user.blabla는 존재하지 않기 때문에 false가 출력

in 왼쪽에 반드시 프로퍼티 이름이 와야한다. 프로퍼티 이름은 보통 따옴표로 감싼 문자열이다. 따옴표를 생략하면 엉뚱한 변수가 조사 대상이 된다.

let user = { age: 30 };

let key = "age";
alert( key in user ); // true, 변수 key에 저장된 값 ("age")을 사용해 프로퍼티 존재 여부를 파악한다.

• undefined랑 비교해도 충분하다고 생각할 수 있지만 in 연산자가 있는거지라는 의문이 생긴다. 
• 일치 연산자를 사용하여 프로퍼티 존재 여부를 알아내는 방법("=== undefined")은 잘 동작하지만 이 방법이 실패할 수도 있다. 이럴때 in을 사용하게 되면 프로퍼티 존재 여부를 제대로 판별할 수 있다.

let obj = {
	test: undefined
};

alert( obj.test ); // 값이 `undefined`이므로 얼럭 창에는 undefined가 출력되지만 프로퍼티 test는 존재한다.
alert( "test" in obj ); // `in`을 사용하면 프로퍼티 유무를 제대로 확인할 수 있다. (true가 출력)

obj.test는 실제로 존재하는 프로퍼티이며 in 연산자는 정상적으로 true를 반환합니다.

• undefined는 변수는 정의되어 있지만 값이 할당되어 있지 않은 경우에 쓰기 때문에 프로퍼티 값이 undefined인 경우는 흔치 않습니다. 
• 값을 `알 수 없거나 (unknown)` 값이 `비어 있다는(empty)`것을 나타낼 때는 주로 null을 사용합니다.

'for...in' 반복문

for...in 반복문을 사용하면 객체의 모든 키를 순회할 수 있습니다. for...in은 앞서 학습했던 for(;;)반복문과는 완전히 다르다.

for (key in object) {
	// 각 프로퍼티 키(key)를 이용하여 본문(body)을 실행합니다.
}

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

for (let key in user) {
    // 키
    alert( key ); // name , age, isAdmin
    // 키에 해당되는 값
    alert( user[key] ); // John, 30, true
}

for...in 반복문에서도 for(;;)문처럼 반복 변수 (looping variable)를 선언( let key )했다는 점을 확인 반복 변수명은 자유롭게 정할 수 있다. 'for (let prop in obj)' 같이  key 말고 다른 변수명을 사용해도 된다.

객체 정렬 방식

객체와 프로퍼티를 다루게 되면 프로퍼티 순서에 대해서 궁금해지게 된다.

객체는 '특별한 방식으로 정렬'된다. 정수 프로퍼티(integer property)는 자동으로 정렬되고 그 외의 프로퍼티는 객체에 추가한 순서 그대로 정렬된다.

let codes = {
    "49": "독일",
    "41": "스위스",
    // ...,
    "1": "미국"
};

for (let code in codes) {
	alert(code); // 1,41,44,49
}

개발 중인 애플리케이션의 주 사용자가 독일인이라고 가정하면 나라 번호를 선택하는 화면에서 49가 맨 앞에 오도록 하는게 좋다.

코드를 실제 실행시 다른 결과가 출력되는 것을 확인할 수 있다.

• 미국(1)이 첫번째로 출력
• 그 뒤로 스위스(41), 영국(44),독일(49)이 차례대로 출력

이유는 나라 번호 (키)가 정수여서 1,41,44,49순으로 프로퍼티가 자동 정렬되었기 때문이다.

정수 프로퍼티가 무엇일까요?

'정수 프로퍼티'라는 용어는 변형 없이 정수에서 왔다 갔다 할 수 있는 문자열을 의미한다.

• 문자열 "49"는 정수로 변환하거나 변환된 정수를 다시 문자열로 바꿔도 변형이 없기 때문에 정수 프로퍼티입니다.
• 하지만 '+49'와 '1.2'는 정수 프로퍼티가 아니다.

// 함수 Math.trunc는 소수점 아래를 버리고 숫자의 정수부만 반환된다.
alert( String(Math.trunc(Number("49")))); // '49'가 출력된다. 기존에 입력한 값과 같으므로 정수 프로퍼티이다.
alert( String(Math.trunc(Number("+49")))); // '49'가 출력된다. 기존에 입력한 값(+49)와 다르므로 정수 프로퍼티가 아니다.
alert( String(Math.trunc(Number("1.2")))); // '1'이 출력된다. 기존에 입력한 값(1.2)과 다르므로 정수 프로퍼티가 아니다.

한편 키가 정수가 아닌 경우에는 작성된 순서대로 프로퍼티가 나열된다고 볼 수 있다.

let user = {
    name : "John",
    surname : "Smith"
};
user.age = 25; // 프로퍼티를 하나 추가합니다.

// 정수 프로퍼티가 아닌 프로퍼티는 추가된 순서대로 나열됩니다.
for (let prop in user) {
	alert( prop ); // name , surname, age
}

위 예시에서 49(독일 나라 번호)를 가장 위에 출력되도록 하려면 나라 번호가 정수로 취급되지 않도록 속임수를 쓰면 된다. 각 나라 번호 앞에 "+"를 붙여야 한다.

let codes = {
    '+49': '독일',
    '+41': '스위스',
    '+44': '영국',
    // ..,
    '+1': '미국'
};

for (let code in codes) {
	alert( + code ); // 49, 41, 44, 1
}

이제 원하는 대로 독일 나라 번호가 가장 먼저 출력되는 것을 확인할 수 있다.