首页 > 其他分享 >写一个方法去掉对象的多余属性

写一个方法去掉对象的多余属性

时间:2024-12-28 09:18:53浏览次数:6  
标签:city const 对象 newObj 多余 key 去掉 属性

在前端开发中,有时我们需要从对象中删除多余的属性,以减小数据的大小或避免将不必要的数据发送到服务器。这可以通过创建一个新的对象,并从原始对象中选择性地复制所需的属性来实现。以下是一个简单的JavaScript函数,该函数接受一个对象和一个包含所需属性名称的数组,然后返回一个新对象,其中仅包含这些属性:

function removeUnwantedProperties(obj, wantedProperties) {
    const newObj = {};
    for (const key of wantedProperties) {
        if (obj.hasOwnProperty(key)) {
            newObj[key] = obj[key];
        }
    }
    return newObj;
}

你可以这样使用这个函数:

const person = {
    name: 'John Doe',
    age: 30,
    city: 'New York',
    country: 'USA',
    password: 'secret123'
};

const wantedProps = ['name', 'age', 'city'];

const updatedPerson = removeUnwantedProperties(person, wantedProps);

console.log(updatedPerson);
// 输出: { name: 'John Doe', age: 30, city: 'New York' }

在这个例子中,removeUnwantedProperties 函数创建了一个新的对象 newObj,并从 person 对象中复制了 nameagecity 属性。passwordcountry 属性被排除在外,因为它们不在 wantedProps 数组中。

标签:city,const,对象,newObj,多余,key,去掉,属性
From: https://www.cnblogs.com/ai888/p/18637114

相关文章

  • 【WPF】WPF 双向绑定中的 SelectedItem 与 ViewModel 属性更新机制详解
     在WPF开发中,ListBox等控件常用于显示绑定的数据集合,其中ItemsSource绑定的数据源,在没有显式设置 Mode 属性时,默认为单向绑定,它将数据源集合的内容传递给 ListBox,但不会反向更新数据源。而SelectedItem ,默认情况下它的绑定是双向的。这意味着当用户在 ListBox 中......
  • UML之属性与参数的多重性
    在UML中,多重性是指一个条目潜在的数量范围。多重性可被用于属性、操作参数、关联关系。UML元模型也使用多重性对元模型元素之间的关系进行约束。多重性总是包含基数值,它是相关条目在现实世界中的确切数量。本文将说明类属性和类操作参数的多重性。一、属性的多重性假设我们需要......
  • UML之属性与参数的多重性
    在UML中,多重性是指一个条目潜在的数量范围。多重性可被用于属性、操作参数、关联关系。UML元模型也使用多重性对元模型元素之间的关系进行约束。多重性总是包含基数值,它是相关条目在现实世界中的确切数量。本文将说明类属性和类操作参数的多重性。一、属性的多重性假设我们需......
  • Nginx配置之全局配置属性
    nginx全局属性的配置usernobody;#主模块命令,指定Nginx的worker进程运行用户以及用户组,默认由nobody账号运行。worker_processes1;#指定Nginx要开启的进程数。worker_rlimit_nofile100000;#worker进程的最大打开文件数限制error_loglogs/error.log;error_loglogs......
  • css中表示颜色相关的属性有哪些?
    在CSS中,表示颜色相关的属性有多种,以下是一些主要的颜色属性及其表示方法:颜色名称:CSS预定义了一系列颜色名称,可以直接使用这些名称来表示颜色。例如,“red”代表红色,“green”代表绿色,“blue”代表蓝色等。这些预定义颜色名称提供了简便的方式来指定常见颜色。RGB(红绿蓝):RGB是......
  • 兼容性预览及边框、阴影、背景属性
    兼容性-webkit- :chrome(谷歌) Safari(苹果)-moz- :firefox(火狐)-o- :opera(欧朋)-ms- :IE边框圆角半径:border-radius   一个用于设置所有四个边框-*-半径属性的速记border-top-left-radius :左 上border-top-right-radius :右 上border-b......
  • Vue-跨域、计算属性、监听属性
    跨域同源策略:同源策略会引起跨域问题,是浏览器中的安全协议,主机、协议、端口只要有一个不一致,就会引起同源策略,从而引起跨域问题解决办法:1.放开后台(不安全)2.利用script标签中的src属性不受同源策略影响的特点,这种方式叫做JSONP(也需要跟后台配合)3.配置代理(在本地起一个服务,再去......
  • WPF TabControl 去掉鼠标悬浮效果
     1.资源<Window.Resources><Stylex:Key="TabStyle"TargetType="TabItem"><SetterProperty="TextBlock.FontSize"Value="12"/><SetterProperty="Template">......
  • grid布局有哪些属性?
    Grid布局,又称为CSS网格布局,是W3C提出的一个二维布局系统,允许开发者以行和列的形式来布局网页内容。它提供了丰富的属性和方法来精确控制布局的各个方面。以下是Grid布局的主要属性:一、容器属性(应用于网格容器)display:设置元素为网格容器,可选值为grid(块级网格)或inline-grid(行内网......
  • html中video标签的poster属性如何铺满video标签?
    在HTML中,<video>标签的poster属性用于指定视频加载时显示的封面图像。要使poster图像铺满整个<video>标签,你可以使用CSS样式来设置。下面是一个示例,展示如何使poster图像铺满<video>标签:<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><......