자바스크립트 중급 강좌 (객체 매서드)

히대·2023년 11월 9일

Javascript

목록 보기
13/28

computed property (계산된 프로퍼티)

let a = "age";

const user = {
	name : "Mike",
    [a] : 30  대괄호로 묶어주면 변수 a에 할당된 값이 들어감
    		  이를 computed property (계산된 프로퍼티) 라고 부름
}

const user = {
	[1 + 4] : 5,
    ["안녕" + "하세요"] : "Hello"
}

user -> {5: 5, 인녕하세요: "Hello"} 

객체에서 사용할수있는 매서드

Object.assign() : 객체 복제
Object.keys() : 키 배열 반환
Object.values() : 값 배열 반환
Object.entries() : 키와 값 모두 배열 반환
Object.fromEntries()

Object.assign() : 객체 복제

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

const cloneUser = user; 이런식으로 작성을 하게되면
const user 을 복제하는 것 이 아닌 
{
	name : "Mike",
    age : 30
}
이 값들만 복사가됨 
그래서 cloneUser.name = "Tom";이라 선언하면 
{
	name : "Tom", 이라 바뀌면서
    age : 30
}
처음에 설정했던 user.name 값이 "Mike" 가 아닌 "Tom"으로 바뀌게됨
하나의 객체를 두개의 변수가 접근하는것임.


const newUser = Object.assign({}, user); {안에는 초기값} 초기값 안에 
										 user가 들어가면서 복제됨.

const newUser = Object.assign({}, user); 
newUser.name = "Tom"; 이렇게 선언을 해도
console.log(user.name); //"Mike"로 출력됨 같은 객체가 아니기 때문

newUser != user

Object.assign({ gender:"male" }, user); 실행시에는 

{
	gender : "male",
	name : "Mike",
    age : 30
}

이런식으로 젠더가 병합됨.

만약 병합을 하는데 키가 같다면?

Object.assign({ name:"Tom" }, user); 실행시에는 

{
	name : "Tom", 이런식으로 원래 설정된 값이 덮어쓰게됨
	name : "Mike",
    age : 30
}

const user = {
	name : "Mike"
}

const info1 = {
	age : 30,
}

const info2 = {
	gender : "male",
}

Object.assign(user, info1, info2); 실행시에는

user에 info1, info2가 합쳐짐 

Object.keys() : 키 배열 반환

const user = {
	name : "Mike",
    age : 30,
    gender : "male",
}

Object.keys(user); -> ["name","age","gender"] key값이 배열로 반환됨

Object.values() : 값 배열 반환

const user = {
	name : "Mike",
    age : 30,
    gender : "male",
}

Object.values(user); -> ["Mike",30,"male"] 값이 배열로 반환됨

Object.entries() : 키/값 배열 반환

const user = {
	name : "Mike",
    age : 30,
    gender : "male",
}

Object.entries(user); -> ["name","Mike"],["age",30],["gender","male"] 
						 키와값을 쌍으로 배열로 반환됨

Object.fromEntries() : 키/값 배열을 객체로

const arr = 
[
	["name","Mike"],
    ["age",30],
    ["gender","male"] 
]

Object.fromEntries(arr); -> {name: "Mike",
							  age: 30,
                              gender : "male",
                             }
						 키와값을 쌍으로 배열로 반환됨
let n = "name";
let a = "age";

const user = {
	[n]: "Mike",
    [a]: 30,
    [1+4]: 5
};

console.log(user); -> {5: 5, name: "Mike", age: 30}

function makeObj(key, val){
	return{
    	[key] : val
    };
}

const obj = makeObj("나이", 33);

console.log(obj); -> {나이, 33}
const user = {
	name: "Mike",
    age : 30,
};

const user2 = Object.assign({}, user)
user2.name = "Tom"

console.log(user); -> {name: "Mike", age: 30}
console.log(user2); -> {name: "Tom", age: 30}

const result = Object.keys(user);

console.log(result); -> ["name","age"]

const val = Object.values(user);

console.log(val); -> ["Mike", 30]

const ent = Object.entries(user);

console.log(ent); -> ["name","age"],["Mike", 30]
let arr = [
	["mon","월"],
    ["tue","화"]
]

const fromEnt = Object.fromEntries(arr);

console.log(fromEnt); -> {mon: "월",
						  tue: "화"}
profile
아자아자 파이팅🔥

0개의 댓글