前言

  权威指南中摘要的,工作中用不到的,非常重要的js基础。

三类对象两类属性

  内置对象(native object) 是由ECMScript规范定义的对象或者类。例如:函数,数组,日期,正则…

  宿主对象(host object) 是由js编译器所嵌入的宿主环境(web浏览器)所定义的。比如客户端js中表示网页结构的HTMLElement对象就是宿主环境创建的对象。宿主环境定义的对象可以直接使用的话,我们也可以把它们当做内置对象。

  自定义对象(user-defined object) 由运行中的js创建的对象。

  自有属性(own property) 直接在对象当中定义的属性,区别于继承属性。

  继承属性(inherited property) 在对象原型中定义的属性。

属性描述符对象

  ES5中定义了一个属性描述符对象(property descriptor)。这个对象属性和他们所描述的属性特性是同名的。

  value:属性的值值。

  writable:可写性,是否可以设置值。

  enumerable:可枚举性,遍历对象时该属性会不会出现。

  configurable:可配置性。

获取自有属性的属性描述符对象Object.getOwnPropertyDescriptor()

// 当我们为对象创建属性时如果没有指定属性描述符,那就都是默认的 可枚举,可配置,可读写,
var
obj = { name:"小花" } console.log(Object.getOwnPropertyDescriptor(obj,"name"));
 {value: “小花”, writable: true, enumerable: true, configurable: true}

定义属性描述符对象Object.defineProperty(obj,attributeName,PropertyDescriptor)

// 定义cat的name属性为不可枚举(此后使用for in 遍历对象属性时,name不会出现),value为小花
var cat = {};
Object.defineProrerty(cat , "name",{
    value:"小花",
    enumerable:false
})

同时定义或修改对象的多个属性及其描述符Object.defineProperties()

// 参数一是目标对象,参数二是属性为键描述符为值的对象
var cat = Object.defineProperties({},{
    name:{value:"小花"},
    age:{value:6},
    // 值为大菊,不可写
    type:{value:"大菊",writable:false},
    // 存取器特性替代属性值value,不可枚举
    date:{
        get:function(){return [this.name,this.age]},
        enumerable:false
    }
})

使用属性描述符实现jq中$.extend方法的部分功能:

  1,给根对象Object的原型拓展一个extend方法。

  2,接收要复制的目标对象,将他的属性和属性特性复制到调用对象。

  3,复制规则:存在同名属性时保留原有属性,复制目标对象上的一切可枚举自有属性。

Object.defineproperty(Object.prototype,"extend",{
    enumerable:false,
    value:function(o){
        // 得到O对象的所有自有属性名称列表
        var proNames = Object.getOwnPropertyNames(o);
        // 排除已存在属性
        for(var i = 0; i < proNames.length; i++){
            if(proNames[i] in this) continue;
            // 获取该属性的属性描述符对象
            var desc = Object.getOwnpropertyDescriptor(o,proName[i]);
            // 将属性copy到调用对象
            Object.defineProperty(this,proName[i],desc);
        }
    }
})

小结:

  》三类对象:内置对象,宿主对象,自定义对象。

  》两类属性:自有属性,继承属性。

  》属性每个属性都拥有属性描述符对象,不显示定义属性的描述符对象时,他们默认都是可读写,可枚举,可配置的。

  》ES5提供了两个API用来定义或修改属性及其描述符:

    获取指定对象指定属性的属性描述符对象:Object.getOwnPropertyDescriptor()

    同时定义多个属性及其描述符:Object.defineProperties() 

    定义单个属性及其描述符:Object.defineProperty(obj,attributeName,PropertyDescriptor)

  》js中的普通对象能够从根对象上继承到它提供的属性方法。我们基于这个特性为根对象创建了一个extend方法可以用来复制其他对象上的自有可枚举属性。

  

  

版权声明:本文为keliguicang原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://www.cnblogs.com/keliguicang/p/10960263.html