简介表示法(直接写入变量和函数,作为对象的属性和方法)

let x = "test"
let obj={
x, //属性名为变量名,属性值为变量值
y(){console.log("hello")}
}
//以上相当于
let obj = {
x:'test',
y:function(){
console.log("hello")
}
}

属性名表达式(表达式作为对象的属性名,把表达式放在方括号内。)

let aa = "hello";
let obj = {
[aa]: "hello",
["a" + "b"]: "es6"
}
//以上相当于
let obj = {
hello: "hello",
"ab": "es6"
}

对象方法的name属性(返回函数名)

let obj = {
"hello": "hello",
foo: function () { }
}
console.log(obj.foo.name)

Object.is()(比较两个值是否严格相等,相当于===,但是-0不等于0,NaN=NaN)

Object.is({}, {}) //false
Object.is(-0, 0) //false
Object.is(NaN, NaN) //true

Object.assign()(用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target))

let obj1 = {a:1};
let obj2 = {b:2};
let objx = {b:4};
let obj3 = Object.assign(obj1,obj2); //{ a: 1, b: 2 }
let obj4 = Object.assign(obj1,obj2,obj3) //{ a: 1, b: 4 } 如果有相同的属性名,后者覆盖前者

注意:

  • 浅拷贝对象(源对象某个属性的值是对象,那么目标对象拷贝得到的是这个对象的引用。)
const obj1 = {a: {b: 1}};
const obj2 = Object.assign({}, obj1); obj1.a.b = 2;
obj2.a.b //
  • 处理数组
//把数组的索引当做key来生成对象
Object.assign([1, 2, 3], [4, 5]) //[4,5,3]
  • 取值函数(先取值,后复制)
const source = {
get foo(){
return 1
}
}
let a =Object.assign({},source) //{ foo: 1 }

Object.keys(),Object.values(),Object.entries()(都返回数组形式)

let obj = {a: 0,b: 1,c: 2};
let a = Object.keys(obj) //["a","b","c"]
let b = Object.values(obj) //[0,1,2]
let c = Object.entries(obj) //[["a":0],["b":1],["c":2]]

扩展运算符...

  • 解构赋值(解构赋值的拷贝是浅拷贝)
let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };
x //
y //
z // { a: 3, b: 4 } let obj = { a: { b: 1 } };
let { ...x } = obj;
obj.a.b = 2;
x.a.b //
  • 扩展运算符(取出参数对象的所有可遍历属性,拷贝到当前对象之中)
let z = { a: 3, b: 4 };
let n = { ...z }; // { a: 3, b: 4 } //等同于
let n = Object.assign({},z) // { a: 3, b: 4 }

ES6学习之对象扩展的更多相关文章

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

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

  2. ES6入门之对象扩展

    ES5对象(超类)原有: 属性:construct构造函数 方法: object.hasOwnProperty( propertyName ) //检测是否有一个本地的属性而不是继承的,返回boole ...

  3. ES6学习之数组扩展

    扩展运算符(...将数组分割为用逗号分割的参数序列) console.log(...[1,2,3]) //1 2 3 可替换数组的apply写法: function test(x,y,z){ cons ...

  4. ES6学习之函数扩展

    函数默认参数 function test(x = 1, y = 2) { return x + y } test(5, 6) test() 若默认参数在必须参数之前,要想取得默认参数,只有当传入的值为 ...

  5. es6 语法 (对象扩展)

    { //简洁表示法 let o = 1; let k = 2; let es5 = { o:o, k:k }; let es6 = { o,k }; console.log(es5,es6); //1 ...

  6. ES6学习之数值扩展

    二进制和八进制表示法(二进制用前缀0b(或0B)表示,八进制用前缀0o(或0O)表示) Number('0b111') Number('0o10') Number.isFinite()(判断一个值是否 ...

  7. ES6学习之正则扩展

    RegExp正则函数 var reg = new RegExp("abc","igm"); //等价于 var reg = new RegExp(/abc/ig ...

  8. ES6 学习 -- Promise对象

    1.promise含义:可以将promise对象看成是一个容器,它保存着未来才会结束的某个事件(一般是异步操作事件)的结果,各 种异步操作都可以用promise对象来处理promise的特点:(1)p ...

  9. ES6学习笔记(8)----对象的扩展

    参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ 对象的扩展 1.属性名的简洁表示法 : ES6允许在代码中直接写变量,变量名是属性名,变量值是属 ...

随机推荐

  1. Basis 基础

    [转自 http://www.cnblogs.com/elegantok/archive/2008/11/03/1325163.html] 1 Basis1. Unix操作 更改口令 passwd e ...

  2. iOS __weak 和 __block 的使用探讨

    在基本的开发中遇到 需要弱引用时候 我一般 用 weak  预防 死锁的时候 我会用 block 的确没出过大错  但是这样处理 的确有点囫囵  现在我想好好理解一下这两个修饰符 "bloc ...

  3. Flask框架的学习与实战(二):实战小项目

    昨天写了一篇flask开发环境搭建,今天继续,进行一个实战小项目-blog系统. blog系统很简单,只有一个页面,然而麻雀虽小五脏俱全.这里目的不是为了做项目而做项目,这篇文章本意是通过这次练习传达 ...

  4. debian下使用ft232为stm32f429i-discovery烧写uboot和uImage

    操作系统:debian 软件: openocd  minicom 硬件:  MiniUSB线.stm32f429i-discovery, WaveShare FT232串口模块(可以在淘宝上买到) 关 ...

  5. php执行外部命令函数:exec()、passthru()、system()、shell_exec()对比

    PHP提供了4种方法执行系统外部命令:exec().passthru().system().shell_exec(),下面分别介绍: 1.exec 原型:string exec ( string $c ...

  6. Docker-端口映射与容器互联

    在使用docker过程中,通常会碰到需要多个服务组件容器共同协作的情况,这往往需要多个容器之间有能够互相访问到对方的服务除了通过网络访问外,Docker还提供了两个很方便的功能来满足服务访问的基本需求 ...

  7. Spring的使用

    Spring的组成 1. Core模块 该模块是Spring的核心容器,它实现了Ioc模式和Spring框架的基础功能. 2. Context模块 该模块继承BeanFactory类,并添加了事件处理 ...

  8. BZOJ 3357 [Usaco2004]等差数列:map优化dp

    题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=3357 题意: 给你n个数a[i],让你找出一个最长的是等差数列的子序列. 题解: 表示状态 ...

  9. 分享知识-快乐自己:大数据(hadoop)环境搭建

    大数据 hadoop 环境搭建: 一):大数据(hadoop)初始化环境搭建 二):大数据(hadoop)环境搭建 三):运行wordcount案例 四):揭秘HDFS 五):揭秘MapReduce ...

  10. C++中的右结合性

    看到网上的说是,右结合 但是还是从左往右算 // 以下说法是从网上看的,不知道对不 a ? b : c ? d : e 如何进行呢? 它的结合律是从右向左,所以它等效于 a ? b : ( c ? d ...