zoukankan      html  css  js  c++  java
  • 3/6 JS对象 数据属性 和 访问器属性

    写在前面

      有错请给我说一哈

      ...


    数据属性

      数据属性中 有两个 和 访问器属性 有交叉 交叉的是 [[Configurable]] [[Enumerable]]

      数据属性 分为 [[Configurable]] [[Enumerable]] [[Writable]] [[Value]]

      下面有一个比较长的代码来分别测试 他们的作用

      这些属性都不能直接修改 必须通过 Object.defineProperty来修改

      [[Value]] 就是设置值...这个不用讲...

    // [[Configurable]] [[Enumerable]] [[Writable]] [[Value]] 内部属性能不能修改 “数据属性”
    // 可以通过 Object.defineProperty 改变
    
    // [[Configurable]] 主要是让某个属性 是否可以进行配置 :delete、修改value等 ( configure的意思 ) 
    let person_1 = new Object();
    Object.defineProperty(person_1,"name",{
        configurable : false,
        value : "Yang", // 设置属性 name 的值
    })
    person_1.name = "YangErzi"; // 检测是否可以 修改属性
    delete person_1.name;       // 检测是否可以 删除属性
    person_1.sex = "female";    // 验证其他的属性 是否会受影响
    person_1.sex = "male";
    console.log(person_1);      // {sex:"male",name:"Yang"}
    
    // [[Enumerable]] 是否可以用FOR-IN来枚举对象中的属性 只要设置了这个值 除非用 hasOwnProperty 不然该属性虽然可以访问 但是某些方法是访问不到的
    let person_2 = new Object();
    Object.defineProperty(person_2,"name",{
        enumerable:false,
        value:"Yang",
    })
    person_2.sex = "female";
    console.log(person_2); // {sex:"female",name:"Yang"}
    // 验证是否name属性可以被枚举出来
    for (const key in person_2) {
        if (Object.hasOwnProperty.call(person_2, key)) {
            console.log(key+":"+person_2[key]);
        }
    } // sex:female
    // 验证key是否存在 name 
    console.log(person_2.hasOwnProperty("name")); // true
    // 验证person_2的key多少个
    console.log(Object.keys(person_2)); // ["sex"]
    
    // [[Wirtable]] 属性设置为只读 不能修改 与 Configure 有些时候有冲突
    let person_3 = {name:"Yang"};
    Object.defineProperty(person_3,"name",{
        writable:false,
    })
    person_3.name = "YangNazi"; // 验证是否可以修改
    console.log(person_3); // {name:"Yang"}
    // 与 Configurable 起冲突的情况
    Object.defineProperty(person_3,"sex",{
        configurable:false,
        value:"female",
    })
    // 以下代码会报错 Uncaught TypeError: Cannot redefine property: sex
    // 不能够重新定义属性 sex
    Object.defineProperty(person_3,"sex",{
        writable:false,
        value:"male",
    })
    // 在多次指定同一个属性的时候 第一次设置了 configurable 为 false 后面的无论设置什么都会报错
    console.log(person_3); // {name:"Yang"}
    
    // 默认情况: 在调用 defineProperty 什么都没有说明的时候 是全部设置为false

    访问器属性

      访问器属性有

      [[Configurable]] [[Enumerable]] [[Get]] [[Set]]

      和面向对象编程的那个东西很像

      前两个就不做说明了 前面的一坨代码 已经写得比较清楚了

      对于Get 和 Set 来说

      感觉作用不是很大 最主要的作用还是 我觉得就是 调整数据结构

      对于 高级程序设计 的例子来说 

    let person_4 = {
        name_:"Yang",
        times:0, // 改名次数
    }
    Object.defineProperty(person_4,"name",{
        get(){
            return this.name_;
        },
        set(newValue){
            this.name_ = newValue; // 注意这里是 this.name_
            this.times += 1; // 每一次 修改 改名次数加一
        }
    })
    
    console.log(person_4.name); // Yang
    person_4.name = "YangNaizi";
    console.log(person_4.name); // YangNazi
    console.log(person_4.times); // 1;

    总结

      道阻且长

      ...

      

    Let it roll
  • 相关阅读:
    用IIS做宿主的WCF服务
    Apache+mono+xsp搭建Linux下的asp.net平台
    web页面中的卡片布局代码
    GridView内的数据循环滚动
    adb 无法启动问题
    User interface
    动态生成linearLayout
    跳转到下一个activity
    android studio 快捷键
    [转]项目失败的经验
  • 原文地址:https://www.cnblogs.com/WaterMealone/p/14492051.html
Copyright © 2011-2022 走看看