美文网首页
javascript 对象属性

javascript 对象属性

作者: 请输入其他名字 | 来源:发表于2016-12-23 13:44 被阅读10次

先举个栗子(~ ̄▽ ̄)~
在js中为一个对象添加属性我们可以这样

var Person = {};
Person.name = 'zane';

// 等价于
var Person = {
  name = 'zane'
}

javascript对象的属性可以分为两类:
(1)数据属性:包含一个数据值得位置,在这个位置可以读取和写入值。有4个特性:

configrable:  true/false; //能否通过delete删除
enumerable: true/false; //能否通过for-in返回
writable: true/false; //能否修改
value:值

(2)访问器属性:访问器属性不包含值得位置,而是包含一对getter、setter函数,取值和赋值是通过这对函数操作。同样有四个特性:

configrable:  true/false; //能否通过delete删除
enumerable: true/false; //能否通过for-in返回
get //读取属性时调用函数  默认值:undefined
set //写入属性时调用函数  默认值:undefined

configrable/
可以看出上面例子中Person的name属性是直接赋值的,所以是数据属性,
数据属性可以直接定义,而访问器属性不能直接定义。

接下来说明一下在JavaScript中如何使用上面说的几种特性
Object.defineProperty(obj, 'property', {})

/* 数据属性*/
var Person = {};
Object.defineProperty(Person, 'name', {
    configurable: false,
    writable: false,
    enumerable: true,
    value: 'Zane'
});
console.log("原name: "+Person.name);  // 原name: Zane
Person.name = "xiaoming";
console.log("更改后name: "+Person.name); // 更改后name: Zane
delete Person.name;
console.log("删除后name: "+Person.name); // 删除后name: Zane
    
for(var key in Person) {
    console.log(key);
}
// name
/* 访问器属性 */
var Book = {
    _year: 2014,
    edition: 1
}
Object.defineProperty(Book, 'year', {
    get: function () {
        return this._year;
    },
    set: function (value) {
        if(value > 2014) {
            this._year = value;
            this.edition = value - 2014 + 1;
        }
    }
})
Book.year = 2016;
console.log(Book); // Object {_year: 2016, edition: 3}

如何同时定义多个属性呢

var Book = {};
Object.defineProperties(Book, { // 注意是复数 defineProperties
    _year: {
        value: 2014
    },
    edition: {
        writable: true,
        value: 1
    },
    year: {
        get: function () {
            return this._year;
        },
        set: function (value) {
            if(value > 2014) {
                this._year = value;
                this.edition = value - 2014 + 1;
            }
        }
    }
});
var descriptor = Object.getOwnPropertyDescriptor(Book, '_year');
console.log(descriptor.writable);  // fales

相关文章

  • js的prototype

    javascript中的每个对象都有prototype属性,Javascript中对象的prototype属性的解...

  • JavaScript - prototype理解

    Javascript中的每个对象都有prototype属性,Javascript中对象的prototype属性的解...

  • JavaScript学习笔记7_对象_2对象属性

    属性检测 JavaScript对象是属性的集合,我们经常需要判断某个属性是否存在于某个对象中。JavaScript...

  • JavaScript对象属性

    JavaScript对象属性 简单理解对象 运行环境 node V10.16.3 对象属性 数据属性数据属性包含...

  • javascript对象的遍历、内存分布和封装特性

    javascript对象的遍历、内存分布和封装特性 一、javascript对象遍历 1.javascript属性...

  • 继承与原型链(笔记)

    JavaScript 对象是动态的属性“包”(指其自己的属性)。JavaScript 对象有一个指向一个原型对象的...

  • Javascript全局属性和方法

    JavaScript 全局属性和方法 JavaScript 可用于创建Javascript对象。 CONTENT ...

  • javascript对象

    Javascript 对象总结: JavaScript对象可以看作是属性的无序集合,每个属性就是一个键值对,可增可...

  • 原型与原型链

    JavaScript中,每个对象都有constructor属性和proto属性,其中proto属性指向创建该对象的...

  • javascript 对象属性

    先举个栗子(~ ̄▽ ̄)~在js中为一个对象添加属性我们可以这样 javascript对象的属性可以分为两类:(1)...

网友评论

      本文标题:javascript 对象属性

      本文链接:https://www.haomeiwen.com/subject/ymrkvttx.html