객체에 익숙해지기.

개체는 JavaScript의 모든 곳에 있습니다. 물체에 대한 더 많은 지식을 얻는 것은 여정의 어느 시점에서 분명히 도움이 될 것입니다. 이 게시물에서는 대부분의 개발자가 알지 못하거나 유용하다고 생각하지 않는 개체의 일부 속성과 메서드를 발견할 것입니다.

개체 생성 구문에 이미 익숙하기를 바랍니다.

let obj = { key: "value" }

그러나 이러한 키와 값에 대해 많은 사용자 정의를 할 수 있다는 것을 알고 계셨습니까?
Object.defineProperty 메서드를 사용하면 속성의 동작을 제어할 수 있습니다. 어떻게 작동하는지 봅시다.

let obj = {}

Object.defineProperty( obj, "a", {
    value: 1,
    writable: false,
    configurable: true,
    enumerable: true
} )

defineProperty는 세 가지 인수를 사용합니다.

속성을 만들려는 개체입니다.

속성의 이름입니다.

구성 개체입니다.

이제 구성 개체에 대해 이야기해 보겠습니다.

값

값은 키(a)에 설정하려는 유효한 값이 될 수 있습니다.

쓰기 가능

쓰기 가능을 false로 설정한 경우. 값을 편집할 수 없습니다.

obj.a = "new value"   // Oops, not allowed.

구성 가능

configurable를 true로 설정하면. 동일한 defineProperty 방법으로 언제든지 동작을 변경할 수 있지만 false 로 설정하면 다시 변경할 수 없습니다. 단방향 작업입니다.

열거 가능

enumerable을 false로 설정하면 for...in 루프와 같은 열거형에 표시되지 않습니다.

이제 개체 확장을 방지하는 몇 가지 내장 메서드를 살펴보겠습니다.

확장 방지

이름에서 알 수 있듯이. 개체에 더 많은 속성을 설정하지 못하게 합니다.

let obj = { a: 1 };

Object.preventExtensions( obj );

obj.b = 2;   // in strict mode it will throw an error.

console.log( obj.b )   // undefined

밀봉하다

이 방법은 preventExtensions 와 동일하게 작동하지만 모든 기존 속성을 configurable: false 로 만듭니다. 따라서 새 속성을 추가할 수 없으며 재구성할 수도 없습니다. 다시 단방향 작동.

let obj = { a: 1 };

Object.seal( obj );

obj.b = 2;   // in strict mode it will throw an error.

console.log( obj.b )   // undefined

얼다

이것은 가장 높은 수준의 불변성입니다. Freeze는 개체의 모든 "데이터 접근자"를 writable: false 로 설정합니다.

let obj = { a: 1 };

Object.freeze( obj );

obj.b = 2;   // in strict mode it will throw an error.

console.log( obj.b )   // undefined

이것이 내가 유용하고 흥미롭게 찾은 방법입니다. 더 흥미로운 방법을 알고 있다면 아래에 의견을 말하십시오. 그때까지 재미있는 포스팅으로 찾아뵙겠습니다. 안녕히계세요.