快捷導航

JavaScript創(chuàng)建防篡改對象的方法分析

更新時間：2018年12月30日 14:34:02 作者：deniro_li

這篇文章主要介紹了JavaScript創(chuàng)建防篡改對象的方法,結(jié)合具體實例形式分析了javascript基于不可擴展對象、密封的對象和凍結(jié)的對象實現(xiàn)防篡改對象的相關(guān)操作技巧,需要的朋友可以參考下

本文實例講述了JavaScript創(chuàng)建防篡改對象的方法。分享給大家供大家參考，具體如下：

之前的 JavaScript，開發(fā)人員可能會意外修改了別人的代碼，甚至重寫原生對象！現(xiàn)在，在 ECMAScript 5 中可以定義防篡改對象啦O(∩_∩)O~

不過，一旦把對象定義為防篡改之后，就無法撤銷了哦。

1 不可擴展對象

默認情況下，所有的對象都是可擴展的，即可以隨意地添加屬性和方法?，F(xiàn)在，使用 Object.preventExtensions(person) 方法后，對象就不可以擴展咯：

<script type="text/javascript">
  var person = {name: "deniro"};
  //  person.age = 29;
  //  console.log(person.age);
  console.log(Object.isExtensible(person));//true
  Object.preventExtensions(person);
  person.age = 15;
  console.log(person.age);//undefined
  console.log(Object.isExtensible(person));//false
</script>

運行結(jié)果：

在非嚴格模式下，為對象添加新成員會靜默失??；而在嚴格模式下，會拋出錯誤。

雖然對象不能添加新成員，但仍然可以修改和刪除已有的成員。而 Object.isExtensible() 可以確定對象是否可擴展。

2 密封的對象

密封的對象不可以擴展，而且已有的成員的[[Configurable]]的特性也被設(shè)置為 false，這意味著不能刪除這個對象的屬性和方法咯，但屬性的值可以修改：

<script type="text/javascript">
  var person = {name: "deniro"};
  console.log(Object.isExtensible(person));//true
  console.log(Object.isSealed(person));//false
  Object.seal(person);//密封對象
  console.log(Object.isExtensible(person));//false
  console.log(Object.isSealed(person));//true
  person.age = 29;
  console.log(person.age);//undefined
  delete person.name;
  console.log(person.name);//deniro
</script>

運行結(jié)果：

跟不可擴展對象相似，在非嚴格模式下，刪除對象的已有成員會靜默失敗；而在嚴格模式下，會拋出錯誤。

3 凍結(jié)的對象

對象的最嚴格的防篡改級別是凍結(jié)！凍結(jié)的對象既不能擴展，又是密封的，而且對象的數(shù)據(jù)屬性[[Writable]]被設(shè)置為 false，即屬性值無法被修改：

<script type="text/javascript">
  var person = {name: "deniro"};
  console.log(Object.isExtensible(person));//true
  console.log(Object.isSealed(person));//false
  console.log(Object.isFrozen(person));//false
  Object.freeze(person);
  console.log(Object.isExtensible(person));//false
  console.log(Object.isSealed(person));//true
  console.log(Object.isFrozen(person));//trueo
  person.age = 29;
  console.log(person.age);//undefined
  delete person.name;
  console.log(person.name);//deniro
  person.name = "lily";
  console.log(person.name);//deniro
</script>

運行結(jié)果：