๐Ÿ“– [JavaScript] Object methods, Computed property

ํ˜ฑยท2022๋…„ 9์›” 5์ผ

JavaScript_Intermediate

๋ชฉ๋ก ๋ณด๊ธฐ
3/19

๐Ÿ”Ž Computed property

๐Ÿ“Œ ๊ณ„์‚ฐ๋œ ํ”„๋กœํผํ‹ฐ

let a = 'age';
const user = {
	name: 'Mike',
   ** [a] : 30 ** //age:30 => Computed property
   }
const user = {
	[1+4] : 5,
    ["์•ˆ๋…•" + "ํ•˜์„ธ์š”"]: "Hello"
   }
  
user //{5:5, ์•ˆ๋…•ํ•˜์„ธ์š”: "Hello"}   

๐Ÿ”Ž Object-Methods

๐Ÿ“Œ Object.assign(): ๊ฐ์ฒด ๋ณต์ œ

const user = {
	name: 'Mike',
    age: 30
} // ๊ฐ์ฒด์˜ ์ฐธ์กฐ๊ฐ’์ด ๋“ค์–ด ์žˆ์Œ
const cloneUser = user; //๊ฐ์ฒด ๋ณต์ œX, ํ•˜๋‚˜์˜ ๊ฐ์ฒด๋ฅผ ๋‘๊ฐ€์ง€ ์ด๋ฆ„์œผ๋กœ ์“ฐ๋Š” ๊ฒƒ

const newUser = Object.assign({}, user); //๋นˆ ๊ฐ์ฒด์— user๊ฐ’์ด ๋ณ‘ํ•ฉ๋˜๋ฏ€๋กœ ๋ณต์ œ๊ฐ€ ๋จ.

newUser.name = 'Tom'; //์ด๋ฆ„์„ ๋ฐ”๊ฟ”๋„ user๊ฐ’์€ ๋ณ€ํ•จ์ด ์—†์Œ
newUser != user

Object.assign({gender: 'male'}, user);
//{gender: 'male'} ๊ฐ์ฒด์— user๊ฐ€ ๋ณ‘ํ•ฉ๋˜๋ฏ€๋กœ ์ด 3๊ฐœ์˜ ๊ฐ’์„ ๊ฐ€์ง€๊ฒŒ ๋จ.

Object.assign({name: 'Tom'}, user);
//๋ณ‘ํ•ฉํ•  ๋•Œ ํ‚ค๊ฐ€ ๊ฐ™๋‹ค๋ฉด, ๋ณต์ œ๋˜๋Š” ๊ฒƒ์œผ๋กœ ๋ฎ์–ด์“ฐ๊ฒŒ ๋จ, ๋”ฐ๋ผ์„œ ์ด๋•Œ name:'Mike'

//์„ธ ๊ฐœ ๋ณ‘ํ•ฉ๋„ ๊ฐ€๋Šฅ! 
const user = {
	name: 'Mike'
}
const info1 = {
	age : 30,
}
const info2 = {
	gender: 'male',
}
Object.assign(user, info1, info2)
//info1, info2๊ฐ€ user์— ํ•ฉ์ณ์ง

๐Ÿ“Œ Object.keys(): ํ‚ค ๋ฐฐ์—ด ๋ฐ˜ํ™˜

const user = {
	name: 'Mike',
    age: 30,
    gender: 'male',
}
Object.keys(user); //["name", "age", "gender"]

๐Ÿ“Œ 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',}
profile
new blog: https://hae0-02ni.tistory.com/

0๊ฐœ์˜ ๋Œ“๊ธ€