问答

js如何为对象指定属性快捷赋值?

作者:admin 2021-05-09 我要评论

场景:在web应用中做编辑功能的时候,往往会先调用一个 详情 接口,然后赋值给 model ,最后点击保存,但是我们编辑时往往可能属性很少,但是 详情 接口返回的数...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

场景:在web应用中做编辑功能的时候,往往会先调用一个详情接口,然后赋值给model,最后点击保存,但是我们编辑时往往可能属性很少,但是详情接口返回的数据比较多,如果我们通过Object.assign({}, this.formData, res) 来赋值,会导致 this.formData有很多不必要的属性,如果不这样赋值,就需要写很多代码为一个个属性赋值,有没有好一点的办法,既能够方便为对象属性赋值,又能不污染原始对象呢?

###
const result = {}
for(let key of Object.keys(this.formData)){
    result[key] = res[key] || this.formData[key];//(这里要注意深浅拷贝)
}
return result;
###

首先,如果是表单数据,一般不应该有嵌套结构,如果有嵌套对象,则需要考虑深拷贝。在不考虑嵌套的情况下,可以简单的写个patch函数来修改对象值

function patchValue(target, values) {
  Object.keys(target).forEach(k => {
    if (values[k] !== undefined) { // 此处可以调整patch逻辑
      target[k] = values[k]
    }
  })
}

const res = { a: 1, b: 2, c: 3 }
patchValue(res, { a: 11, c: null })
// res: {a: 11, b: 2, c: null}

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • grom设置json默认值

    grom设置json默认值

  • Vue路由报错,看着没问题

    Vue路由报错,看着没问题

  • 思否邮箱登录为什么区分大小写了呢?

    思否邮箱登录为什么区分大小写了呢?

  • 有没有能够直接上传markdown文件作为博

    有没有能够直接上传markdown文件作为博

腾讯云代理商
海外云服务器