ECMAScript5之Object学习笔记(二)
继续第二部分
Object.freeze(obj)
看字面意思就是“把一个对象冻结”。
下面我们来看个简单的例子以作说明:
// a person instance
var person = {
name: 'Andrew',
job: 'sales manager'
}; // before freeze
// existing properties maybe be changed or removed, new properties may be added
person.name = 'Bruce';
person.age = 30; console.log(person.name); // Bruce
console.log(person.age); // // freeze the person
Object.freeze(person); // isFrozen
console.log( Object.isFrozen(person) ); // true // after freeze
// fail silently, or strict mode throw a TypeError
person.name = 'James';
person.age = '35';
person.gender = 'male'; console.log(person.name); // Bruce
console.log(person.age); //
console.log(person.gender); // undefined
上面例子的特点是,person对象的属性像name,job,age的值都是“字面值”,并非对象,如果存在一个属性,其值是一个对象呢?
我们再来一个例子:
// a person again
var person = {
name: {
firstname: 'Bruce',
lastname: 'Lee'
},
age: 35,
job: 'sales manager',
children: ['lucy', 'linda']
}; console.log('name:' + person.name.firstname + ' ' + person.name.lastname); // name:Bruce Lee
console.log('children:' + person.children); // lucy, linda // freeze the person
Object.freeze(person); // has been frozen!
console.log(Object.isFrozen(person)); // change name
person.name.firstname = 'Andrew';
person.name.lastname = 'Carnegie'; // add one more child
person.children.push('Tom'); console.log('name:' + person.name.firstname + ' ' + person.name.lastname); // name:Andrew Carnegie
console.log('children:' + person.children); // lucy, linda, Tom
通过上面的2个例子,我们很容易得出结论。那么我们如何做到“深层”freeze呢。
就要用到一个递归函数,来让里面的每个对象都被freeze:
function deepFreeze(o) {
var prop, propkey;
Object.freeze(o);
for(propkey in o) {
prop = o[propkey];
if( !o.hasOwnProperty(propkey) || !(typeof prop === 'object') || Object.isFrozen(prop) ) {
continue;
}
// Recursively call deepFreeze
deepFreeze(prop);
}
};
// if we use deepFreeze to replace with Object.freeze in the previous example,
// then nothing will happen, even person's properties(aka. name, age, children ) are changed
利用的deepFreeze方法,我们就可以把person对象的属性全部“冻结”。
搞清楚Object.freeze的用途后,我们继续来了解下Object.seal
Object.seal(obj)
seal从字面意思上理解有“密封”的意思,我依旧通过例子来说明:
// a person again
var person = {
name: 'Andrew',
age: 25,
children: ['Tom'],
edu: {
major: 'computer science',
university: 'Yale'
}
}; // before seal
// new properties may be added, exisiting properties may be changed or removed
person.name = 'Bruce';
person.gender = 'male';
delete person.age; // looking up the structure
console.dir(person); // seal the person
Object.seal(person); // has been sealed
console.log( Object.isSealed(person) ); // true // after seal
// existing (writable) properties can be changed
person.name = 'Jackson';
console.log(person.name); // Jackson // or change value through Object.defineProperty
Object.defineProperty(person, 'name', {value: 'Ann'});
console.log(person.name); // Anna // add one more child
person.children.push('lucy');
console.log(person.children); // tom, lucy // internal object is still extensible, unless you seal it too (eg. Object.seal(person.edu) )
person.edu.degree = 'master';
console.log(person.edu.degree); // master // silently fail or in strict mode throw TypeError
// when add or delete property
person.job = 'Front End Developer';
delete person.name;
// TypeError when add property through Object.defineProperty
Object.defineProperty(person, 'job', {value: 'teacher'}); // TypeError
通过上面的例子,我们可以看到,seal一个对象后,使得它不可扩展,但是其属性值(该属性writable为true)是 可以改变的。还有一点就是若其属性是一个对象,姑且叫内部对象吧,那么这个内部对象还是可以进行扩展的,除非写一个递归的deepSeal方法, 这个可以参考上面的deepFreeze
第二部分就到这里,感兴趣的同学可以前往MDN查看,Object.freeze,Object.seal。
ECMAScript5之Object学习笔记(二)的更多相关文章
- ECMAScript5之Object学习笔记(一)
随着IE的逐步追赶,目前到IE11已经能够很好的支持ECMAScript5标准了,其他的现代浏览器像firefox,chrome,opera就更不用说了. 再加上nodejs使得javascript在 ...
- ECMAScript5之Object学习笔记(三)
第三部分继续... Object.getOwnPropertyDescriptor(obj, prop) 获取一个对象的属性描述符 根据"Own"这个词我们可以猜到,prop只能是 ...
- JavaScript Object学习笔记二
Object.create(proto, [propertiesObject])//创建对象,使用参数一来作为新创建对象的__proto__属性,返回值为在指定原型对象上添加自身属性后的对象 //参数 ...
- WPF的Binding学习笔记(二)
原文: http://www.cnblogs.com/pasoraku/archive/2012/10/25/2738428.htmlWPF的Binding学习笔记(二) 上次学了点点Binding的 ...
- AJax 学习笔记二(onreadystatechange的作用)
AJax 学习笔记二(onreadystatechange的作用) 当发送一个请求后,客户端无法确定什么时候会完成这个请求,所以需要用事件机制来捕获请求的状态XMLHttpRequest对象提供了on ...
- JMX学习笔记(二)-Notification
Notification通知,也可理解为消息,有通知,必然有发送通知的广播,JMX这里采用了一种订阅的方式,类似于观察者模式,注册一个观察者到广播里,当有通知时,广播通过调用观察者,逐一通知. 这里写 ...
- Typescript 学习笔记二:数据类型
中文网:https://www.tslang.cn/ 官网:http://www.typescriptlang.org/ 目录: Typescript 学习笔记一:介绍.安装.编译 Typescrip ...
- 学习笔记(二)--->《Java 8编程官方参考教程(第9版).pdf》:第七章到九章学习笔记
注:本文声明事项. 本博文整理者:刘军 本博文出自于: <Java8 编程官方参考教程>一书 声明:1:转载请标注出处.本文不得作为商业活动.若有违本之,则本人不负法律责任.违法者自负一切 ...
- ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring
接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...
随机推荐
- iOS 9应用开发教程之iOS 9新特性
iOS 9应用开发教程之iOS 9新特性 iOS 9开发概述 iOS 9是目前苹果公司用于苹果手机和苹果平板电脑的最新的操作系统.该操作系统于2015年6月8号(美国时间)被发布.本章将主要讲解iOS ...
- DHTML参考手册
中文DHTML参考手册 本dhtml教程由宏博内容管理系统为它的Smarty模板制作者收集的,目的是可以做出更加精美的模板.下面列出了由动态 HTML 定义的对象.DHTML中文参考手册,实用dhtm ...
- xml javascript
1.XMLHttpRequest对象 创建XMLHttpRequest对象 xmlhttp=new XMLHttpRequest(); ##老版本的 Internet Explorer (IE5 和 ...
- 洛谷.3803.[模板]多项式乘法(NTT)
题目链接:洛谷.LOJ. 为什么和那些差那么多啊.. 在这里记一下原根 Definition 阶 若\(a,p\)互质,且\(p>1\),我们称使\(a^n\equiv 1\ (mod\ p)\ ...
- nginx与Lua执行顺序
Nginx顺序 Nginx 处理每一个用户请求时,都是按照若干个不同阶段(phase)依次处理的,而不是根据配置文件上的顺序. Nginx 处理请求的过程一共划分为 11 个阶段,按照执行顺序依次是 ...
- 【转】说下lua使用场景
[今日话题]说下lua使用场景 – flea 1. 我们有用,一些逻辑相对简单,没有复杂的数据交互,访问频次超高的接口实现,可以用lua,省得用phpfpm,太重,浪费资源. – 付坤 2. 也可 ...
- bzoj 1492
这道题真好... 首先,感觉像DP,但是如果按照原题意,有无数个状态,每个状态又有无数个转移. 然后思考,我们每次买一部分和卖一部分的原因是什么,如果没有那个比例(就是rate=1恒成立),那么很容易 ...
- PyQt QString 与 Python str&unicode
昨日,将许久以前做的模拟网页登录脚本用PyQt封装了一下,结果出大问题了, 登录无数次都提示登录失败!!而不用PyQt实现的GUI登录直接脚本登录无数次都提示登录成功!!心中甚是伤痛,于是探究起来,解 ...
- Codeforces Round #352 (Div. 1) A. Recycling Bottles 暴力
A. Recycling Bottles 题目连接: http://www.codeforces.com/contest/671/problem/A Description It was recycl ...
- Codeforces Round VK Cup 2015 - Round 1 (unofficial online mirror, Div. 1 only)E. The Art of Dealing with ATM 暴力出奇迹!
VK Cup 2015 - Round 1 (unofficial online mirror, Div. 1 only)E. The Art of Dealing with ATM Time Lim ...