听说,JavaScript中,这几个操作对象的方法很实用

 引言

操作 JavaScript 对象是日常工作中经常接触的工作,随着 JavaScript 的飞速发展,解决问题的方法越来越多了,本文整理了 6 个比较实用的操作对象的方法。

Object.create()

以参数为原型,创建一个新对象实例。

 
 
  1. const user = {
  2.   name: 'kylin',
  3.   age: 18,
  4.   gender: '女',
  5.   work: 'dev',
  6.   say() {
  7.     console.log(`姓名:${this.name} ,年龄:${this.age} ,性别:${this.gender}`);
  8.   }
  9. };
  10. const my = Object.create(user);
  11. my.say(); // 姓名:kylin ,年龄:18 ,性别:女
  12. my.name = 'Tom';
  13. my.year = '2020';
  14. console.log(my.name); // Tom
  15. console.log(my.year); // 2020

Object.assign()

将所有可枚举的属性从一个或多个对象合并 (复制) 到一个新对象上。

Object.assign() 方法有 2 个参数,第 1 个参数是目标对象,第 2 个参数是源对象。如果有同名属性,后面对象的属性会覆盖前面对象的属性。

 
 
  1. const userBasic = {
  2.   name: 'kylin',
  3.   age: 20,
  4. };
  5. const userInfo = {
  6.   age: 18,
  7.   gender: '女',
  8.   work: 'dev',
  9.   say() {
  10.     console.log(`姓名:${this.name} ,年龄:${this.age} ,性别:${this.gender} ,工作:${this.work}`);
  11.   }
  12. };
  13. const user = Object.assign(userInfo, userBasic);
  14. user.say(); // 姓名:kylin ,年龄:20 ,性别:女 ,工作:dev

也可以合并成一个新对象。

 
 
  1. const userBasic = {
  2.   name: 'kylin',
  3.   age: 18,
  4.   gender: '女',
  5.   say() {
  6.     console.log(`姓名:${this.name} ,年龄:${this.age} ,性别:${this.gender}`);
  7.   }
  8. };
  9. const user = Object.assign({}, userBasic);
  10. user.say(); // 姓名:kylin ,年龄:18 ,性别:女

Object.keys()

返回包含对象自身可枚举的所有属性组成的数组。

 
 
  1. const user = {
  2.   name: 'kylin',
  3.   age: 18
  4. };
  5. Object.defineProperty(user, 'gerder', {
  6.   value: "女",
  7.   enumerable: false // 不可枚举
  8. });
  9. console.log(Object.keys(user)); // ["name", "age"]

Object.values()

返回包含对象自身所有可枚举属性的值组成的数组,值的顺序与使用 for...in 循环的顺序相同。

 
 
  1. const user = {
  2.   name: 'kylin',
  3.   age: 18
  4. };
  5. Object.defineProperty(user, 'gerder', {
  6.   value: "女",
  7.   enumerable: false // 不可枚举
  8. });
  9. console.log(Object.values(user)); // ["kylin", 18]

Object.entries()

将对象的属性和值 (键和值) 用数组的形式表现出来。即返回包含对象自身可枚举属性的键值对组成的数组。

 
 
  1. const user = {
  2.   name: 'kylin',
  3.   age: 18
  4. };
  5. const info = Object.entries(user);
  6. console.log(info); // [['name', 'kylin'], ['age', 18]]

Object.fromEntries()

相当于 Object.entries() 方法的逆操作,将键值对形式的数组转换成对象。

 
 
  1. const user = Object.fromEntries([
  2.   ['name', 'kylin'],
  3.   ['age', 18]
  4. ]);
  5. console.log(user); // {name: "kylin", age: 18}

当前标题:听说,JavaScript中,这几个操作对象的方法很实用
转载源于:http://www.shufengxianlan.com/qtweb/news44/354144.html

网站建设、网络推广公司-创新互联,是专注品牌与效果的网站制作,网络营销seo公司;服务项目有等

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联