๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
๐Ÿ“Œ Language/Javascript

[JS] ํ”„๋กœํผํ‹ฐ ์˜ต์…˜(ํ”Œ๋ž˜๊ทธ) ๋‹ค๋ฃจ๊ธฐ(Property Flag)

by Fomagran ๐Ÿ’ป 2022. 2. 12.
728x90
๋ฐ˜์‘ํ˜•

 

์•ˆ๋…•ํ•˜์„ธ์š” Foma๐Ÿ’ป ์ž…๋‹ˆ๋‹ค.

 

์˜ค๋Š˜์€ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์˜ ํ”„๋กœํผํ‹ฐ ํ”Œ๋ž˜๊ทธ์— ๋Œ€ํ•ด์„œ ์ •๋ฆฌํ•ด๋ณด๋ ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค.

 

๋ชจ๋˜ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ์‚ฌ์ดํŠธ์—์„œ ๊ณต๋ถ€ํ•˜๋Š” ๊ฒƒ์„ ๋ณต์Šตํ•˜๋Š” ์ฐจ์›์—์„œ ์ œ๊ฐ€ ์ดํ•ดํ•œ ๋ฐฉ์‹์œผ๋กœ ์ ์–ด๋ณด๊ฒ ์Šต๋‹ˆ๋‹ค!

 

๋ฐ”๋กœ ์‹œ์ž‘ํ• ๊ฒŒ์š”~


Property Flag๋ž€?

 

ํ”„๋กœํผํ‹ฐ๋Š” ๊ฐ’ ๋ฟ๋งŒ ์•„๋‹ˆ๋ผ ํ”Œ๋ž˜๊ทธ๋ผ ๋ถˆ๋ฆฌ๋Š” ํŠน๋ณ„ํ•œ ์†์„ฑ 3๊ฐ€์ง€๋ฅผ ๊ฐ€์ง„๋‹ค.

 

1. writable

 

ํ•ด๋‹น ํ”„๋กœํผํ‹ฐ๋ฅผ ์ˆ˜์ •ํ•  ์ˆ˜ ์žˆ๊ฒŒ ์„ค์ •ํ•˜๋Š” ํ”Œ๋ž˜๊ทธ

 

2. enumrable

 

ํ•ด๋‹น ํ”„๋กœํผํ‹ฐ๋ฅผ ๋‚˜์—ดํ•  ์ˆ˜ ์žˆ๊ฒŒ ์„ค์ •ํ•˜๋Š” ํ”Œ๋ž˜๊ทธ

 

3. configurable

 

ํ•ด๋‹น ํ”„๋กœํผํ‹ฐ๋ฅผ ์‚ญ์ œ, ํ”Œ๋ž˜๊ทธ ์ˆ˜์ •์ด ๊ฐ€๋Šฅํ•˜๊ฒŒ ์„ค์ •ํ•˜๋Š” ํ”Œ๋ž˜๊ทธ


Property Flag ํ™•์ธํ•˜๋Š” ๋ฐฉ๋ฒ•

 

Object.getOwnPropertyDescriptor(๊ฐ์ฒด,ํ”„๋กœํผํ‹ฐ๋ช…)์œผ๋กœ ํ™•์ธํ•˜๊ณ ,

 

์ดˆ๊ธฐ์—” ๋ชจ๋‘ true๋กœ ์„ค์ •๋˜์–ด ์žˆ๋‹ค.

 

let user = {
    nickName:"foma",
    age:27
}
let descriptor = Object.getOwnPropertyDescriptor(user,'nickName')
console.log(descriptor)//{ value: 'foma', writable: true, enumerable: true, configurable: true }

Writable

 

์œ ์ €์˜ nickName์˜ writable ํ”„๋กœํผํ‹ฐ ํ”Œ๋ž˜๊ทธ๋ฅผ flag๋ฅผ false๋กœ ์„ค์ •ํ•˜๊ณ 

 

Object.defineProperty(user,'nickName',{
    writable:false
})

 

๋‹ค์‹œ ํ•œ๋ฒˆ ํ”„๋กœํผํ‹ฐ ํ”Œ๋ž˜๊ทธ๋ฅผ ํ™•์ธํ•˜๋ฉด writable๋งŒ false๋กœ ๋˜์–ด์žˆ๋‹ค.

 

print(Object.getOwnPropertyDescriptor(user,'nickName')) //{ value: 'foma', writable: false, enumerable: true, configurable: true }

 

๋งŒ์•ฝ ์ˆ˜์ •ํ•˜๋ ค๊ณ  ํ•˜๋ฉด ์—„๊ฒฉ๋ชจ๋“œ์ผ ๋• error๊ฐ€ ๋‚˜๊ณ  ์•„๋‹ˆ๋ฉด ๊ทธ๋ƒฅ ๋ฌด์‹œ๋œ๋‹ค.

 

user.nickName = "Foma" //error

Enumerable

 

user์— sayHi ๋ฉ”์„œ๋“œ๋ฅผ ์ถ”๊ฐ€ํ•œ ๋’ค ํ”„๋กœํผํ‹ฐ๋ฅผ ์ˆœํšŒํ•˜์—ฌ ์ถœ๋ ฅํ•˜๋ฉด ์•„๋ž˜์™€ ๊ฐ™์ด ๋ฉ”์„œ๋“œ ํฌํ•จํ•ด์„œ ๋ชจ๋‘ ์ถœ๋ ฅ๋œ๋‹ค.

 

user.sayHi = function (){
    print("์•ˆ๋…•")
}
for (let key in user) {
    print(key)
} 
/*
nickName
age
sayHi
*/

 

์—ฌ๊ธฐ์„œ ๋งŒ์•ฝ nickName์˜ enumerable ํ”„๋กœํผํ‹ฐ ํ”Œ๋ž˜๊ทธ๋ฅผ false๋กœ ์„ค์ •ํ•˜๊ณ  ๋‹ค์‹œ ํ•œ๋ฒˆ ์ˆœํšŒํ•˜๋ฉด 

 

nickName์ด ์ œ์™ธ๋œ ์ฑ„ ์ถœ๋ ฅ๋œ๋‹ค.

 

Object.defineProperty(user,'nickName',{
    enumerable:false
})
for (let key in user) {
    print(key)
}
/*
age
sayHi
*/

Configurable

 

nickName์˜ configurable ํ”„๋กœํผํ‹ฐ ํ”Œ๋ž˜๊ทธ๋ฅผ false๋กœ ์„ค์ •ํ•˜๊ณ 

 

Object.defineProperty(user,'nickName',{
    configurable:false
})

 

ํ•ด๋‹น ํ”„๋กœํผํ‹ฐ๋ฅผ ์‚ญ์ œํ•˜๋ ค๊ณ  ํ•˜๋ฉด ์—๋Ÿฌ๊ฐ€ ๋ฐœ์ƒํ•œ๋‹ค.

 

delete user.nickName //์—๋Ÿฌ

 

๋˜ํ•œ ํ•ด๋‹น ํ”„๋กœํผํ‹ฐ์˜ ๋‹ค๋ฅธ ํ”Œ๋ž˜๊ทธ๋ฅผ ๋ณ€๊ฒฝํ•˜๋ ค๊ณ  ํ•ด๋„ ์—๋Ÿฌ๊ฐ€ ๋ฐœ์ƒํ•œ๋‹ค.

 

Object.defineProperty(user,'nickName',{
    writable:true
}) //์—๋Ÿฌ

 

๋งŒ์•ฝ writable๊ณผ configurable์ด ๋ชจ๋‘ false๋ผ๋ฉด ์‚ญ์ œ๋‚˜ ์ˆ˜์ •์ด ์˜์›ํžˆ ๋ถˆ๊ฐ€๋Šฅํ•˜๋‹ค.


์—ฌ๋Ÿฌ ํ”„๋กœํผํ‹ฐ์˜ ํ”Œ๋ž˜๊ทธ ๋ณ€๊ฒฝํ•˜๊ธฐ

 

Object.defineProperties๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์—ฌ๋Ÿฌ ํ”„๋กœํผํ‹ฐ์˜ ํ”Œ๋ž˜๊ทธ๋ฅผ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ๋‹ค.

 

Object.defineProperties(user,{
    name:{value:"foma",writable:true,enumerable:false,configurable:true},
    age:{value:2,writable:true,enumerable:false,configurable:true}
})

๊ฐ์ฒด ์ˆ˜์ •์„ ๋ง‰์•„์ฃผ๋Š” ๋‹ค์–‘ํ•œ ๋ฉ”์„œ๋“œ

 

ํ”„๋กœํผํ‹ฐ ํ”Œ๋ž˜๊ทธ ์™ธ์—๋„ ๊ฐ์ฒด ์ˆ˜์ •์„ ๋ง‰์•„์ฃผ๋Š” ๋‹ค์–‘ํ•œ ๋ฉ”์„œ๋“œ๋“ค์ด ์žˆ๋‹ค.

 

Object.preventExtensions(user) //์ƒˆ๋กœ์šด ํ”„๋กœํผํ‹ฐ ์ถ”๊ฐ€ ๋ถˆ๊ฐ€
Object.seal(user) //์ƒˆ๋กœ์šด ํ”„๋กœํผํ‹ฐ ์ถ”๊ฐ€๋‚˜ ๊ธฐ์กด ํ”„๋กœํผํ‹ฐ ์‚ญ์ œ๋ฅผ ๋ง‰์•„์คŒ
Object.freeze(user) //์ƒˆ๋กœ์šด ํ”„๋กœํผํ‹ฐ ์ถ”๊ฐ€,๊ธฐ์กด ํ”„๋กœํผํ‹ฐ ์‚ญ์ œ,์ˆ˜์ •์„ ๋ง‰์•„์คŒ
Object.isExtensible(user) //์ƒˆ๋กœ์šด ํ”„๋กœํผํ‹ฐ๋ฅผ ์ถ”๊ฐ€ํ•˜๋Š”๊ฒŒ ๋ถˆ๊ฐ€๋Šฅํ•œ์ง€ ์—ฌ๋ถ€๋ฅผ ์•Œ๋ ค์คŒ
Object.isSealed(user) //ํ”„๋กœํผํ‹ฐ๊ฐ€ ์ถ”๊ฐ€,์‚ญ์ œ๊ฐ€ ๋ถˆ๊ฐ€๋Šฅํ•˜๊ณ  ๋ชจ๋“  ํ”„๋กœํผํ‹ฐ๊ฐ€ configurable:false์ธ์ง€ ์•Œ๋ ค์คŒ
Object.isFrozen(user) //ํ”„๋กœํผํ‹ฐ ์ถ”๊ฐ€,์‚ญ์ œ,๋ณ€๊ฒฝ์ด ๋ถˆ๊ฐ„์œผํ•˜๊ณ  ๋ชจ๋“  ํ”„๋กœํผํ‹ฐ๊ฐ€ configurable:false,writable:false์ธ์ง€ ์•Œ๋ ค์คŒ

Reference

 

 

๋ชจ๋˜ JavaScript ํŠœํ† ๋ฆฌ์–ผ

 

ko.javascript.info

 

728x90
๋ฐ˜์‘ํ˜•

๋Œ“๊ธ€