ES6系列--对象扩展

ES6允许直接写入变量和函数，作为对象的属性和方法。

var foo = 'bar';
var baz = {foo};
baz // {foo: "bar"}

var fa = 'aa';
var mu = function(){
console.log(1);
}
var bo = {fa,mu};
console.log(bo) //VM2019:6 {fa: "aa", mu: ƒ}

扩展:

Getters 和 setters

let obj = {get propName() {// getter, the code executed on getting obj.propName},set propName(value) {// setter, the code executed on setting obj.propName = value}
};

let user = {name: "John",surname: "Smith",get fullName() {return `${this.name} ${this.surname}`;},set fullName(value) {[this.name, this.surname] = value.split(" ");}
};// set fullName is executed with the given value.
user.fullName = "Alice Cooper";alert(user.name); // Alice
alert(user.surname); // Cooper

Javascript对象有两种属性，一种是数据属性，我们经常使用比较熟悉；第二种是访问器属性，本质就是获取和设置值的函数，但从代码上好像是正常属性

属性只能是访问器或数据属性，不能都是。如果我们视图给描述符同时提供get和value，会报错：

// Error: Invalid property descriptor.
Object.defineProperty({}, 'prop', {get() {return 1},value: 2
});

Object.js

ES5比较两个值是否相等

Object.is('foo', 'foo')
// true
Object.is({}, {})
// false

+0 === -0 //true
NaN === NaN // false  

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

Object.defineProperty(Object, 'is', {  value: function(x, y) {  if (x === y) {  // 针对+0 不等于 -0的情况  return x !== 0 || 1 / x === 1 / y;  }  // 针对NaN的情况  return x !== x && y !== y;  },  configurable: true,  enumerable: false,  writable: true
});

function clone(origin) {
let originProto = Object.getPrototypeOf(origin);
return Object.assign(Object.create(originProto), origin);
}

const merge =
(target, ...sources) => Object.assign(target, ...sources);

const DEFAULTS = {　　log:1,    out:'html'};function proceeContent(option){   Object.assign({},DEFAULTS,options);};

Object.assign()

Object.assign方法用于对象的合并，将源对象（source）的所有可枚举属性，复制到目标对象（target）

ES5有三个操作会忽略enumerable为false的属性。

for...in循环：只遍历对象自身的和继承的可枚举的属性
Object.keys()：返回对象自身的所有可枚举的属性的键名
JSON.stringify()：只串行化对象自身的可枚举的属性
- ES6新增了一个操作Object.assign()，会忽略enumerable为false的属性，只拷贝对象自身的可枚举的属性。　　
- 这四个操作之中，只有for...in会返回继承的属性。实际上，引入enumerable的最初目的，就是让某些属性可以规避掉for...in操作。

转载于:https://www.cnblogs.com/laopang/p/8359488.html

ES6系列--对象扩展相关推荐

ES6新增语法与内置对象扩展
技术交流QQ群:1027579432,欢迎你的加入! 欢迎关注我的微信公众号:CurryCoder的程序人生 1.什么是ES6 ES的全称是ECMAScript,它是由ECMA国际标准化组织制定的一项 ...
第九节：ES6为对象做了哪些扩展？
ES6不仅为字符串.数值和数组带来了扩展,也为对象带来了很多新特性.这一节,我们来一起学习一下对象的扩展. 对象的传统表示法我们回顾一下,对象的传统表示法: let person = { " ...
ES6新特性_ES6的对象扩展方法---JavaScript_ECMAScript_ES6-ES11新特性工作笔记040
然后我们看一下es6中的对象扩展方法可以看到有个Object.is(120,121); 这个相当于判断是否相等,也就是是否是某个对象. 可以看到120,和121 不相等. 然后120和120相等. ...
es6调用c语言sdk,ES6 关于对象的扩展-contracts-WinFrom控件库|.net开源控件库|HZHControls官网...
今天来简单说下ES6 中对象的扩展首先回顾传统的对象表示法 let person={ 'name':'zhang', 'age':'20', 'play':function(){ alert('pl ...
es6 内置对象扩展rest, Arry 扩展方法Array.from(),find(), findIndex(),includes()
1.es6内置对象扩展rest实参 2. Arry 扩展方法 (1)构造函数方法:Array.from() (2) find() (3) findIndex() (4)includ ...
大白话，讲编程之《ES6系列连载》汇总，再也不用翻历史消息了
想翻看以前的ES6系列章节,老是要查看公众号的历史消息,特别是在地铁里没wifi的时候,每次页面切换都要load很久,相当麻烦. 别怕,最懂你们的前端君又来了,来一篇完美的汇总,你要的ES6,都在这里 ...
ES6 系列之 let 和 const
块级作用域的出现通过 var 声明的变量存在变量提升的特性: if (condition) {var value = 1; } console.log(value); 复制代码初学者可能会觉得只有 ...
ES6 系列之 Babel 是如何编译 Class 的(上)
前言在了解 Babel 是如何编译 class 前,我们先看看 ES6 的 class 和 ES5 的构造函数是如何对应的.毕竟,ES6 的 class 可以看作一个语法糖,它的绝大部分功能,ES5 ...
ES6 系列之 WeakMap的使用示例
ES6 系列之 WeakMap的使用示例这篇文章主要介绍了ES6 系列之 WeakMap的使用示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧前言我们先从 Wea ...

ES6系列--对象扩展

Getters 和 setters

Object.js

ES6系列--对象扩展相关推荐

最新文章

热门文章