资讯专栏INFORMATION COLUMN

JavaScript-面向对象、Object类型

amuqiao / 431人阅读

摘要:面向对象面向对象编程的全称为简称。面向对象编程是用抽象方式创建基于现实世界模型的一种编程方式。面向对象编程可以看做是使用一系列对象相互协作的软件设计。面向对象编程的三个主要特征是封装继承多态。

面向对象

面向对象编程的全称为Object Oriented Programming,简称OOP。面向对象编程是用抽象方式创建基于现实世界模型的一种编程方式。
面向对象编程可以看做是使用一系列对象相互协作的软件设计。面向对象编程的三个主要特征是:封装、继承、多态。

封装

所谓封装就是按照要求使用并得到对应的结果,而不需要知道真实的执行原理。
封装主要用于阐述对象中包含的(封装的)内容,通常有两部分组成

相关的数据(用于存储属性)

基于这些数据所能做的事

继承继承通常是指类与类之间的关系。如果两个类有相同的属性或方法,那么可以让一个类继承另一个类,就不需要再次定义相同的属性或方法。
创建一个或多个类的专门版本类方式称为继承(JavaScript只支持单体继承)。创建的专门版本的类通常叫做子类,另外的类通常叫做父类。

多态

不同的对象可以定义相同名称的方法,方法作用于所在的对象中。这种不同对象通过相同方法的调用实现各自行为的能力,被称之为多态。

构造函数

构造函数又被称为构造器或对象模板,是对象的一个方法,在实例化时构造器被调用。在JavaScript中函数就可以作为构造器使用。

/*  创建构造函数->用于创建对象
*    function 构造函数名称(){
*       this.属性名 = 属性值
*       this.方法名 = function(){
*           方法体
*           }
*     }
      this关键字指代利用当前构造函数创建的对象*/
function Dog() {//这是构造函数,构造函数的属性和方法使用this关键字
    this.name=function () {
        console.log("哈士奇")
    }
}

/*   利用构造函数创建对象*/
var dog = new Dog();
console.log(dog);
Object类型 属性描述符

JavaScript提供了一个内部数据结构,用于描述对象的值,控制其行为,例如该属性是否可写,是否可配置,是否可删除,是否可枚举等,这个内部数据结构被称为属性描述符。
对象里目前存在的属性描述符主要有两种形式:数据描述符和存取描述符。

数据描述符

数据描述符是一个具有值的属性,该值可能是可写的,也可能是不可写的。数据描述符具有以下可选键值:

value:该属性对应的值。可以是任何有效的JavaScript值。默认为undefined、

writable:当且仅当属性的writable为true时,value才能被赋值运算符改变。默认为false。

configurable:当且仅当该属性的configurable为true时,该属性描述符才能被改变,同时该属性也能从对应的对象上被删除。默认为false。

enumerable:当且仅当该属性的enumerable为true时,该属性才能够出现在对象的枚举属性中,默认为false。

存取描述符

存取描述符是由getter-setter函数对描述的属性。有以下可选键值

get:给属性提供getter的方法,如果没有getter则为undefined。当访问该属性时,该方法会被执行,方法执行时没有参数传入,但是会传入this对象。

set:给属性提供setter的方法,如果没有setter则为undefined。当属性修改时,触发执行该方法。该方法接受唯一参数,即改属性新的参数值。

configurable:当且仅当该属性的configurable为true时,该属性描述符才能被改变,同时该属性也能从对应的对象上被删除。默认为false。

enumerable:当且仅当该属性的enumerable为true时,该属性才能够出现在对象的枚举属性中,默认为false。

获取属性描述符

Object.getOwnPropentyDescriptor()方法返回指定对象上一个自有属性对应的属性描述符

var obj = {
    name : "哈士奇"
}
/*
    使用Object.getOwnPropertyDescriptor()方法获取指定属性的描述符
    Object.getOwnPropertyDescriptor(obj,prop)
    * obj - 表示指定属性对应的目标对象
    * prop - 表示获取描述符的目标属性名称
    * 返回值 - 其属性描述符对象
    * 如果
  */
var v =Object.getOwnPropertyDescriptor(obj,"name");
console.log(v)
设置属性描述符可选键值value

Object.deginepropety()方法为对象定义新属性或修改现有属性,并返回该对象。

var obj ={//定义对象时定义的属性是可以修改、删除、枚举的
    name : "阿拉斯加"
}
/*
    Object.defineProperty(obj, prop, descriptor)方法
    * 作用
      * 用于定义目标对象的新属性
      * 用于修改目标对象的已存在属性
    * 参数
      * obj - 表示目标对象
      * prop - 表示目标对象的目标属性名称
      * descriptor - 表示属性描述符,必须是对象格式
        {
            value : 值
        }
    * 返回值 - 返回传递的对象
 */
//修改name属性
Object.defineProperty(obj, "name",{
    value:"哈士奇"
} );
console.log(obj.name);//哈士奇

/*
    同样都是为对象新增属性
    1.如果直接使用 "对象名.属性名 = 值" -> 可修改、可删除以及可枚举的
    2.如果使用Object.defineProperty()方法新增属性
      * 该新属性是不可修改、不可删除以及不可枚举的
 */
//新增age属性//用该方法新增的属性默认是不可以修改、删除、枚举的
Object.defineProperty(obj,"age",{
    value : 2
});

Object.degineproperties()方法为对象定义一个或多个新属性或修改现有属性,并返回该值。

设置属性描述符可选键值weitable
var obj = {
    // 定义对象的同时定义了该属性以及值(可修改、可删除以及可枚举的)
    name : "张无忌"
}
// 修改现有属性
Object.defineProperty(obj, "name", {
    value : "周芷若",
    writable : false // 不可修改
});
console.log(obj.name);// 周芷若
// 修改name属性值
obj.name = "赵敏";
console.log(obj.name);// 周芷若

Object.defineProperty(obj, "age", {
   value : 18,
   writable : true
});
console.log(obj.age);// 18
// 修改age属性值
obj.age = 80;
console.log(obj.age);// 80

设置属性描述符可选键值configuarble

var obj = {
    // 定义对象的同时定义了该属性以及值(可修改、可删除以及可枚举的)
    name : "张无忌"
}
// 修改现有属性
Object.defineProperty(obj, "name", {
    value : "周芷若",
    writable : true, // 控制当前属性是否可被修改
    configurable : true // 控制当前属性是否可被删除
});
console.log(obj.name);// 周芷若
// 修改name属性值
obj.name = "赵敏";
console.log(obj.name);// 赵敏
// 删除name属性值
delete obj.name;undefined
console.log(obj.name);// undefined
设置属性描述符enumerable
var obj = {
    // 定义对象的同时定义了该属性以及值(可修改、可删除以及可枚举的)
    name : "张无忌"
}
Object.defineProperty(obj, "name", {
    value : "周芷若",
    enumerable : false
});
console.log(obj.name);// 周芷若
/*
    属性描述符enumerable - 控制当前属性是否可被枚举(遍历)
    * 仅能循环遍历对象中可被枚举的属性
      * for...in语句
      * keys()方法
    * 可以循环遍历对象中可被枚举和不可被枚举的属性
      * getOwnPropertyNames()方法
 */
for (var i in obj) {
    console.log(i);
}
var result1 = Object.keys(obj);
console.log(result1);
var result2 = Object.getOwnPropertyNames(obj);
console.log(result2);
设置属性描述符存取器

对象中的属性除了可以直接定义外,还可以用存取器进行定义。setter为取值函数,使用属性描述符中的set;getter为取值函数,使用属性描述符中的get。

var value;
var obj = {
    // 存取描述符中的get
    get attr() {// 表示当前目标属性名称
        return value;
    },
    // 存取描述符中的set
    set attr(newValue) {// 表示当前目标属性名称
        console.log("setter: " + newValue);
        value = newValue;
    }
}
console.log(obj.attr);// undefined
obj.attr = 100;// "setter: 100"
防篡改对象

定义的对象默认在任何时候任何位置都可以随意修改,所以添加了防止篡改的机制分为三个级别

禁止扩展:禁止为对象扩展新的属性和方法

密封对象:只允许读写属性的值

冻结对象:禁止任何操作

禁止扩展

Object.preventExtensions()设置指定对象不可扩展

Object.isExtensible()判断一个对象是否可以扩展

密封对象

Objet.seal()方法用于密封一个对象,防止添加新属性并将现有属性标记为不可配置,当前属性的值可写。

Object.Sealead()判断对象是否被密封

冻结对象

Object.freeze()用于冻结一个对象,无法对这个对象进行任何操作,只可读

Object.isFrozen()判断对象是否被冻结

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/108198.html

相关文章

  • JavaScript设计模式与开发实践 | 01 - 面向对象JavaScript

    摘要:在中,并没有对抽象类和接口的支持。例如,当对象需要对象的能力时,可以有选择地把对象的构造器的原型指向对象,从而达到继承的效果。本节内容为设计模式与开发实践第一章笔记。 动态类型语言 编程语言按数据类型大体可以分为两类:静态类型语言与动态类型语言。 静态类型语言在编译时已确定变量类型,动态类型语言的变量类型要到程序运行时,待变量被赋值后,才具有某种类型。 而JavaScript是一门典型...

    suxier 评论0 收藏0
  • SegmentFault 技术周刊 Vol.32 - 七夕将至,你的“对象”还好吗?

    摘要:很多情况下,通常一个人类,即创建了一个具体的对象。对象就是数据,对象本身不包含方法。类是相似对象的描述,称为类的定义,是该类对象的蓝图或原型。在中,对象通过对类的实体化形成的对象。一类的对象抽取出来。注意中,对象一定是通过类的实例化来的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 马上就要到七夕了,离年底老妈老爸...

    李昌杰 评论0 收藏0
  • SegmentFault 技术周刊 Vol.32 - 七夕将至,你的“对象”还好吗?

    摘要:很多情况下,通常一个人类,即创建了一个具体的对象。对象就是数据,对象本身不包含方法。类是相似对象的描述,称为类的定义,是该类对象的蓝图或原型。在中,对象通过对类的实体化形成的对象。一类的对象抽取出来。注意中,对象一定是通过类的实例化来的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 马上就要到七夕了,离年底老妈老爸...

    Lyux 评论0 收藏0
  • SegmentFault 技术周刊 Vol.32 - 七夕将至,你的“对象”还好吗?

    摘要:很多情况下,通常一个人类,即创建了一个具体的对象。对象就是数据,对象本身不包含方法。类是相似对象的描述,称为类的定义,是该类对象的蓝图或原型。在中,对象通过对类的实体化形成的对象。一类的对象抽取出来。注意中,对象一定是通过类的实例化来的。 showImg(https://segmentfault.com/img/bVTJ3H?w=900&h=385); 马上就要到七夕了,离年底老妈老爸...

    AaronYuan 评论0 收藏0
  • 理清javascript中的面向对象(一)——原型继承

    摘要:有一函数若是用来生成对象,则称为构造函数名。属性指定了使用该构造函数生成的对象实例继承了哪个对象实例。因此,只要利用,就能在构造函数中,为未来利用此构造函数生成的对象实例,添加成员属性和成员方法了。 与其它编程语言不一样的是,javascript的面向对象并非依赖于抽象的类,而是通过原型链,将一个个具体的对象实例进行连接,位于原型链下游的对象实例可以读取/使用位于上游的对象实例的属性/...

    beita 评论0 收藏0
  • 面向对象JavaScript(如何一步步成为js高手)

    摘要:虽然,也是面向疾苦的语言,但是,它和静态类型语言的面向接口编程不一而足。对象对他自己的行为负责,其他对象不关心它的内部实现。 ‘工欲善其事,必先利其器’,在深入学习JavaScript之前,我认为我们很有必要了解以下,JavaScript这门面向对象的动态语言到底是一门什么样的语言。 JavaScript vs 其他面向对象语言 它没有使用像Java等传统的面向对象语言的类式继承,而...

    peixn 评论0 收藏0

发表评论

0条评论

amuqiao

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<