superman
name : clark
age : 33
인 사람이 있을 때 그의 객체를 만들어보자.
const superman = {
name : 'clark',
age : 33,
}
여기서
name : 키(key)
clark : 값(value)
각 줄에는, 사용.
마지막 줄에는 굳이 안써도 되지만, 있을 때 각 줄의 이동이 용이함.
객체 - 접근, 추가, 삭제
🎀접근
superman.name // 'clark'
또는
suprman['age'] // 33
🎀추가
superman.gender = 'male';
superman.['haircolor'] = 'black';
🎀삭제
delete superman.hairColor;
단축 프로퍼티
const name = 'clark';
const age = 33;
일 때
const superman = {
name : name,
age : age,
gender : 'male';,
}
인데,
이 코드는
const superman = {
name,
age,
gender : 'male';,
}
이렇게 쓸 수 있다.
프로퍼티 존재 여부 확인
const superman = {
name : 'clark',
age : 33,
}
superman.birthDay;
//undefined
이 때 in 연산자를 사용하면 프로퍼티가 있는지 확인 가능.
언제 in을 쓸까? 어떤 값이 넘어올 지 확신할 수 없을 때 사용.
'birthDay' in superman;
// false
'age' in superman;
// true
for ... in 반복문을 사용하면 객체를 순회하면서 값을 얻을 수 있다.
for(let key in superman){
console.log(key)
console.log(superman[key])
}
const superman = {
name : 'clark',
age : 30,
}
console.log(superman.name)
console.log(superman['age'])
-> "clark" 30
객체 자체를 찍으면 어떻게 될까?
const superman = {
name : 'clark',
age : 30,
}
console.log(superman)
-> Object {
age: 30,
name: "clark"
}
이제 추가를 해보자.
const superman = {
name : 'clark',
age : 30,
}
superman.hairColr = 'black';
superman['hobby'] = 'football';
console.log(superman)
-> Object {
age: 30,
hairColor: "black",
hobby: "football",
name: "clark"
}
이제 뭔가를 지워보자.
const superman = {
name : 'clark',
age : 30,
}
delete superman.age;
console.log(superman)
-> Object {
name: "clark"
}
이번에는 이름과 나이를 받아서 객체를 반환하는 함수로 만들어보자.
function makeObject(name, age){
return {
name : name,
age : age,
hobby : "football"
}
}
const Mike = makeObject('Mike', 30);
console.log(Mike)
-> Object {
age: 30,
hobby: "football",
name: "Mike"
}
물론
name : name,
과
age : age,
는 각각
name,
age,
로 축약해서 사용 가능.
다음으로는 in을 이용하여 프로퍼티가 존재하는지 확인해보자.
function makeObject(name, age){
return {
name : name,
age : age,
hobby : "football"
}
}
const Mike = makeObject('Mike', 30);
console.log('age' in Mike)
console.log('birthday' in Mike)
-> true false
function isAdult(user){
if(user.age < 20){
return false;
} else {
return true;
}
}
혹은 아래와 같이 else를 생략해도 무방. 어차피 if문으로 들어오지 않으면 아래와 같이 실행될 것이므로.
function isAdult(user){
if(user.age < 20){
return false;
}
return true;
}
const Mike = {
name : 'Mike',
age : 30
}
const Jane = {
name: "Jane"
};
console.log(isAdult(Mike))
-> true
그런데 이때
function isAdult(user){
if(user.age < 20){
return false;
}
return true;
}
const Mike = {
name : 'Mike',
age : 30
}
const Jane = {
name: "Jane"
};
console.log(isAdult(Jane))
-> true 반환. Jane은 나이가 없는데 왜 true? if문을 false로 인식해서 true로 내주는 것.
의도에 맞게 고쳐보자.
function isAdult(user){
if (!('age' in user) || user.age < 20){
return false;
}
return true;
}
const Mike = {
name : 'Mike',
age : 30
}
const Jane = {
name: "Jane"
};
console.log(isAdult(Mike))
-> false
다음으로는 for...in 문 예제를 봐보자.
const Mike = {
name : 'Mike',
age : 30
}
for(x in Mike){
console.log(x)
}
-> "name" "age"
문자열을 이용해서 값을 가져올 수도 있다.
const Mike = {
name : 'Mike',
age : 30
}
for(x in Mike){
console.log(Mike[x])
}
-> "Mike" 30
