쓰기 가능한 개체 속성?

우리 모두는 JavaScript에서 객체를 생성하는 방법을 알고 있습니다. 예를 들어 다음과 같이 자동차 개체를 만들 수 있습니다.

const car = {};
car.make = "Abarth 124 Spider Convertible 2017";
car.name = "Abarth";
car.price = "$28,195";

console.log(car);

/* =>
{
    "make": "Abarth 124 Spider Convertible 2017",
    "name": "Abarth",
    "price": "$28,195"
}
*/

위 스니펫에는 다음이 있습니다.

객체 리터럴

을 사용하여 객체를 생성했습니다.

속성make을 추가하고 자동차 제조업체

에 해당하는 값을 할당했습니다.

속성name을 추가하고 값Abarth을 할당했습니다.

속성price을 추가하고 자동차 가격

에 해당하는 값을 할당했습니다.

이 구성은 잘 작동하며 보시다시피 자동차 개체를 기록할 때 좋은 자동차 개체를 반환합니다.

쓰기 가능 및 쓰기 불가능 속성

예, JavaScript에서는 객체가 쓰기 가능해야 하는지 여부를 지시할 수 있습니다.

어떻게?

Object.defineProperties() 메서드를 사용하여 속성을 구성할 수 있습니다.

이 메서드는 두 가지 인수를 사용합니다.

속성을 정의하거나 속성을 수정하는 개체

키가 개체의 속성 이름인 개체인 props. 이러한 키의 값은 쓰기 가능 또는 쓰기 불가능으로 구성되도록 구성할 실제 데이터 설명자를 포함하는 개체입니다.

이것이 어떻게 가능한지 봅시다. 우리는 동일한 객체를 정의하지만 약간 다른 방식으로 정의할 것입니다.

const car = {};
Object.defineProperties(car, {
  make: {
    value: "Abarth 124 Spider Convertible 2017",
    writable: true,
  },
  name: {
    value: "Abarth",
    writable: true,
  },
  price: {
    value: "$28,195",
    writable: false,
  },
});

console.log(car);
/*=>
{
    "make": "Abarth 124 Spider Convertible 2017",
    "name": "Abarth",
    "price": "$28,195"
}
*/

위 스니펫에는 다음이 있습니다.

객체 리터럴

을 사용하여 객체car를 생성했습니다.

은 Object.defineProperties() 메서드를 사용하여 make , name 및 price 속성을 추가했습니다.

car 객체를 기록하면 이전과 동일한 객체를 얻습니다.

자세히 살펴보면 두 번째 구문이 세부 정보에 더 많은 세부 정보를 추가한다는 것을 알 수 있습니다.

보시다시피 모든 속성에는 부울 값인 writable 또는 true 를 사용하는 두 번째 속성false이 있습니다.

쓰기 가능 값이 true 일 때 해당 속성을 수정할 수 있습니다. 즉, 해당 값을 변경할 수 있습니다.

그러나 writable 값이 false 인 경우 해당 값을 수정할 수 없습니다.

확인하자

우선 첫 번째 개체를 수정하겠습니다.

const car = {};
car.make = "Abarth 124 Spider Convertible 2017";
car.name = "Abarth 124";
car.price = "$28,195";

console.log(car);
/*=>
{
    "make": "Abarth 124 Spider Convertible 2017",
    "name": "Abarth 124",
    "price": "$28,195"
}
*/

// Modifying properties
car.make = "Abarth 595 Competizione Convertible 2016";
car.name = "Abarth 595";
car.price = "$28,095";

console.log(car);
/*=>
{
    "make": "Abarth 595 Competizione Convertible 2016",
    "name": "Abarth 595",
    "price": "$28,095"
}
*/

보시다시피 car 개체의 속성을 수정할 수 있었습니다.

이제 writable 속성이 추가되었을 때 두 번째 자동차 객체가 어떻게 작동하는지 살펴보겠습니다.

const car = {};
Object.defineProperties(car, {
  make: {
    value: "Abarth 124 Spider Convertible 2017",
    writable: true,
  },
  name: {
    value: "Abarth",
    writable: true,
  },
  price: {
    value: "$28,195",
    writable: false,
  },
});

console.log(car);
/*=>
{
    "make": "Abarth 124 Spider Convertible 2017",
    "name": "Abarth 124",
    "price": "$28,195"
}
*/

// Modifying properties
car.make = "Abarth 595 Competizione Convertible 2016";
car.name = "Abarth 595";
car.price = "$28,095";

console.log(car);
/*=>
{
    "make": "Abarth 595 Competizione Convertible 2016",
    "name": "Abarth 595",
    "price": "$28,195"
}
*/

자세히 살펴보면 make 및 name 값을 변경할 수 있음을 알 수 있습니다.

그러나 price 의 값을 수정할 수 없었습니다. writable의 값이 false로 설정되어 있기 때문에 가능합니다. 나머지는 true로 설정되어 수정할 수 있습니다.

주요 테이크 아웃

객체 리터럴을 사용하여 객체를 생성할 수 있으며 속성과 값이 dot 표기법으로 채워집니다

.

위의 1에 설명된 대로 생성된 객체는 수정 가능합니다

.

Object.defineProperties() 방법

을 사용하여 객체에 속성을 채울 수도 있습니다.

위의 3에 정의된 접근 방식을 사용하면 개체 속성을 수정할 수 있는지 여부를 정의할 수 있습니다

.