快捷導(dǎo)航

原生JavaScript創(chuàng)建不可變對(duì)象的方法簡單示例

更新時(shí)間：2020年05月07日 11:49:18 作者：杜尼卜

這篇文章主要介紹了原生JavaScript創(chuàng)建不可變對(duì)象的方法,結(jié)合簡單實(shí)例形式分析了基于原生JavaScript創(chuàng)建不可變對(duì)象的相關(guān)原理、實(shí)現(xiàn)方法與操作注意事項(xiàng),需要的朋友可以參考下

本文實(shí)例講述了原生JavaScript創(chuàng)建不可變對(duì)象的方法。分享給大家供大家參考，具體如下：

Javascript是一種靈活的語言，你可以重新定義任何東西，但是當(dāng)項(xiàng)目變得復(fù)雜時(shí)，我們會(huì)發(fā)現(xiàn)可變數(shù)據(jù)結(jié)構(gòu)的問題。隨著JavaScript的最新版本的發(fā)布這種情況發(fā)生了改變?，F(xiàn)在可以創(chuàng)建不可變的對(duì)象了。本文介紹如何用三種不同的方法來做。

對(duì)象的不變性意味著我們不希望對(duì)象在創(chuàng)建后即以任何方式更改（將它們?cè)O(shè)置為只讀類型）。

假設(shè)我們需要定義一個(gè) car 對(duì)象，并在整個(gè)項(xiàng)目中使用它的屬性來執(zhí)行操作。我們不能允許錯(cuò)誤地修改任何數(shù)據(jù)。

const myTesla = {
 maxSpeed: 155,
 batteryLife: 300,
 weight: 2300
};

Object.preventExtensions() 防止擴(kuò)展

此方法可防止向現(xiàn)有對(duì)象添加新屬性，preventExtensions() 是不可逆的操作，我們永遠(yuǎn)不能再向?qū)ο筇砑宇~外的屬性。

Object.isExtensible(myTesla); // true
Object.preventExtensions(myTesla);
Object.isExtensible(myTesla); // false
myTesla.color = 'blue';
console.log(myTesla.color) // undefined

Object.seal() 密封

它可以防止添加或刪除屬性，seal() 還可以防止修改屬性描述符。

Object.isSealed(myTesla); // false
Object.seal(myTesla);
Object.isSealed(myTesla); // true

myTesla.color = 'blue';
console.log(myTesla.color); // undefined

delete myTesla.batteryLife; // false
console.log(myTesla.batteryLife); // 300

Object.defineProperty(myTesla, 'batteryLife'); // TypeError: Cannot redefine property: batteryLife

Object.freeze() 凍結(jié)

它的作用與 Object.seal() 相同，而且它使屬性不可寫。

Object.isFrozen(myTesla); // false
Object.freeze(myTesla);
Object.isFrozen(myTesla); // true

myTesla.color = 'blue';
console.log(myTesla.color); // undefined

delete myTesla.batteryLife;
console.log(myTesla.batteryLife); // 300

Object.defineProperty(myTesla, 'batteryLife'); // TypeError: Cannot redefine property: batteryLife

myTesla.batteryLife = 400;
console.log(myTesla.batteryLife); // 300