对象的扩展,对象新增方法

属性的简洁表示法

const foo = 'bar';
const baz = {foo};
console.log(bar);//{foo:"bar"}
//等同于以下
const baz = {foo: foo}


function f(x,y){
    return {x,y};
}
//等同于以下
function f(x,y){
    return { x: x,y: y };
}

除了属性可以简写  方法也可以简写

const o = {
    method() {
        return "hello";
    }
};
//等同于以下
const o = {
    method: function() {
        return "hello";
    }
};

属性的可枚举性和遍历

对象的每个属性都有一个描述对象,用来控制该属性的行为。

Object.getOwnPropertyDescriptor(obj, 'foo');

{
    value: 123,
    writable: true,
    enumerable: true,
    configurable: true,
}

描述对象的enumerable属性,称为"可枚举性";如果为false,某些操作会忽略当前属性(如下四个操作);

for...in循环:只遍历对象自身的和继承的可枚举的属性;

Object.keys():返回对象自身的所有可枚举的属性的键名;

JSON.stringify():只串行化对象自身的可枚举的属性;

Object.assign():ES6新增;只拷贝对象自身的可枚举的属性;

Object.getOwnPropertyNames(obj):返回一个数组,包含对象自身的所有属性(不含Symbol属性)的键名;

Object.getOwnPropertySymbols(obj):返回一个数组,包含对象自身的所有Symbol属性的键名;

Reflect.ownKeys(obj):返回一个数组,包含对象自身的所有键名;

遍历规则如下:

首先遍历所有数值键,按照数值升序排列;

其次遍历所有字符串键,按照加入时间升序排列;

最后遍历所有Symbol键,按照加入时间升序排列;

Reflect.ownkeys({[]: 0, b: 0, 10: 0,2:0,a:0});
//['2', '10', 'b', 'a', Symbol()]

super关键字:

this关键字总是指向函数所在的当前对象,ES6新增关键字super,指向当前对象的原型对象。

const proto = {
    foo: "hello"
};
const obj = {
    foo: "world",
    find() {
        return super.foo;
    }
};
Object.setPrototypeOf(obj, proto);
obj.find();//"hello"

super关键字表示原型对象时,只能用在对象的方法之中,用在其他地方都会报错;

super.foo等同于Object.getPrototypeOf(this).foo或Object.getPrototypeOf(this).foo.call(this);

Object.is():两值是否严格相等,与严格比较运算符(===)的行为基本一致,不同的只有两个:一是+0不等于-0,二是NaN等于自身;

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

Object.assign(target,source1,source2);

若参数不是对象,则先转成对象,然后返回;

由于undefined和null无法转成对象,所以作为参数会报错;

typeof Object.assign(2);//Object
Object.assign(undefined);//报错
Object.assign(null);//报错

Object.getOwnPropertyDescriptor():ES5,方法会返回某个对象属性的描述对象

Object.getOwnPropertyDescriptors():ES6,方法会返回指定对象所有自身属性(非继承)的描述对象;

Object.keys():返回一个数组,是参数对象自身的所有可遍历属性的键名;

const obj = { foo: 'bar',baz: 42 };
Object.keys(obj);
//["foo", "baz"]]

Object.values():返回一个数组,是参数对象自身的所有可遍历属性的键值;

const obj = { foo: 'bar',baz: 42 };
Object.values(obj);
//["bar",42]]

Object.entries()(对象转数组):返回一个数组,是参数对象自身的所有可遍历属性的键值对数组;

const obj = { foo: 'bar',baz: 42 };
Object.entries(obj);
//[["foo","bar"],["baz",42]]

Object.fromEntries()(数组转对象):是Object.entries()的逆操作,用于将一个键值对数组转为对象;

Object.fromEntries([
    ['foo', 'bar'],
    ['baz', 42]
]);//{foo: "bar",baz: 42}

该方法的主要目的有三个:

1.将键值对的数据结构还原为对象,因此很适合将Map结构转为对象;

2.配合URLSearchParams对象,将查询字符串转为对象;

const entries = new Map([
    ['foo','bar'],
    ['baz',42]
]);
Object.fromEntries(entries);//{foo: "bar",baz: 42}

const map = new Map().set("foo",true).set("baz",false);
Object.fromEntries(entries);//{foo: true,baz: false}

Object.fromEntries(new URLSearchParams('foo=bar&baz=qux'))//{foo: "bar",baz: "qux"}

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值