继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

初始JavaScript的对象属性类型

木易涛童鞋
关注TA
已关注
手记 28
粉丝 36
获赞 1649
  • 何为对象?
    简单点说,对象包含属性或方法,而对象的每个属性或方法都有一个名字,这个名字又都映射到一个值。

    所以,对象就是一组名值对(键值对),其中值可以是数据或函数。

    每个对象都是基于一个引用类型创建的,这个引用类型可以是原生类型,也可以是自定义类型。

  • 创建自定义对象
    创建一个Object的实例:

varperson = new Object();
person.name = "Bob";
person.age = 24;
person.job = "Teacher";

person.sayName = function() {
    alert(this.name);
};

用对象字面量重新创建对象:


var person = {
    name: "Bob",
    age: 24,
    job: "Teacher",

    sayName: function() {
        alert(this.name);
    }
};
}

用两种方式创建的person 对象都有相同的属性和方法。

  • 属性类型
    属性类型分为数据属性和访问器属性。

    数据属性有4个特性:

  • [[Configurable]]

  • [[Enumerable]]

  • [[Writable]]

  • [[Value]]

    访问器属性也有4个特性,不包含数据值,包含一对儿getter和setter函数:

  • [[Configurable]]

  • [[Enumerable]]

  • [[Get]]

  • [[Set]]

  • 修改属性默认的特性:Object.defineProperty()方法
    接受三个参数:
    1.属性所在的对象;
    2.属性的名字;
    3.一个描述符对象;

数据属性例子


var person = {};
Object.defineProperty(person, "name", {
    writeable: false,
    configurable: false,
    value: "Bob"
});

alert(person.name);           //"Bob"
person.name = "Mike";
alert(person.name);            //"Bob"    

例子中创建了一个名为name的属性,由于writable设置为false,name的值是“只读”的,不可修改;

把configurable设置为false,表示不能从对象中删除(delete)属性,而且,一旦把属性定义为不可配置的,再次调用Object.defineProperty()方法修改writable之外的特性,会导致错误。

在调用Object.defineProperty()方法时,如果不指定,configurable、 enumerable、 writable特性的默认值都是false;

如果不调用Object.defineProperty()方法时,即直接在对象上定义的属性,他们的configurable enumerable writable特性的默认值都是truevalue特性为指定的值(默认值为undefined);


getter setter 方法


var person = {
    name: "Bob",
    job: "Teacher",

    get age() {
        return new Date().getFullYear() - 1992;
    },
    set age(val) {
        alert("Age can\'t be set to " + val);
    }
}

alert(person.age);      //24
person.age = 100;      //Age can't be set to 100
alert(person.age);     //still 24

以上代码创建了一个person对象,并定义了两个默认的属性:name和job,而且包含有一个getter函数和一个setter函数。

getter函数返回age的值;
setter函数返回设置age的值val;


  • 定义多个属性:Object.defineProperties()方法
    接受两个对象参数:
    1. 第一个对象是要添加和修改其属性的对象;
    2. 第二个对象的属性与第一个对象中药添加或修改的属性一一对应。
      例如:

var book = {};
Object.defineProperties(book, {
    _year: {
        writable: true,
        value: 2016
    },

    edition: {
        writable: true,
        value: 1
    },

    year: {
        get: function() {
            return this._year;
        },
        set: function(val) {
            if(val > 2016) {
                this._year = val;
                this.edition += val - 2016;
            }
        }
    }
});
console.log(book.year);    //2016
console.log(book.edition);    //1
book.year = 2018;
console.log(book.edition);    //3

以上代码在book对象上定义了两个数据属性(_year和edition)和一个访问器属性(year)。


  • 读取属性的特性Object.getOwnPropertyDescriptor()方法
    接受两个参数:
    1. 属性所在的对象;
    2. 要读取其描述符的属性名称。
      返回值是一个对象:
      如果是数据属性,对象的属性有configurable 、enumerable、 writable、value
      如果是访问器属性,对象的属性有configurable 、enumerable、 get、set
      例如:

                var book = {};
                Object.defineProperties(book, {
                _year: {
                    value: 2016
                },

                edition: {
                    value: 1
                },

                year: {
                    get: function() {
                        return this._year;
                    },
                    set: function(val) {
                        if(val > 2016) {
                            this._year = val;
                            this.edition += val - 2016;
                        }
                    }
                }
            });

            var descriptor = Object.getOwnPropertyDescriptor(book, "_year");
            console.log(descriptor.value);    //2016
            console.log(descriptor.configurable);    //false
            console.log(typeof descriptor.get);      //undefined

            var descriptor = Object.getOwnPropertyDescriptor(book, "year");
            console.log(descriptor.value);           //undefined
            console.log(descriptor.enumerable);      //false
            console.log(typeof descriptor.get);      //function   

对于数据属性_year,value等于最初的值,configurable是false,而get等于undefined;

对于访问器属性year,value等于undefined,enumerable是false,而get是一个指向getter函数的指针。

打开App,阅读手记
3人推荐
发表评论
随时随地看视频慕课网APP