注释:

本文宅自https://segmentfault.com/a/1190000007434923,仅学习方便,没有任何商业用途

对象是由多个名/值对组成的无序的集合。对象中每个属性对应任意类型的值。
定义对象可以使用构造函数或字面量的形式:

 var obj = new Object;  //obj = {}
obj.name = "张三"; //添加描述
obj.say = function(){}; //添加行为

除了以上添加属性的方式,还可以使用Object.defineProperty定义新属性或修改原有的属性

Object.defineProperty()

语法:

 Object.defineProperty(obj, prop, descriptor)

参数说明:

 obj:必需。目标对象
prop:必需。需定义或修改的属性的名字
descriptor:必需。目标属性所拥有的特性

返回值:

传入函数的对象。即第一个参数obj;

针对属性,我们可以给这个属性设置一些特性,比如是否只读不可以写;是否可以被for..inObject.keys()遍历。

给对象的属性添加特性描述,目前提供两种形式:数据描述和存取器描述。

数据描述

当修改或定义对象的某个属性的时候,给这个属性添加一些特性:

 var obj = {
test:"hello"
}
//对象已有的属性添加特性描述
Object.defineProperty(obj,"test",{
configurable:true | false,
enumerable:true | false,
value:任意类型的值,
writable:true | false
});
//对象新添加的属性的特性描述
Object.defineProperty(obj,"newKey",{
configurable:true | false,
enumerable:true | false,
value:任意类型的值,
writable:true | false
});

数据描述中的属性都是可选的,来看一下设置每一个属性的作用。

value

属性对应的值,可以使任意类型的值,默认为undefined

 var obj = {}
//第一种情况:不设置value属性
Object.defineProperty(obj,"newKey",{ });
console.log( obj.newKey ); //undefined
------------------------------
//第二种情况:设置value属性
Object.defineProperty(obj,"newKey",{
value:"hello"
});
console.log( obj.newKey ); //hello

writable

属性的值是否可以被重写。设置为true可以被重写;设置为false,不能被重写。默认为false。

 var obj = {}
//第一种情况:writable设置为false,不能重写。
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:false
});
//更改newKey的值
obj.newKey = "change value";
console.log( obj.newKey ); //hello //第二种情况:writable设置为true,可以重写
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:true
});
//更改newKey的值
obj.newKey = "change value";
console.log( obj.newKey ); //ch

enumerable

此属性是否可以被枚举(使用for...in或Object.keys())。设置为true可以被枚举;设置为false,不能被枚举。默认为false。

 var obj = {}
//第一种情况:enumerable设置为false,不能被枚举。
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:false,
enumerable:false
}); //枚举对象的属性
for( var attr in obj ){
console.log( attr ); //console不出来
}
//第二种情况:enumerable设置为true,可以被枚举。
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:false,
enumerable:true
}); //枚举对象的属性
for( var attr in obj ){
console.log( attr ); //newKey
}

configurable

是否可以删除目标属性或是否可以再次修改属性的特性(writable, configurable, enumerable)。设置为true可以被删除或可以重新设置特性;设置为false,不能被可以被删除或不可以重新设置特性。默认为false。

这个属性起到两个作用:

目标属性是否可以使用delete删除

目标属性是否可以再次设置特性

 //-----------------测试目标属性是否能被删除------------------------
var obj = {}
//第一种情况:configurable设置为false,不能被删除。
Object.defineProperty(obj,"newKey",{
value:"hello",
writable:false,
enumerable:false,
configurable:false
});
//删除属性
delete obj.newKey;
console.log( obj.newKey ); //hello //第二种情况:configurable设置为true,可以被删除。
Object.defineProperty(obj,"newKey",{
value:"hello",

除了可以给新定义的属性设置特性,也可以给已有的属性设置特性

 //定义对象的时候添加的属性,是可删除、可重写、可枚举的。
var obj = {
test:"hello"
} //改写值
obj.test = 'change value'; console.log( obj.test ); //'change value' Object.defineProperty(obj,"test",{
writable:false
}) //再次改写值
obj.test = 'change value again'; console.log( obj.test ); //依然是:'change value'

提示:一旦使用Object.defineProperty给对象添加属性,那么如果不设置属性的特性,那么configurable、enumerable、writable这些值都为默认的false

 var obj = {};
//定义的新属性后,这个属性的特性中configurable,enumerable,writable都为默认的值false
//这就导致了neykey这个是不能重写、不能枚举、不能再次设置特性
//
Object.defineProperty(obj,'newKey',{ }); //设置值
obj.newKey = 'hello';
console.log(obj.newKey); //undefined //枚举
for( var attr in obj ){
console.log(attr);
}

Object.defineProperty()属性设置介绍的更多相关文章

  1. js中Object.defineProperty()和defineProperties()

    在介绍js中Object.defineProperty()和defineProperties()之前,我们了解下js中对象两种属性的类型:数据属性和访问器属性. 数据属性 数据属性包含一个数据的位置, ...

  2. Vue的数据双向绑定和Object.defineProperty()

    Vue是前端三大框架之一,也被很多人指责抄袭,说他的两个核心功能,一个数据双向绑定,一个组件化分别抄袭angular的数据双向绑定和react的组件化思想,咱们今天就不谈这种大是大非,当然我也没到达那 ...

  3. Object.defineProperty注意事项

    Object.defineProperty() 方法设置属性时,属性不能同时声明访问器属性( set 和 get )和 writable 或者 value 属性. 意思就是,某个属性设置了 writa ...

  4. javascript-object对象属性操作之Object.defineProperty

    一.基本用法简介 声明一个简单的对象,如下 var obj = { name: 'ldld' } 我们可以用Object.defineProperty来声明这个对象 var obj = {} Obje ...

  5. Delphi控件之---UpDown以及其与TEdit的配合使用(比如限制TEdit只能输入数字,还有Object Inspector之组件属性的介绍)

    最近在开发中使用到了UpDown这个控件,但是因为之前没有使用过,所以很不熟悉,于是就编写了一个简单的demo来学习UpDown以及其结合TEdit的用法. 初步的常用功能的简介 目前(2015.08 ...

  6. JS属性描述符之Object.defineProperty()定义对象属性特性

    一.Object.defineProperty的作用 用来给对象新增属性,和修改对象中的属性. 二.JS对象中的描述符 js对象中两种属性描述符:数据描述符和存取描述符(访问描述符). 注意事项: 1 ...

  7. Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象。

    Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象. 语法EDIT Object.defineProperty(obj, ...

  8. Object.defineProperty 与 属性描述符

    为JavaScript对象新增或者修改属性,有两种不同方式:直接使用=赋值或者使用Object.defineProperty 定义,使用后者的话还可以设置属性的描述符. Object.definePr ...

  9. 对象是否拥有某个属性,in和for in以及object.hasOwnProperty('×××')的异同,以及Object.defineProperty(),Object.keys(),Object.getOwnPropertyNames()的用法

    1.在某个对象是否拥有某个属性,判断的方法有很多,常用的方法就是object.hasOwnProperty('×××'),这个方法是不包括对象原型链上的方法的,举个例子: var obj = { na ...

随机推荐

  1. 深入理解索引系列1:B+树

  2. Android中保存静态秘钥实践(转)

    本文我们将讲解一个Android产品研发中可能会碰到的一个问题:如何在App中保存静态秘钥以及保证其安全性.许多的移动app需要在app端保存一些静态字符串常量,其可能是静态秘钥.第三方appId等. ...

  3. 在Ubuntu上安装Mono

    在Ubuntu上安装Mono 执行以下代码授权注冊repo源并更新软件列表: sudo apt-key adv --keyserver keyserver.ubuntu.com --recv-keys ...

  4. 【laravel5.4】git上clone项目到本地,配置和运行 项目报错:../vendor/aotuload.php不存在

    1.一般我们直接使用git clone 将git的项目克隆下来,在本地git库和云上git库建立关联关系 2.vendor[扩展]文件夹是不会上传的,那么下载下来直接运行项目,会报错: D:phpSt ...

  5. 转载【微信小程序】:微信小程序滚动Tab选项卡:左右可滑动切换(仿某宝)

    1.本文转载至:http://blog.csdn.net/sophie_u/article/details/71745125 2.效果: 3.最终效果如上.问题: 1).tab标题总共8个,所以一屏无 ...

  6. jquery api 常见 事件操作

    change.html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html ...

  7. Java面试基础部分合集

    写在前面:这篇文章对于在Java方面已经很牛逼的大手,就没必要看了,因为对于你们来说,这tm简直太简单了.... 面试我们都经历过,你真的懂面试吗?针对面试我只想说一点,面试的目的不是让考官知道你怎么 ...

  8. CYDIA装了个插件,想删除怎么都删除,电脑如何删除插件?

    http://bbs.weiphone.com/read-htm-tid-3670917.html 装了个插件,想删除怎么都删除不掉不要跟我说在CYDIA里面删除.,在CYDIA里点击该插件就会闪退C ...

  9. APK 本地化和去广告

    APK 本地化       说起APK的汉化,目前大部分教程都是让用Hex Workshop或者Android ResEdit来做.但是实际操作后,就会发现: 1.Hex Workshop操作繁琐,经 ...

  10. Jsp应用EL和JSTL实例对比。

    普通方式: register.jsp <%@ page language="java" import="java.util.*" pageEncoding ...