[JavaScript] 객체 메소드, 계산된 프로퍼티

반응형

계산된 프로퍼티

 객체를 만들 때 key가 대괄호로 둘러싸여 있는 경우를 말한다.

 아래 코드를 살펴보자.

let a = 'age';
let user = {
	name : 'jiwoong',
	[a] : 4
}

 

 객체 안의 key를 문자열 age가 할당된 변수 a에서 가져왔다.

 

 다음과 같이 식 자체를 대괄호에 넣을 수 있다.

const user = {
	[1+1] : 2,
	['안녕' + '하세요'] : 'hello'
}

 

객체 메소드

 객체 메소드는 객체에서 사용할 수 있는 메소드를 말한다.

 몇가지를 살펴보자.

 

Object.assign()

 객체를 복제 또는 병합한다.

 객체를 복제할 때 아래와 같이 하면 어떻게 될까?

 

let user = {
	name : 'jiwoong',
	age : 4
}

let cloneUser = user;

 

 이렇게 작성하면 cloneUser 에는 user 객체의 참조값만 저장된다.

 즉, 하나의 객체에 user와 cloneUser 가 접근하게 된다.

 따라서, cloneUser 의 내용을 바꾸면 user 의 내용에도 영향을 끼친다.

let user = {
	name : 'jiwoong',
	age : 4
}

let cloneUser = user;

cloneUser.age = 6;
console.log(user.age);

 

 동일한 객체를 복사하기 위해서는 Object.assign() 을 사용한다.

let user = {
	name : 'jiwoong',
	age : 4
}

let cloneUser = Object.assign({}, user);
console.log(cloneUser);

 

 괄호 안의 첫번째 인자는 초기값으로, 두번째 인자가 병합된다.

 

 아래 코드는 병합하는 경우이다.

let user = {
	name : 'jiwoong',
	age : 4
}

let cloneUser = Object.assign({gender:'male'}, user);
console.log(cloneUser);

 

 초기값의 key가 같은 경우, 덮어 쓰기 된다.

let user = {
	name : 'jiwoong',
	age : 4
}

let cloneUser = Object.assign({age:6}, user);
console.log(cloneUser);

 

 2개 이상의 객체도 병합 할 수 있다.

let user = {
	name : 'jiwoong'
}
let info1 = {
	age : 4
}
let info2 = {
	gender: 'male'
}
let cloneUser = Object.assign(user,info1,info2);
console.log(cloneUser);

 

Object.keys()

 key 배열을 반환한다.

let user = {
	name : 'jiwoong',
	age : 4
}

let keys = Object.keys(user);
console.log(keys);

 

Object.values()

 value 배열을 반환한다.

let user = {
	name : 'jiwoong',
	age : 4
}

let values = Object.values(user);
console.log(values);

 

Object.entries()

 key와 value 배열을 반환한다.

let user = {
	name : 'jiwoong',
	age : 4
}

let entries = Object.entries(user);
console.log(entries);

 

 이 때, 배열 안에 key, value 한쌍으로 이루어진 배열이 들어간다.

 

Object.fromEntries()

 key와 value 배열을 객체로 만든다.

let user = [
	['name','jiwoong'],
	['age',4]
];

let result = Object.fromEntries(user);
console.log(result);

 

 Object.entries() 에서 반환된 배열처럼 배열 안에 key, value 배열을 넣어준다.