js 创建file对象_深度理解JS中面向对象的创建单个对象

本文详细介绍了JavaScript中的对象概念,包括如何创建对象实例,数据属性与访问器属性的区别,以及如何使用Object.defineProperty()和Object.defineProperties()方法来定义和修改属性特性。此外,还讲解了如何通过Object.getOwnPropertyDescriptor()获取属性描述符,帮助读者深入理解JavaScript对象的内部工作机制。
摘要由CSDN通过智能技术生成

来谈谈面向对象吧,谈对象,似乎确实是一件比较复杂的事情~

一、首先来理解一下对象

对象其实就是创建一个Object的实例,然后可以给他添加属性和方法,像这样:

let person = new Object( );        //这就是创建实例person.name = "Kobe";person.age = 29 ;person.sayJob = function( ) {console.log( "basketball player" );};//一般我们喜欢用字面量方法 , 清爽直接let person = { name : "Kobe",  age : 29 ,  sayJob :  function( ) {console.log( "basketball player" );}} ;

那么像上面那样就创建好了一个person对象了,他带有name、age属性和一个sayJob的方法

二、那么来研究一下属性的类型,属性的类型又分为 数据属性 和 访问器属性

1.数量属性 是什么呢?像上面person这个对象,他的name、age属性就是数据属性,数据属性具有4个特性:configurable、enumerable、writable和value

configurable:表示能否通过delete删除属性从而重新定义属性,能否修改属性的特性,或者能否把属性修改为访问器属性。默认值为true

enumerable:表示能否通过for-in循环返回属性。默认值为true

writable:表示能否修改属性的值。默认值为true

value : 属性的数据值。默认值为undefined , 当给属性指定一个值以后,value的值就变成指定的该值了

要修改属性默认的特性,及以上几个特性的话,必须用到 Object.defineProperty( )方法了,它接收三个参数:属性所在的对象、属性名字和一个描述特性的对象,像这样;

let person = { } ;Object.defineProperty( person , "name" , {configurable : false,    //这里将configurable特性改为false  value : "Rose"} ) ;console.log(person.name);   //Rosedelete person.name;     //由于configurable值为false,因此将name属性删除将不起作用console.log(person.name);  //Roselet animal = { } ;Object.defineProperty( person , "name" , {writable : false,    //这里将writable特性改为false  value : "Wade"} ) ;console.log(animal.name);   //Wadeanimal.name = "James"     //由于writable值为false,因此name属性值重写将不起作用console.log(animal.name);  //Wade

2.访问器属性 访问器属性不包含数据值,他包含一对getter和setter函数,在读取访问器属性的时候,调用getter函数,这个函数负责返回值,在写入访问器属性的时候,会调用setter函数并传入新值,这个函数就负责处理数据。访问器属性也具有4个特性:configurable、enumerable、get和set

configurable:表示能否通过delete删除属性从而重新定义属性,能否修改属性的特性,或者能否把属性修改为访问器属性。默认值为true

enumerable:表示能否通过for-in循环返回属性。默认值为true

get:读取属性时调用的函数。默认值undefined

set:写入属性时调用的函数。默认值undefined

访问器属性不能直接定义,必须使用Object.defineProperty( )方法来定义,先来看一下代码:

let person = {age:18};Object.defineProperty( person , "yearslater" , {get : function( ){  return this.age  },  set : function( value ){  this.age += value  }} );console.log( person.age );   //18person.yearslater = 2 ;console.log( person.age );   //20

上面person对象定义了一份默认属性age,访问器属性yearslater包含了一个set和get函数,get函数返回age的值,set函数用来处理值,通过person.yearslater访问值来改变了age的值,这就是访问器属性的常见方式

3.定义多个属性,定义多个属性就需要用到Object.defineProperties( )方法了,这个方法接收两个参数,第一个是要添加和修改的对象,第二个对象的属性与第一个对象中要添加或修改的属性一一对应

let person = { };Object.defineProperties(person , { name:{  writable:true,    value:"Durant"  },  age:{  configurable:false,    value:28  },  yearslater:{  get:function( ){    return this.age    },    set:function( value ){    this.age += value    }  }} )

4.读取属性的特性,使用Object.getOwnPropertyDescriptor( )方法,这个方法接收两个参数:属性所在对象和要读取其描述符的属性名称,返回值是一个对象。

我们还是定义上面那个person对象

let descriptor = Object.getOwnPropertyDescriptor( person ,"name");console.log(descriptor.value);  //Durantconsole.log(descriptor.writable);  //trueconsole.log(descriptor.get);  //undefined

好了,单个对象的理解就到这里了,希望能对大家有所帮助

eee7271d8e38553dfebc6df5e88a9b3d.png
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值