[JS] 자바스크립트 기초 _ 객체

✔️ 객체

✍️작성

cosnt superman = {
name 'clark',
age = 23,
}

객체는 중괄호 내에 key와 value로 구성된 프로포트가 들어간다. 각 프로포트는 , 로 구분된다.

객체에 접근하고, 추가하고, 삭제하는 방법에 대해서 알아보자.

✍️작성

superman.name
superman['age']

객체에 접근할때에는 .을 사용하는 방법과 []를 사용하는 방법이 있다.

✍️ 작성

superman.gender='male';
superman['hairColor']='black';

객체추가 방법은 접근 방법과 동일하게 .과 []를 사용한다.

✍️ 작성

delete superman.hairColor;

삭제는 삭제하고 싶은 프로포티 앞에 delete를 작성하여 나타낸다.

단축 프로포티를 활용하면 보다 간단하게 객체를 작성할 수 있다. 함께 알아보자.

✍️ 작성

const name = 'clark';
const age =33;

cosnt superman={
 name = name,
 age = age,
 gender = 'male',
}

객체를 위와같이 나타낼 수도 있지만,

✍️ 작성

const name = 'clark';
const age =33;

cosnt supernam={
name,
age,
gender='male',
}

위처럼 단축하여 나타낼 수도 있다.

🪄 프로퍼티 존재여부 확인하기

✍️작성

const superman = {
name = 'clark',
age= 23,
}

cosnt.birthDay;
//undefined

'birthDay' in superman;
//false

'age' in superman;
//true

만약에 존재하지않는 프로포티에 접근하게 되면 error가 아닌 undefined가 나타나게 된다.

이때 in 연산자를 통해서 존재여부를 확인 할 수 있다.

✔️ for ... in 반복문

✍️작성

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

배운 객체를 응용해서 코드를 작성해보자.

✍️작성

const superman = {
 name : 'clark',
 age : 23,
}
superman.hairColor = 'black';
superman['hobby'] = 'football';
console.log(superman)

💻출력

{name: 'clark', age: 23, hairColor: 'black', 	hobby: 'football'}

[[Prototype]]
: 
Object

이름과 나이를 받아서 객체를 반환하는 함수를 만들어보자

✍️작성

 function makeObject(name,age){
  return {
   name ,
   age ,
   hobby : "coding"
   };
 }
 
 const Cherry = makeObject('Cherry',23);
 console.log(Cherry);
 

💻출력

{name: 'Cherry', age: 23, hobby: 'coding'}

이제 in을 사용하여 프로포티 존재여부를 확인해보자.

✍️작성

function makeObject(name,age){
  return {
   name ,
   age ,
   hobby : "coding"
   };
 }
 
 const Cherry = makeObject('Cherry',23);
 
 console.log('age' in Cherry);
 console.log('birthday' in Cherry);
 

💻출력

true
flase

응용하여 in을 사용하여 성인여부를 확인하는 함수를 작성해보자

✍️작성

function isAdult(user){
if(!('age'in user)||user.age<20){
 return false;
 } else{
  return true;
  }
}

const Cherry = {
name : "Cherry",
age : 23,
}

 const Berry = {
name : "Berry",
}

console.log(isAdult(Cherry));
console.log(isAdult(Berry));

💻출력

true
false 
 
 

if문을 !(age in isAdult)||user.age<20 으로 작성하므로서,

반대의 뜻을 가지는 !을 사용하여 isAdult에 age값을 포함하지 || 않거나, user.age가 20 미만인 경우를 표현해준다.

그래서 age값을 가지지 않는 Berry는 false값을 반환하게 되는 것이다.

for ... in 문을 응용한 예제도 함께 알아보자.

✍️작성

const Cherry={
name:"Cherry",
age : 23
};

for(key in Cherry){
 console.log(key)
}

💻출력

name
age

Cherry가 가지는 key값들을 반환하게 된다.
여기서 key는 Cherry가 가지는 프로포티 값을 의미한다. key가 아닌 다른 단어를 써도 무관하다.