12. 객체 (object)

조뮁·2022년 7월 3일
0

JS기초

목록 보기
12/14
post-thumbnail

객체

  • { }로 작성
  • property : {key: value}로 구성
  • 각 property는 ,로 구분 (마지막 항목에도 넣어주는게 수정 및 이동에 용이)
const superman = {
	name : 'clark',
    age : 33,
}

객체의 사용 (접근, 추가, 삭제)

  1. 접근
  • superman.name // 'clark'
  • superman['age'] // 33
  1. 추가
  • superman.gender = 'male';
  • superman['hairColor'] = 'black';
  1. 삭제 (delete 키워드 사용)
  • delete superman.hairColor;

단축 프로퍼티

// 해당 값이 있고
const name = 'clark';
const age = 33;

// 해당 객체가 있음
// 해당 객체의 name에는 name변수가 들어가 있고, age에는 age변수가 들어가 있음
const superman = {
	name: name,
    age: age,
    gender: 'male',
}
// 다음과 같이 생략 가능
const superman = {
	name,
    age,
    gender: 'male',
}

프로퍼티 존재 여부 확인

// 존재하지 않는 프로퍼티 호출 시 undefined
superman.birthday; // undefined
// in 연산자로 프로퍼티 존재 여부 확인
'birthday' in superman; // false

  • 함수의 인자로 받는 경우
  • api통신을 통해 데이터를 받아올 경우 사용

for ... in 반복문

for (let key in superman) {
	console.log(key);
    console.log(superman[key]);
}

실습

  1. 객체 생성
const superman = {
  name : 'clark',
  age : 33, 
}

// console.log(superman.name);
// console.log(superman['age']);

superman.birthday = '2022-10-31';
superman['hobby'] = 'footbaall';

delete superman.birthday;

console.log(superman);
  1. 이름과 나이를 받아서 객체를 반환하는 함수 생성
  2. 프로퍼티 조회
function makeObject(name, age){
  return {
    name,  // name : name
    age,  // age : age
    hobby : 'football',
  }
}

const Mike = makeObject('Mike', '30');

console.log(Mike);
console.log('age' in Mike);  // true
console.log('birthday' in Mike);  // false


실습

function isAdult(user) {
// (1) if (user.age < 20){
if(!('age' in user) || user.age < 20){
// user에 age가 없거나 or 20살 미만일 경우 false
    return false;
  }
  return true;
}

const Mike = {
  name : "Mike",
  age : 33,
}

const Jane = {
  name : "Jane",
}

console.log(isAdult(Mike));  // true
// (1) console.log(isAdult(Jane));  // true
// user.age가 없을 경우 undefined가 들어가서 if(false)가 되고, 그렇기 때문에 항상 true를 반환함

console.log(isAdult(Jane));  // false

for ... in 문 예제

const Mike = {
  name : "Mike",
  age : 30,
};

for (x in Mike){
  console.log(x);
  console.log(Mike[x]);
}

// "name"
// "Mike"
// "age"
// 30

0개의 댓글