深入理解ES6 ---对象(object)

原创 2017年09月13日 00:16:18

前言

在JavaScript中几乎每一个值都是某种特定的对象 ,例如数字是属于Number 类型的对象,字符串是String 类型的对象.可见对象在JavaScript中的重要性,而在ES6中着重通过多种方式加强对象的使用,通过简单的而语法扩展,提供更多操作对象及与对象交互的方法.

对象的字面量语法扩展

属性初始化的简写

在 ES5以及更早的版本中,对象字面量只是简单的键值对的集合,这意味着初始化属性值会有一些重复,例如

function createPerson(name,age){
    return {
        name:name,
        age:age
    };
}

这是一个简单的工厂函数,createPerson创建了一个对象,并且其属性名称和函数的参数相同,但是name 和age 重复了两遍,只是其中一个是对象属性的名称,另外一个是为属性赋值的变量.
在 ES6 中可以使用属性初始化的简写语法,能够消除这种属性值与局部变量之间的重复书写.
可以改写为如下:

function createPerson(name,age){
    return {
        name,
        age
    };
}

对象方法的简写
ES6中对象不但简化了对象字面量的简写方式,还有对象方法 的简写方式
例如:

var person = {
    name:"Joe",
    sayName:function(){
        console.log(this.name);
    }
}

可以简写为如下:

var person = {
    name:"Joe",
    sayName(){
        console.log(this.name);
    }
}

简写消除了分号和function关键字.
这种写法与之前唯一的不同是可以添加super 关键字

可计算属性名

在ES5 中,假设一个对象的属性名不符合命名规则,可以使用中括号来代替点去读写属性值.

在ES6 中强化了这一点,允许使用计算属性为对象的属性名

var person = {},
    lastName = "last name";

    person["first name"] = "Joe";
    person[lastName] = "Smith";

    console.log(person["first name"]);//Joe
    console.log(person["last name"]);//Smith

    var last = "last";
    console.log(person[last+" name"]);//Smith

object 新增的方法

Object.is()方法
在JavaScript是弱类型的语言,在判断两个值是否相等的时候需要使用 == 或 === 来判断 ,后者会判断类型,更受开发者喜爱,从而避免在比较是触发强制类型转换(当==比较时,类型不相等的情况下,都会转化为string类型来比较).
这可以解决大多数问题,但是也不完全准确,例如 +0 和 -0 ,在二进制表示是正好相反.,但比较结果却是一致,再比如 NaN (not a number)
和自身比较,就需要使用isNaN() 来判断.

Object.is()方法,除了这两点比较的结果和 === 比较的结果有所差异,其它比较都是表现一致.

console.log( +0==-0);//true
console.log( +0===-0);//true
console.log( Object.is(+0,-0));//false

console.log( NaN ==NaN);//false
console.log( NaN ===NaN);//false
console.log( Object.is(NaN,NaN));//true

Object.assign() 方法
assign 方法是用来在JavaScript中实现对象组合的一种方式
Object.assign 大致等同于

function mixin(receiver, supplier){
    Object.keys(supplier).forEach(function(key){
        receiver[key] = supplier[key];
    });
    return receiver;
}

Object.assign(receiver,supplier,…supplier);第一个参数为接收属性的对象,后面可以为任意多个参数,如果遇上同名属性,后者会覆盖前者。

重复的对象字面量 ,自有属性枚举顺序

在ES5 严格模式下 ,对象重复定义重名属性会有语法错误,ES6 严格模式改变了这一点,重名属性后者会覆盖前者。和ES5 默认模式下保持一致。
自由枚举顺序
ES6严格规定了对象的自有属性被枚举时的返回顺序,这会影响到Object.getOwnPropertyNames() 方法及 Reflect.ownKeys 返回属性的方式,Object.assign() 方法处理属性的顺序也随之改变
自由属性被枚举顺序的基本规则如下:

  1. 所有数字键按升序排序。
  2. 所有字符串键按照它们被加入对象的顺序排序。
  3. 所有symbol 键 按照它们被加入对象的顺序排列

示例

var obj = {
    a:1,
    0:1,
    c:1,
    2:1,
    b:1,
    1:1
};
console.log(Object.getOwnPropertyNames(obj).join(""));//012acb
版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

ES6学习——新的语法:对象解构(Object Destructuring)

解构在ES6中应该是一种新的语法,在其他语言中我没怎么见到这种语法,也可以说是赋值操作的另一种形式,因为解构的整个定义都在规范的赋值操作符章节下面,有兴趣的可以看规范的12.14.5。目前浏览器对这个...

es6 javascript的对象Object.getOwnPropertyDescriptors()

ES5 有一个Object.getOwnPropertyDescriptor方法,返回某个对象属性的描述对象( descriptor )。 var obj = { p: 'a' }; Object....

ES6---全新的对象object

在JavaScript中,对象是一个很重要的概念,开发过程中,我们肯定离不开对象的。ES6追求高效、简洁,这次标准制定也为对象带来了很大的福利……●ES6中对象属性://////es5中定义对象属性要...

JavaScript对象扩展(Object.is(), assign(), 对象遍历keys, es6原型介绍)

对象创建新方法ES6允许直接写入变量和函数,作为对象的属性和方法。这样的书写更加简洁。 上面代码表明,ES6允许在对象之中,只写属性名,不写属性值。这时,属性值等于属性名所代表的变量。//例1: ...

ECMAScript6(ES6)标准之对象Object扩展方法及新特性

ES6对于Object也扩增了几个方法 不过最重要的是 ES6扩展了一些语法 比如说允许直接写入变量和函数,作为对象的属性和方法 使我们的对象更加简洁 下面我就来详细说明一下语法扩展简写对象...

es6 javascript对象Object.values() , Object.entries()

1 Object.keys() ES5 引入了Object.keys方法,返回一个数组,成员是参数对象自身的(不含继承的)所有可遍历( enumerable )属性的键名。 var obj =...

ES6---解构赋值number、bool、string、array、function、object

ES5中,各种变量、对象的赋值,只能一对一的赋值,es6已经改革,新标准允许我们分组赋值,变量与值位置对应,一一赋值,这便是解构赋值。●string字符串解构赋值:let [w,b,i]='wbi';...

再不用ES6就Out了--Object中新增的几个方法

Object.is(a, b) 讲到这个方法之前,首先要再谈到一下==和===的区别 (如果你还在代码中写== -_-!) ==: 在比较的时候会自动转换类型,才去比较。 ===: 唯一...

深入理解ES6翻译完整版.pdf

  • 2017-08-15 20:58
  • 2.11MB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)