객체란 무엇일까?
객체는 key/value pair를 저장할 수 있는 구조이다.
key/value의 예시
< 사람 1 >
이름: dakyung oh
나이: 27
주소: 동탄
key : "이름", "나이", "주소"
value(그에 해당하는 정보) : "dakyung oh" , 27, "동탄"const person = { name : "dakyung oh", age : 27, address : "동탄" };
key/value 뒤에 "쉼표 : ,"를 이용하여 그 뒤에 오는 key/value와 구분해주어야 한다.
객체에 저장된 내용 가져오는 방법
const person = { name: "dakyung oh", age: 27, address: "동탄", }; const myName = person.name; const myAge = person.age; const myAddress = person["address"]; console.log(myName); //dakyung oh console.log(myAge); // 27 console.log(myAddress); // 동탄
객체 리터럴을 이용해 속성을 지정할 때, 이미 정의된 변수나 함수를 이용하여 Value로 지정할 수 있다.
const me = "dakyung"; function getAge() { return 27; } function getAddress() { return "동탄"; } const person = { name: me, age: getAge(), adress: getAddress(), }; console.log(person); //{ name: 'dakyung', age: 27, adress: '동탄' }
객체 범주에 배열과 함수 포함하기
// 배열 const arr = [1, 2, 3, 4, 5, 9]; console.log(arr[1]); // 2 console.log(arr.title); // undifined arr.title = "dakyung's velog"; console.log(arr.title); // dakyung's velog
// 함수 function foo(x, y) { return x + y; } console.log(foo.title); // undifined foo.title = "dakyung's velog2"; console.log(foo.title); // dakyung's velog2 console.log(foo(1, 5)); // 6
객체에서 .연산자와 [ ]연산자의 차이
- .연산자는 뒤에 오는 값을 스트링 취급한다.
- []연산자는 뒤에 오는 값을 변수 취급한다.
eg) human에 age 값 30을 추가해보자
const human = {}; human.age = 30 // (o) .연사자 뒤에 오는 age는 스트링이다. human['age'] = 30 // (o) []연산자 뒤에 오는 [age]는 변수이다. const age = 'age'; human[age] = 30 // (o) // human age = 30 // (x) // human = age+30 // (x) // human[age] = 30 // (x)
위의 내용을 적용하여 문제를 풀어보자
const human = {}; const propertyAge = "age"; const propertyValue = 30; - []연산자를 사용하는 경우 human[propertyAge] = propertyValue; console.log(human); // { age: 30 } - .연산자를 사용하는 경우 human.propertyAge = propertyValue; console.lof(human); // {propertyAge : 30} function merge(propertyAge, propertyValue) { let obj = {}; obj[propertyAge] = propertyValue; return obj; } console.log(merge("age", 30)); // { age: 30 }