码迷,mamicode.com
首页 > 其他好文 > 详细

es5 新增对象介绍

时间:2016-07-10 23:22:44      阅读:755      评论:0      收藏:0      [点我收藏+]

标签:

  我们都知道在js里对象是很容易改变的

var obj1 ={
      a:‘111‘  
}

obj1.a = ‘222‘;
console.log( obj.a ) //output 222 对象的属性发生了变化

现在我们来看看es5 给我提供一个对象的新方法冻结对象(浅冻结)。

Object.freeze(obj) obj是要冻结的对象,Object.freeze()可以防止对象新增属性或方法,防止删除和修改现有的属性和方法。他其实就是让对象变成不可变的数据;

 var obj = {
        a:‘111‘
    }
    Object.freeze( obj );

     obj.a = ‘222‘

    console.log( obj.a ); //output 依然是 111 严格模式下会报错  不可修改


   obj.b = ‘222‘;
    console.log( obj.b ) //output undefined 严格模式下会报错 不可新增

delete obj.a;

console.log( obj.a ) // output 依然是111 严格模式下会报错 不可删除

熟悉js对象(深浅)拷贝的朋友就知道想jQuery extend 的方法第一个参数如果出入的是布尔值true 代表深拷贝,如果忽略直接传入多个对象就代表浅拷贝。其实对象的冻结也是有深冻结和浅冻结之分的。

var obj = {
   a:{
     achild:‘deep‘  
    }  
}

Object.freeze(obj);

//我现在来改变obj对象a下的achild验证一下 Object.freeze()是否还灵验

obj.a.achild = ‘no effect‘;

console.log( obj.a.achild ) //output no effect; 果然是可以改变的。

obj.a.otherchild = ‘otherchild‘;

console.log(  obj.a.otherchild) //output otherchild 也可以新增 

delete obj.a.otherchild ;
console.log(  obj.a.otherchild) // output undefine obj.a.otherchild 不见了真名删除也是有效的

通过上面的例子我们可以发现Object.freeze(obj) 只可以浅冻结对象 obj.a(浅) obj.a.achild(深)

 那我们想深冻结一个对象怎么办?我也可以通过Object.freeze()的特性自己创建一个深冻结函数。

function deepFreeze(obj) {


  var propNames = Object.getOwnPropertyNames(obj);

  
  propNames.forEach(function(name) {
    var prop = obj[name];


    if (typeof prop == ‘object‘ && prop !== null)
      deepFreeze(prop);
  });

  return Object.freeze(obj);
}

//现在我们来试验一下我们的函数
var obj = {
    a:{}
}
deepFreeze(obj);

obj.a.achild = ‘achild‘ 

console.log( obj.a.achild ) //output undefine 现在实现了深冻结一个对象了

参考文章链接

 

 

es5 新增对象介绍

标签:

原文地址:http://www.cnblogs.com/cqsjs/p/5658610.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!