zoukankan      html  css  js  c++  java
  • js面向对象程序设计之属性和对象

    写在博客之前的话,这是我这个刚毕业的菜鸟的第一篇博客。一口吃不成一个胖子,我也希望写的第一篇东西就让读的人醍醐灌顶。我会抱着怀疑的态度来看自己写的文章,如果有写错的地方,请大家不要被误导,如果有大神提出意见,我会验证之后进行修改。

    js中对象

    对象是某个特定的引用类型的实例。创建的对象的方法有两种,使用new操作符后跟Object的构造函数,还有一种是使用对象字面量。

    1,这是通过new操作符然后直接给属性赋值的方法创建对象

    var person=new object();
    person.name="shaoqi";
    perosn.age=18;
    person.job='IT'
    
    person.sayName=function(){
        alert(this.name)
    }

    2,对象字面创建对象

    var person={
        name:"shaoqi",
        age:18,
        job:"IT",
    
        sayName:function(){
            alert(this.name);
        }
    }

    js中对象的属性

    js中的属性分两种,数据属性和访问器属性。两者就像c#中的字段和属性(这是我认为的)。属性在创建的是都带有一些特征值,javaScript通控制特征来定义它们的行为。

    1,数据属性。

    属性属性有以下几个特性:

    [[Configuarable]]:表示能否通过delte删除该属性,或者将属性修改文访问器属性

    [[Enumerable]]:是否可以通过for-in循环返回属性。

    [[Writeable]]:是否能修改属性的值,默认为true。

    [[Value]]:属性的值,默认为undefined。

    我们可以用Object.defineProperty()这个方法修改属性的特性。可以用下面的代码实现上面的特性。

    Configurable:

    var person={
    }
    
    Object.defineProperty(person,"name",{
        configurable:false,
        value:"shaoqi"
    })
    
    alert(person.name);
    delete person.name;
    alert(person.name);
    你会发现name的值并没有被删除,也就是说Configurable设置为false是不能将该属性删除的。需要注意的是在非严格模式下这种做法是不会引发错误的,但在严格模式下是会发生错误的。

    Writeable:

    var person={
    }
    
    Object.defineProperty(person,"name",{
        writable:false,
        value:"shaoqi"
    })
    
    alert(person.name);
    person.name="ddddd"
    alert(person.name);
    name的值也是不会变的。

    Enumerable:

    var person={
    }
    
    Object.defineProperty(person,"name",{
        writable:false,
        enumerable:false,
        value:"shaoqi"
    })
    var keys=Object.keys(person);
    console.log(keys);
    可以修改Enumerable的值来看最后log打出印出来的结果。

    2,访问器属性

    访问器属性也有几个特性

    [[Configurable]]:表示能否通过delte删除该属性,或者将属性修改文访问器属性

    [[Enumerable]]:是否可以通过for-in循环返回属性。

    [[Get]]:在读取属性时调用的函数。默认为undefined

    [[Set]]:在写入属性时调用的函数。默认为undefined

    Configurable和Enumerable和数据属性相同。下面重点介绍Get和Set的属性。

    访问器属性不能直接定义的,也必须使用Object.defineProperty()来定义。

    var book={
        _year:2004,
        edition:1
    }
    
    Object.defineProperty(book,"year",{
        get:function()
        {
            return this._year;
        },
        set:function(newValue){
            if(newValue>2004)
            {
                this._year=newValue;
                this.edition+=newValue-2004;
            }
        }
    })
    
    book.year=2006;
    console.log(book.edition);

    结果应该是三,在赋值的时候,调用了我们写的set函数。这个C#中的字段和属性的关系十分的相似。

    3,如何获取属性的特性

    在ECMAScript5中的Object.getOwnPropertyDescriptor()的方法,可以取得给定属性的描述符。可以通过他给出的属性来判断是数据属性还是访问器属性。

    var book={
        _year:2004,
        edition:1
    }
    
    Object.defineProperty(book,"year",{
        
        get:function()
        {
            return this._year;
        },
        set:function(newValue){
            if(newValue>2004)
            {
                this._year=newValue;
                this.edition+=newValue-2004;
            }
        }
    })
    
    book.year=2006;
    console.log(book.edition);
    
    
    var descript=Object.getOwnPropertyDescriptor(book,"year");
    console.log(descript.value);
    console.log(descript.configurable);
    console.log(descript.enumerable);
    console.log(descript.get);

    对于访问器的value是为undefined的,其他应该没有什么问题。get的方法也都打在日记里面了。

    js的属性就先讲到这里,虽然对应用方面不太重要。但对js的对象理解还是比较起作用的。下一篇准备开始写创建对象的模式,继承的模式,原型链的解释。希望自己能形成自己的知识体系。

  • 相关阅读:
    jQuery..1..基本使用..选择
    ORZ各路神犇
    马上搞定Android平台的Wi-Fi Direct开发
    Linux环境下搭建Android开发环境
    笑谈接口回调
    AIDL通信原理
    某个Java面试题
    直接下载SpringBoot项目本地的Excel文件
    用JSP做后台管理系统
    Singleton
  • 原文地址:https://www.cnblogs.com/shaoqi/p/5639042.html
Copyright © 2011-2022 走看看