简化的对象写法

省略同名的属性值,省略方法的function

let x = 1;
let y = 2;
let point = {
  x,
  y,
  setX (x) {
    this.x = x
  }
};
console.log(point)

Object.create(prototype, [descriptors])

以指定对象(prototype)为原型创建新的对象,为新的对象指定新的属性, 并对属性进行描述(descriptors

- value : 指定值

- writable : 标识当前属性值是否是可修改的, 默认为false

- configurable: 标识当前属性是否可以被删除 默认为false

- enumerable: 标识当前属性是否能用for in 枚举 默认为false

var obj1 = {
  name: 'huang',
  age: 13
}
var obj2 = {}
obj2 = Object.create(obj1, {
  sex: {
    value: '男',
    writable: true
  }
});
console.log(obj2)
console.log(obj1)

// 以obj1为原型创建的对象obj2,是不能继承obj1对象下的属性的,在obj2中作为原型存在
// 可以获取到并且可以修改
console.log(obj2.name) // huang
obj2.name = 'liu'
console.log(obj2.name) // liu

// 新增的属性,进行操作的时候要看创建的时候是怎么描述的,可不可以修改,删除等
console.log(obj2.sex) // 男
delete obj2.sex // 运行结果没有删掉,是因为创建这个属性的时候默认是不可以删除的

Object.defineProperties(object, descriptors)

为指定对象定义扩展多个属性

get :用来获取当前属性值得回调函数(当获取扩展属性的时候会自动调用)

set :修改当前属性值得触发的回调函数,并且实参即为修改后的值

存取器属性:setter,getter一个用来存值,一个用来取值

var obj = {
  firstName: 'kobi',
  lastName: 'bulanen'
}

Object.defineProperties(obj, {
  fullName: {
    get: function () {
      return this.firstName + ' ' + this.lastName
    },
    set: function (data) { // 监听扩展属性,当扩展属性发生变化的时候会自动调用,自动调用的时候会将变化的值作为实际参数注入到set函数中
      var names = data.split(' ')
      this.firstName = names[0]
      this.lastName = names[1]
    }
  }
})

console.log(obj)
console.log(obj.fullName) //kobi bulanen
obj.firstName = 'tim' // 原来的属性可以这样修改
obj.lastName = 'can' // 扩展的属性也可以这样修改,但是这个属性扩展的时候必须要有set方法
console.log(obj.fullName) //tim can

对象本身其实也有这个get和set方法

对象本身的两个方法
get propertyName(){} 用来得到当前属性值的回调函数
set propertyName(){} 用来监视当前属性值变化的回调函数

var obj = {
        firstName: 'kobi',
        lastName: 'bulanen',
        get fullName() {
            return this.firstName + ' ' + this.lastName
        },
        set fullName(data) {
            var names = data.split(' ')
            this.firstName = names[0]
            this.lastName = names[1]
        }
    }
    console.log(obj.fullName) //kobi bulanen

    obj.fullName = 'tim can' // 当对象没有set方法的时候是修改不成功的

    console.log(obj.fullName) // tim can

Object.is(v1, v2)

判断2个数据是否完全相等

let Obj1 = {
    name: 'huang'
  }
  let Obj2 = {
    name: 'huang'
  }
  console.log(0 == -0) // true
  console.log(NaN == NaN) // false NaN跟任何数据都不相等
  console.log(Object.is(0, -0)) // false
  console.log(Object.is(NaN, NaN)) // true
  console.log(Object.is(Obj1, Obj2)) // false

Object.assign(target, source1, source2..)
将源对象的属性复制到目标对象上

let Obj1 = {
    name: 'huang'
  }
  let Obj2 = {
    name: 'liu'
  }
  let Obj3 = {}

  // 第一个是目标对象,第二个开始就要复制属性的对象
  // 如果复制的属性有重复的情况,那么结果是最后一个对象的属性
  Object.assign(Obj3, Obj1, Obj2)

  console.log(Obj3) // {name: "liu"}

直接操作 __proto__ 属性

let Obj1 = {
    moneny: 30000
  }
  let Obj2 = {}

  Obj2.__proto__ = Obj1 // 表示的是obj1是obj2的原型

  console.log(Obj2) //他还是个空对象,但是会有obj1的原型
  console.log(Obj2.moneny) // 能够获取到obj1原型下的moneny属性的值

ES5-ES6-ES7_对象的扩展的更多相关文章

  1. ES6 对对象的扩展

    1.对象类别 普通对象:具有JavaScript对象的所有默认内部行为 特异对象: 具有某些与默认行为不符的内部行为 标准对象: ECMAScript 6 规范中新定义的对象,例如Array,Date ...

  2. ES6中对象的扩展

    ES6不仅为字符串.数值和数组带来了扩展,也为对象带来了很多新特性.这一节,我们来一起学习一下对象的扩展. 对象的传统表示法 我们回顾一下,对象的传统表示法: let person = { " ...

  3. 关于es6中对象的扩展

    1.Object.is() es5比较两个值是否相等,只有两个运算符,相等(==) 和 严格相等(===),他们都有缺点,前者会自动转换数据类型,后者的NaN不等于自身,以及+0 等于 -0.es6提 ...

  4. ES6 之 对象的扩展

    1.Object.is() 判断俩个值是否相等 +0 不等于 -0 NaN 等于自身 console.log(Object.is('foo','foo')); // true console.log( ...

  5. es6学习笔记--字符串&数值&数组&函数&对象的扩展

    这几天抽空学习了es6语法,关于字符串,数值,数组,函数以及对象的扩展,看到es6标准入门这本书,里面讲的扩展特别多,我认为有几部分在项目上用不到,就挑有用的当笔记学习了. 字符串的扩展 str.in ...

  6. ES6的新特性(9)——对象的扩展

    对象的扩展 属性的简洁表示法 ES6 允许直接写入变量和函数,作为对象的属性和方法.这样的书写更加简洁. const foo = 'bar'; const baz = {foo}; baz // {f ...

  7. ES6对象的扩展及新增方法

    1.属性的简洁表示法 ES6允许直接写入变量和函数,作为对象的属性和方法.这样的书写更加简洁. const foo = 'bar'; const baz = {foo}; baz//{foo:'bar ...

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

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

  9. ES6 数组、对象的扩展

    8. 数组的扩展 扩展运算符(...),将一个数组转为用逗号分隔的参数序列. 复制数组 const a2=[...a1] 合并数组 [...arr1, ...arr2, ...arr3]; arr1. ...

  10. ES6(阮一峰)对象的扩展

    1.属性的简洁表示法 允许直接写入变量和函数,作为对象的属性和方法. const foo = 'bar'; const baz = {foo};//等同于 const baz = {foo : &qu ...

随机推荐

  1. 向treeview中加载数据

    1.获取树节点的值,用事件AfterSelect加载(id值的获取,用name来获取) 2.双击treeview控件得到 private void treeView1_AfterSelect(obje ...

  2. 扩展RBAC用户角色权限设计方案(转载)

    扩展RBAC用户角色权限设计方案  来源:https://www.cnblogs.com/zwq194/archive/2011/03/07/1974821.html https://blog.csd ...

  3. 修改tomcat命令黑窗口的名字

    一.为什么要修改tomcat黑窗口的名字 同时启动多个tomcat时,不好区分,而给tomcat的命令窗口取名区分是个不错的选择,例如下面这个效果. 二.修改的方法 1.找到tomcat的bin目录下 ...

  4. java——初识

    java是现在最火的高级编程语言之一,功能强,应用广. java可以做什么? 1. 开发桌面应用程序 2. 开发面向Internet的应用程序 开发java程序的基本步骤: 1. 编写源程序:mypr ...

  5. Exception in thread "main" java.lang.NoClassDefFoundError: org/apache/hadoop/fs/CanUnbuffer

    在执行spark on hive 的时候在  sql.show()处报错 : Exception in thread "main" java.lang.NoClassDefFoun ...

  6. 学用纯CSS3打造可折叠树状菜单

    CSS执行顺序与优先权的问题其实就是一个冲突解决的问题,当同一个元素(或内容)被CSS选择符选中时,就要按照优先权取舍不同的CSS规则,这其中涉及到的问题其实很多.首先就是CSS规则的specific ...

  7. markdown 语法指南

    说明:左边是markdown的语法 右边是预览.(我这里用了黑色的背景,一般白色较多) 1. 标题 2.列表 3.引用 (1)一层引用 (2)多层引用 4.图片(如果是本地:按照语法写图片路径:如果是 ...

  8. sublime text2 中标签高亮效果BracketHighlighter插件

    1.打开package Control,选择install Package 2.输入BracketHighlighter,回车 3.这样该插件会自动安装,安装后所有的提示高亮都是白色或没有提示.按 p ...

  9. 关于数据分析的4点心得:维度、指标、KPI

    1.看数据看维度 在对某一项业务或者业务的某个模块进行分析时,可以从大小两个角度去切入分析. 首先站在广阔的视角去看待一些数据.比如对某个产品(消费品),就要分析在大环境下是一个什么样的数据,如市场排 ...

  10. 章节六、3-读取Properties属性文件

    一.如何读取Properties文件1.创建一个名为ReadingProperties的类 2.创建一个.propertise属性的文件,创建的方式参考“二”中步骤 3.写入如下代码 package ...