昨天在写文章(转载)的时候发现了有些对象的方法是分可枚举性和不可枚举性的。
简单的查了一下资料,今天来捋一捋啥是对象的可枚举啥是不可枚举。

可枚举性:

对象的每一个属性都有一个描述对象,用来描述和控制该属性的行为,用Object.getOwnPropertyDescriptor方法来获取该描述对象(用Object.defineProperty方法来设置)。

然后这个Object.defineProperty的方法不是vue双向数据绑定的原理吗!!下次再说…
描述对象的enumerable属性,称为”可枚举性“,如果该属性为false,就表示某些操作会忽略当前属性。

   let obj = { start: '123' };
console.log(Object.getOwnPropertyDescriptor(obj, 'start')) // 输出内容:
configurable: true
enumerable: true
value: "123"
writable: true

下面,我们分别介绍下对象属性的描述对象的4个属性:
1.configurable:表示能否通过delete删除此属性,能否修改属性的特性,或能否修改把属性修改为访问器属性,如果直接使用字面量定义对象,默认值为true

2.enumerable: 表示该属性是否可枚举,即是否通过for-in循环或Object.keys()返回属性,如果直接使用字面量定义对象,默认值为true

3.writable: 能否修改属性的值,如果直接使用字面量定义对象,默认值为true
4.value: 该属性对应的值,默认为undefined

经过以上的一些操作,我还是不是很真切的理解可枚举性。那就举一个例子

 let obj = {};
Object.defineProperties(obj, {
name: {
value: '祖宗',
enumerable: false, //不可枚举
},
age: {
value: 88,
enumerable: true, //可枚举
}
})
for (let key in obj) {
console.log("key:" + key + ',' + 'value:' + obj[key])
}

只有可枚举的内容被for in 循环出来了
有没有感觉清晰了很多!!
(在这里感谢大佬提点!)

这就是个属性,如果false遍历就拿不到了,true遍历就能拿到了…(研究完了发现超简单诶。尴尬)

目前,有四个操作会忽略enumerable为false的属性。
for…in循环:只遍历对象自身的和继承的可枚举的属性。
Object.keys():返回对象自身的所有可枚举的属性的键名。
JSON.stringify():只串行化对象自身的可枚举的属性。
Object.assign(): 忽略enumerable为false的属性,只拷贝对象自身的可枚举的属性。

然后明儿写原生js实现vue中的双向数据绑定~~

JS对象的可枚举属性和不可枚举属性的更多相关文章

  1. JS中的可枚举属性与不可枚举属性以及扩展

    在JavaScript中,对象的属性分为可枚举和不可枚举之分,它们是由属性的enumerable值决定的.可枚举性决定了这个属性能否被for…in查找遍历到. 一.怎么判断属性是否可枚举 js中基本包 ...

  2. js中的可枚举属性与不可枚举属性

    在JavaScript中,对象的属性分为可枚举和不可枚举之分,它们是由属性的enumerable值决定的.可枚举性决定了这个属性能否被for…in查找遍历到. 一.怎么判断属性是否可枚举 js中基本包 ...

  3. JavaScript中的可枚举属性与不可枚举属性

    在JavaScript中,对象的属性分为可枚举和不可枚举之分,它们是由属性的enumerable值决定的.可枚举性决定了这个属性能否被for…in查找遍历到. 一.怎么判断属性是否可枚举 js中基本包 ...

  4. <JavaScript>可枚举属性与不可枚举属性

    在JavaScript中,对象的属性分为可枚举和不可枚举之分,它们是由属性的enumerable值决定的.可枚举性决定了这个属性能否被for…in查找遍历到. 一.怎么判断属性是否可枚举 js中基本包 ...

  5. 【Javascript-基础-getOwnPropertyNames】Object.getOwnPropertyNames() 获取对象自身可枚举属性

    可枚举属性和不可枚举属性 在JavaScript中,对象的属性分为可枚举和不可枚举之分,它们是由属性的enumerable值决定的.可枚举性决定了这个属性能否被for-in查找遍历到. 可枚举属性 e ...

  6. js对象系列【一】深层理解对象与原型

    我们先从盘古开天辟地时捋一捋对象: 从宏观内容来讲,javascript是一个属性的集合,包括值,函数,而整个集合也可以类比为一个对象. js = { a的变量名: a的值, ... 函数b: fun ...

  7. JS对象的拷贝

    1:对数据进行备份的时候,如果这个数据是基本的数据类型,那么很好办,通过赋值实现复制即可. 赋值与浅拷贝的区别 var obj1 = { 'name' : 'zhangsan', 'age' : '1 ...

  8. js 对象可枚举属性以及for in 循环和for of 循环

    js中每个对象的属性(js里万物皆属性,对象的属性也是对象)都有一个属性叫enumerable(可枚举性),这个属性true/false决定了该对象的属性是否可枚举(就是让一些方法访问到这个属性). ...

  9. JS 对象属性相关--检查属性、枚举属性等

    1.删除属性 delete运算符可以删除对象的属性 delete person.age //即person不再有属性age delete person['age'] //或者这样 delete只是断开 ...

随机推荐

  1. 分布式项目spring 配置文件的约束

    <?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://www.spr ...

  2. 用php 生成 excel 表格

    //引用新建对象require "../phpexcel/Classes/PHPExcel.php"; $excel = new PHPExcel(); 建表格 //Excel表格 ...

  3. PHP FILTER_UNSAFE_RAW 过滤器

    定义和用法 FILTER_UNSAFE_RAW 过滤器不进行任何过滤,去除或编码特殊字符. 该过滤器删除那些对应用程序有潜在危害的数据.它用于去除标签以及删除或编码不需要的字符. 如果不规定标志,则该 ...

  4. WarUtil

    /** *包名:cn.yufu.utils *描述:package cn.yufu.utils; */ package cn.yufu.utils; import java.io.File; impo ...

  5. Java-Class-C:com.github.pagehelper.PageInfo

    ylbtech-Java-Class-C:com.github.pagehelper.PageInfo 1.返回顶部   2.返回顶部 1.1. import com.github.pagehelpe ...

  6. vue-lic脚手架中引入font-awesome

    1.安装font-awesome npm i font-awesome --production 2.在main.js中引用 import 'font-awesome/css/font-awesome ...

  7. testNG官方文档翻译-2 注解

    这里是一份TestNG中的可用注解及其属性的概述. 一.用于一个TestNG类的信息配置的注解: @BeforeSuite:被BeforeSuite注解的方法将在其所在suite中的所有test运行之 ...

  8. 真实的『REM』手机屏幕适配

    rem 作为一个低调的长度单位,由于手机端网页的兴起,在屏幕适配中得到重用.使用 rem 前端开发者可以很方便的在各种屏幕尺寸下,通过等比缩放的方式达到设计图要求的效果. rem 的官方定义『The ...

  9. background-size的值cover、contain和100%

    图1 给一个宽600px,高600px的div添加一张宽480px,高360px的背景图片.不重复显示的情况下,默认显示为图1. 1.background-size: 100% 100%; 会将图片的 ...

  10. 4-vim-工作模式-01-职责以及切换模式

    vi 有三种工作模式 1.命令模式 打开文件首先进入命令模式,是使用vi的入口. 通过命令对文件进行常规的编辑操作,例如:定位-翻页-复制-粘贴-删除等. 在其他图形编辑器下,通过快捷键或鼠标实现的操 ...