随着IE的逐步追赶,目前到IE11已经能够很好的支持ECMAScript5标准了,其他的现代浏览器像firefox,chrome,opera就更不用说了。

再加上nodejs使得javascript在后台开发中得到施展的舞台,这很自然的激发了我对ECMAScript5相关的特性的求知欲望。

以此展开,写一个ECMAScript5新特性的学习笔记。

先来看看Object

  • Object.create(proto[, propertiesObject])

    create方法通过指定的原型对象(prototype object)和属性(properties)来创建一个新的对象。

    proto:即为新创建对象的prototype

    propertiesObject:带属性描述的属性对象(姑且这么翻译)

    create方法能够让我们方便的通过prototype原型链来实现“继承”:

    1. // super class
    2. var Human = function(cfg) {
    3. this.gender = cfg.gender;
    4. this.name = cfg.name;
    5. };
    6.  
    7. Human.prototype.sayHello = function() {
    8. console.log('Hello, I am ' + this.name);
    9. };
    10.  
    11. // sub class
    12. var Citizen = function(cfg) {
    13. this.country = cfg.country;
    14. // call super constructor
    15. Human.call(this, cfg);
    16. };
    17.  
    18. // prototype chain inherit
    19. Citizen.prototype = Object.create(Human.prototype);
    20. // override constructor
    21. Citizen.prototype.constructor = Citizen;
    22.  
    23. // overwrite super class method
    24. Citizen.prototype.sayHello = function() {
    25. console.log('Hello, I am ' + this.name + ' from ' + this.country);
    26. };
    27.  
    28. var h = new Human({
    29. gender: 'female',
    30. name: 'lucy'
    31. });
    32. h.sayHello();
    33. console.log( h instanceof Human );
    34.  
    35. var c = new Citizen({
    36. gender: 'male',
    37. name: 'Andrew',
    38. country: 'USA'
    39. });
    40. c.sayHello();
    41. console.log( c instanceof Citizen);
  • Object.defineProperty(obj, prop, descriptor)

    defineProperty方法直接在一个对象上定义一个新属性,或者更改一个已存在的属性,返回对象本身。

    obj:对象

    prop: 属性名

    descriptor: 属性描述对象

    用code来做直观说明:

    1. /*
    2. enumerable 是否可列举 默认:false
    3. writable 是否可写 默认:false
    4. configurable是否可配置 默认:false
    5. value 默认:undefined
    6.  
    7. 访问器
    8. get 默认:undefined
    9. set 默认:undefined
    10. */
    11. var o = {};
    12.  
    13. // enumerable 是否可列举
    14. Object.defineProperty(o, 'a', {
    15. value: 1,
    16. enumerable: false
    17. });
    18.  
    19. Object.defineProperty(o, 'b', {
    20. value: 2,
    21. enumerable: true
    22. });
    23.  
    24. Object.defineProperty(o, 'c', {
    25. value: 3
    26. // enumerable默认false
    27. });
    28.  
    29. o.d = 4;
    30.  
    31. for(var prop in o) {
    32. // 输出b、d
    33. console.log(prop);
    34. }
    35.  
    36. // writable 是否可写(更改值)
    37. // 这个特性在定义常量时比较有用
    38. Object.defineProperty(o, 'e', {
    39. value: 10,
    40. writable: false
    41. });
    42.  
    43. console.log(o.e); //
    44. o.e = 15; // 一般没错误抛出,若是在strict mode(严格模式下)会抛出错误
    45. console.log(o.e); //
    46.  
    47. // configurable 是否可配置
    48. Object.defineProperty(o, 'f', {
    49. configurable: true,
    50. get: function() { return 10; }
    51. });
    52.  
    53. // 如果configurable为false,那么下面这些redefine(重定义)操作都会报TypeError
    54. // 如果configurable为true,那么下面这些操作均能成功,delete操作也能删除e属性
    55. Object.defineProperty(o, 'f', { configurable: true }); // TypeError
    56. Object.defineProperty(o, 'f', { enumerable: true }); // TypeError
    57. Object.defineProperty(o, 'f', { set: function() {} }); // TypeError
    58. Object.defineProperty(o, 'f', { get: function() {return 10;}}); //TypeError
    59. Object.defineProperty(o, 'f', { value: 12}); // TypeError
    60.  
    61. console.log(o.f); //
    62. delete o.f; // nothing happens
    63. console.log(o.f); //
    64.  
    65. // get, set访问器
    66. // 注意:有get、set的情况下,不能同存在value,writable属性,否则会报错
    67. var variable = 10;
    68. Object.defineProperty(o, 'g', {
    69. get: function() {
    70. return variable;
    71. },
    72. set: function(val) {
    73. variable = val;
    74. }
    75. });
    76.  
    77. console.log(o.g); //
    78. o.g = 14; // set(14)
    79. console.log(o.g); //
    80.  
    81. // 补充:
    82. o.h = 1;
    83. // 相当于:
    84. Object.defineProperty(o, 'h', {
    85. value: 1,
    86. writable: true,
    87. configurable: true,
    88. enumerable: true
    89. }) ;
    90.  
    91. Object.defineProperty(o, 'h', { value: 1 });
    92. // 相当于:
    93. Object.defineProperty(o, 'h', {
    94. value: 1,
    95. writable: false,
    96. configurable: false,
    97. enumerable: false
    98. });
  • object.defineProperties(obj, props)

    这个与defineProperty的区别在于一下子可以定义多个属性,就再不展开了。

第一部分暂时到这里结束 : ),感兴趣的同学可以直接去MDN进行了解,请点击这里

ECMAScript5之Object学习笔记(一)的更多相关文章

  1. ECMAScript5之Object学习笔记(三)

    第三部分继续... Object.getOwnPropertyDescriptor(obj, prop) 获取一个对象的属性描述符 根据"Own"这个词我们可以猜到,prop只能是 ...

  2. ECMAScript5之Object学习笔记(二)

    继续第二部分 Object.freeze(obj) 看字面意思就是“把一个对象冻结”. 下面我们来看个简单的例子以作说明: // a person instance var person = { na ...

  3. Object学习笔记

    <script type="text/javascript"> function forEach(o){ var html =""; for(var ...

  4. [javascript|基本概念|Object]学习笔记

    对象:数据和功能的集合 创建对象:new 对象类型名称 e.g.: var o = new Object(); 或 var o = new Object(省略(),不推荐) 或 var o = {}( ...

  5. JavaScript Object学习笔记二

    Object.create(proto, [propertiesObject])//创建对象,使用参数一来作为新创建对象的__proto__属性,返回值为在指定原型对象上添加自身属性后的对象 //参数 ...

  6. JavaScript Object学习笔记一

    Object.assign(target, source1, source2, ...)//用于对象的复制合并(同名属性后覆盖前)或拷贝(拷贝自身可枚举属性,不拷贝继承属性或不可枚举属性),将sour ...

  7. Object C学习笔记24-关键字总结

    学习Object C也有段时间了,学习的过程中涉及到了很多Object C中的关键字,本文总结一下所涉及到的关键字以及基本语法. 1.  #import #import <> 从syste ...

  8. Object C学习笔记22-#define 用法

    上一篇讲到了typedef 关键字的使用,可以参考文章 Object C 学习笔记--typedef用法 .而在c中还有另外一个很重要的关键字#define. 一. #define 简介 在C中利用预 ...

  9. Object C学习笔记21-typedef用法

    在上一章的学习过程中遇到了一个关键字typedef,这个关键字是C语言中的关键字,因为Object C是C的扩展同样也是支持typedef的. 一. 基本作用 typedef是C中的关键字,它的主要作 ...

随机推荐

  1. 机器学习之路: python 朴素贝叶斯分类器 MultinomialNB 预测新闻类别

    使用python3 学习朴素贝叶斯分类api 设计到字符串提取特征向量 欢迎来到我的git下载源代码: https://github.com/linyi0604/MachineLearning fro ...

  2. 验证码60s倒计时前端效果

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 慎用 new、delete

    C++ STL 为我们提供了一套容器.在多数情况下,这套容器已足够让我们使用.所以,需要我们自己去用 new/new []/delete/delete [] 来管理内存的必要性并不是很大.此外,自己管 ...

  4. 鸟哥的私房菜:Linux磁盘与文件系统原理

    1 硬盘物理组成     //原理 磁头负责读写     磁道(硬盘同半径的一圈) 磁柱(所有盘磁道叠加起来的柱)     扇区(2条半径将磁道分开的一个扇形区域,是磁盘的最小存储单位) ------ ...

  5. [LearnOpenGL]照相机的变换、坐标系、摄像机

    前言 跟着LearnOpenGL上学着做项目,的确对于知识掌握得更清晰一些了. 第一个项目 第一个项目,是关于简单的熟悉矩阵变换的,创建了10个立方体,代码如下. // 视图矩阵,看作是一个照相机 g ...

  6. Codeforces Round #349 (Div. 1) A. Reberland Linguistics 动态规划

    A. Reberland Linguistics 题目连接: http://www.codeforces.com/contest/666/problem/A Description First-rat ...

  7. GIT(1)----更新代码和上传代码操作的步骤

    1.第一次下载代码 a.首先获得下载的地址,可从服务器,或者GitHut上获得.例如http://100.211.1.110:21/test/test.git b.终端里切换到想要将代码存放的目录,在 ...

  8. 如何使用git工具向github提交代码

    大致分为以下几个步骤 安装git环境,工具使用msysgit github上的账号 首先在github上点击头像旁边的加号 add new ,选择new Repository,自己创建一个名字,假设取 ...

  9. Oracle sql语句中(+)作用

    select * from operator_info o, group_info g  where o.group_id = g.group_id(+); 理解:    + 表示补充,即哪个表有加号 ...

  10. Spring源码解析 – @Configuration配置类及注解Bean的解析

    在分析Spring 容器创建过程时,我们知道容器默认会加载一些后置处理器PostPRocessor,以AnnotationConfigApplicationContext为例,在构造函数中初始化rea ...