ES6新特性：对象优化

Posted 2022-02-26 流楚丶格念

文章目录

• 基础用法
• • 属性打印
  • 复制对象
  • 声明对象简写
  • 对象的函数属性简写
  • 拷贝对象（深拷贝）
  • 对象合并

基础用法

属性打印

const person = 
    name: 'jack',
    age: 21,
    language: ['java','js','css']
;

// 打印所有key
console.log(Object.keys(person));
// 打印所有value
console.log(Object.values(person));
// 将属性值以键值对的方式打印
console.log(Object.entries(person));

复制对象

使用Object对象的assign方法进行对象的复制

const target = a:1;
const source1 = b:2;
const source2 = c:3;
Object.assign(target, source1, source2);
console.log(target); // a:1, b:2, c:3

声明对象简写

函数声明中，如果传入名与属性名相同，我们可以直接省略冒号与传入参数名

const age = 23;
const name = "zhangsan";
const person1 = age: age, name: name;
const person2 = age, name;
console.log(person1);
console.log(person2);

对象的函数属性简写

ES6支持三种方式编写函数的属性

其中需注意：箭头函数中不能使用this

let person3 = 
    name: 'jack',
    eat: function (food) 
        console.log(this.name+'正在吃'+food);
    ,
    // 箭头函数中不能使用this
    eat2: food => console.log(person3.name+'正在吃'+food),
    eat3(food)
        console.log(this.name+'正在吃'+food);
    


person3.eat('香蕉');
person3.eat2('苹果');
person3.eat3('梨');

拷贝对象（深拷贝）

其中那那三个点是ES6的扩展运算符：不懂的可以参考我整理的另一篇基础博文：https://yangyongli.blog.csdn.net/article/details/123042910

let p1 = name: '张三', age: 28;
let p2 = ...p1;
console.log(p2);

对象合并

let p3 = name: '李四', sex: '男', birthday: '08.01';
// 如果合并的两个对象中有相同的属性值，后面的对象会覆盖前一个对象
let p4 = ...p3, ...p1;
console.log(p4);