属性简洁表示法
属性名表达式
Objec.is()
扩展运算符 与 Object.assign()
in
对象的遍历方式
 
属性简洁表示法:
如果属性key跟变量名一样,可简写
let name = '张三'
let age = 18
let people = {
name,
age
}
console.log(people);

  

属性名表达式:
当我们想key是变量的时候,就需要使用属性名表达式
let s = 'school'
let obj = {
[s]: '清华'
}
console.log(obj); // 此时obj的key[s],就变成school

  

对象里面function也可以进行简写
let obj2 = {
name: '张三',
study() {
console.log(this.name + '正在学习');
}
}
obj2.study()

  

Objec.is:用来判断两个值是否相等,且判断类型
那么跟===全等有什么区别?
console.log(2 === '2'); // false
console.log(Object.is(2, '2')); // false
console.log(NaN === NaN); // false
console.log(Object.is(NaN, NaN)); // true
console.log(+0 === -0); // true
console.log(Object.is(+0, -0)); // false

  

两个对象的比较并不是比较对象的内容,而是比较栈内存里面的引用地址
let obj3 = {}
let obj4 = {}
console.log(obj3 === obj4); // false
console.log(Object.is(obj3, obj4)); // false
let obj5 = obj3
console.log(obj3 === obj5); // true
console.log(Object.is(obj3, obj5)); // true

  

扩展运算符:
let x = {
a: 1,
b: 2
}
let y = {
...x
}
console.log(y);

  

Object.assign:将所有可枚举属性的值从一个或多个源对象分配到目标对象。它将返回目标对象。
语法:Object.assign(target, ...sources)
let z = {}
Object.assign(z, x)
console.log(z);

  

in:用来判断对象是否包含某属性
console.log('a' in x); // true
console.log('aa' in x); // false

  

in也能用于数组,但是用在数组是判断当前索引下面是否有值
let arr = [1, 2, 3]
console.log(2 in arr); // true,索引2位置有数字3
console.log(3 in arr); // false,索引3位置没有值

  

对象的遍历:
let objEach = {
name: '张三',
age: 18,
school: '清华'
}
// 方法一
for (let key in objEach) {
console.log(key, objEach[key]);
}
// 方法二
Object.keys(objEach).forEach(key => {
console.log(key, objEach[key]);
})
// 方法三
Object.getOwnPropertyNames(objEach).forEach(key => {
console.log(key, objEach[key]);
})
// 方法四
Reflect.ownKeys(objEach).forEach(key => {
console.log(key, objEach[key]);
})

  

-------------------------------------------ES8对象的扩展---------------------------------------------------------

Object.values()
Object.entries()
const obj = {
name: '张三',
age: 18
} console.log(Object.keys(obj));
console.log(Object.values(obj)); console.log(Object.entries(obj));

  

对象属性描述符
Object.getOwnPropertyDescriptors()
    value:当前值
    writable:是否可以修改
    configurable:能否使用delete删除属性
    enumerable:是否能通过for in循环
const desc = Object.getOwnPropertyDescriptors(obj)
console.log(desc);

  

Reflect.defineProperty可以设置对象这四个属性
Reflect.defineProperty(obj, 'name', {
value: '李四',
writable: true,
configurable: true,
enumerable: true,
})

  

 

ES6-11学习笔记--对象的扩展的更多相关文章

  1. js-ES6学习笔记-对象的扩展

    1.ES6允许直接写入变量和函数,作为对象的属性和方法.这种写法用于函数的返回值,将会非常方便.CommonJS模块输出变量,就非常合适使用简洁写法. var ms = {}; function ge ...

  2. C++11 学习笔记 std::function和bind绑定器

    C++11 学习笔记 std::function和bind绑定器 一.std::function C++中的可调用对象虽然具有比较统一操作形式(除了类成员指针之外,都是后面加括号进行调用),但定义方法 ...

  3. ES6中数组和对象的扩展运算符拷贝问题以及常用的深浅拷贝方法

    在ES6中新增了扩展运算符可以对数组和对象进行操作.有时候会遇到数组和对象的拷贝,可能会用到扩展运算符.那么这个扩展运算符到底是深拷贝还是浅拷贝呢? 一..使用扩展运算符拷贝 首先是下面的代码. le ...

  4. C++11学习笔记

    C++11 1.long long新类型 2.列表初始化 int t=0; int t={0}; int t(0); int t{0}; 注意:如果我们使用列表初始化有丢失信息的风险,则编译器报错 l ...

  5. JavaScript学习笔记-对象

    枚举对象的属性:通常用for(...in...)来循环遍历,由于 for in 总是要遍历整个原型链,因此如果一个对象的继承层次太深的话会影响性能 for(var i in foo){ if(foo. ...

  6. ES6(vue)对象词法扩展

    ES6 允许声明在对象字面量时使用简写语法,来初始化属性变量和函数的定义方法,并且允许在对象属性中进行计算操作: function getCar(make, model, value) { retur ...

  7. ES6学习笔记(二)——字符串扩展

    相信很多人也和我一样,不喜欢这样循规蹈矩的逐条去学习语法,很枯燥乏味.主要是这样学完一遍之后,没过一段时间就忘到九霄云外了.不如实际用到的时候研究它记得牢靠,所以我就整理成笔记,加深记忆的同时便于复习 ...

  8. ES6 - 基础学习(6): 对象扩展

    对象对于JavaScript至关重要,在ES6中对象又加了很多新特性. 对象字面量:属性的简洁表示法 ES6允许对象的属性直接写变量,这时候属性名是变量名,属性值是变量值. let attr1 = & ...

  9. JavaScript(ES6)学习笔记-Set和Map与数组和对象的比较(二)

    一.Map,Set,Array对比: 1.增 let map = new Map(); let set = new Set(); let array = []; map.set('t',1); //M ...

随机推荐

  1. 两天两夜,1M图片优化到100kb!

    坦白从宽吧,我就是那个花了两天两夜把 1M 图片优化到 100kb 的家伙--王小二! 自从因为一篇报道登上热搜后,我差点抑郁,每天要靠 50 片安眠药才能入睡. 网络上曝光的那些关于一码通的消息,有 ...

  2. php 数组汇总

    PHP 5 Array 函数 函数 描述 array() 创建数组. array_change_key_case() 返回其键均为大写或小写的数组. array_chunk() 把一个数组分割为新的数 ...

  3. java面试:java基础、Io、容器

    1.java基础 1.JDK 和JRE有什么区别 ​ JDK:java开发工具包,java开发运行环境.包含了JRE. ​ JRE:java运行环境,包含java虚拟机,java基础类库. 2.jav ...

  4. elasticsearch高亮之highlight原理

    一.highlight简介 highlight是提升用户体验的重要手段,搜索引擎通过高亮突出命中关键字等方式,方便用户通过关键字周围的信息快速的确认是否是自己希望的结果: highlight功能通常包 ...

  5. LGP2490题解

    有点儿神秘? 根据他这个题意说的,白子向右的第一个一定是对应的黑子啊. 所以棋子的绝对位置是不重要的,我们只需要考虑白子和黑子的相对位置,然后考虑用 GF 来拼凑状态就好了. 下面的 \(k\) 是题 ...

  6. BUU [GKCTF 2021]签到

    BUU [GKCTF 2021]签到 1.题目概述 2.解题过程 追踪HTTP流 在下面发现了一串可疑字符 Base16转base64 放到010里看看 复制下来,去转字符 好像不是,再回去找找其他的 ...

  7. MyBatis报错—Type handler was null on parameter mapping for property 'createTime'. It was either not specified and/or could not be found for the javaType (javax.xml.crypto.Data) : jdbcType (null) combina

    原因是:在创建实体类的时候吧date类型写成data导致类型不匹配 Type handler was null on parameter mapping for property 'createTim ...

  8. MyEclipse 05_连接mysql数据库进行增删改查

    例子: 1.在数据库中建立如下表 2. 在MyEclipse里按本主博客文MyEclipse 03_jdbc连接数据库,注意数据库名要一致  运行后在Navicat里如下: 代码如下: package ...

  9. .net Core 调用EF Core 爬坑

    .net Core 中调用 EF Core项目 首先得建一个类库供.net Core 的主项目引用:其次,在.net Core 中做注入:最后,在页面中调用 1.类库项目中的操作 1.新建类库项目 2 ...

  10. vim设置自动添加头部注释

    #自己改了改vim开头文件,如下图# 友友们可以直接修改·SetTitle() if v:lang =~ "utf8$" || v:lang =~ "UTF-8$&quo ...