javascript オブジェクトのプロパティの追加を禁止する
- 作成日 2020.11.03
- 更新日 2022.08.08
- javascript
- javascript
javascriptで、preventExtensionsを使用して、オブジェクトへのプロパティの追加を禁止するサンプルコードを記述してます。
環境
- OS windows10 pro 64bit
- Apache 2.4.43
- ブラウザ chrome 103.0.5060.114
preventExtensions使い方
preventExtensionsを使用すると、オブジェクトへのプロパティの追加を禁止することが可能です。
以下のようにオブジェクトのプロパティを追加するコードがあった場合、
const human = {
name: 'tanaka',
age: 30
};
human.tel = 123123123;
console.log(
human.tel
); // 123123123
「preventExtensions」を使用すると追加できなくなります。
const human = {
name: 'tanaka',
age: 30
};
Object.preventExtensions(human);
human.tel = 123123123;
console.log(
human.tel
); // undefined
use strictを指定すると、preventExtensions後にプロパティを追加しようとするとエラーとなります。
'use strict';
const human = {
name: 'tanaka',
age: 30
};
Object.preventExtensions(human);
human.tel = 123123123; // エラー
エラー内容
Uncaught TypeError: Cannot add property tel, object is not extensible
firefox102の場合は、以下のエラーが発生します。
Uncaught TypeError: can't define property "tel": Object is not extensible
また、削除や更新は可能となります。
'use strict';
const human = {
name: 'tanaka',
age: 30
};
Object.preventExtensions(human);
human.name = "suzuki";
delete human.age;
console.log(
human
);
実行結果
プロパティが追加できるかを確認するには「isExtensible」を使用します。
const human = {
name: 'tanaka',
age: 30
};
console.log(
Object.isExtensible(human) // true
);
Object.preventExtensions(human);
console.log(
Object.isExtensible(human) // false
);
配列に使用
配列に使用するとオブジェクトと同じ挙動になります。
let arr = ["aaa","bbb"]
arr[2] = "ccc"
console.log(
arr // ['aaa', 'bbb', 'ccc']
);
Object.preventExtensions(arr); // 追加禁止
arr[3] = "ddd"
console.log(
arr // ['aaa', 'bbb', 'ccc']
);
「use strict」を使用すると、エラーが発生するところも同じです。
'use strict';
let arr = ["aaa","bbb"]
arr[2] = "ccc"
console.log(
arr // ['aaa', 'bbb', 'ccc']
);
Object.preventExtensions(arr); // 追加禁止
arr[3] = "ddd" // Uncaught TypeError: Cannot add property 3, object is not extensible
console.log(
arr // ['aaa', 'bbb', 'ccc']
);
-
前の記事
Rails ベーシック認証を設定する手順 2020.11.03
-
次の記事
Alpine.jsでx-dataとx-showを使用してテキストの表示・非表示を切り替える 2020.11.03
コメントを書く