日常JS数据各种操作方法总结~~欢迎大家留言板补充哦~~

需求情景一:

复制代码
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>

<body>
  <script>
    // 需求如下,我們需要使用result的屬性對應值,同時修改部分屬性的屬性名
    // 使用ObjA和resultult共有屬性+ObjB和result共有屬性
    // 去掉result中無用屬性
    const result = {
      need1: '這個屬性值是有用的1',
      need2: '這個屬性值是有用的2',
      need3: '這個屬性值是有用的3',
      need4: '這個屬性值是有用的4',
      need5: '這個屬性值是有用的5',
      need61: '這個屬性值是有用的6,屬性名需要修改成need6',
      need71: '這個屬性值是有用的7,屬性值需要修改成need7',
      need81: '這個屬性值是有用的8,屬性值需要修改成need8',
      need91: '這個屬性值是有用的9,屬性值需要修改成need9',
      other1: '這個屬性沒什麼用',
      other2: '這個屬性沒什麼用',
    }
    const ObjA = {
      need1: '這個屬性是有用的1',
      need2: '這個屬性是有用的2',
      need3: '這個屬性是有用的3',
      need4: '這個屬性是有用的4',
      need5: '這個屬性是有用的5',
      unwanted1: '不需要這個屬性1',
      unwanted2: '不需要這個屬性2',
      unwanted3: '不需要這個屬性3',
    }
    // 此函數用來對照修改Rresult對象的屬性
    const ObjB = {
      need61: 'need6',
      need71: 'need7',
      need81: 'need8',
      need91: 'need9',
    }
    // 現在有下面三種實現方法,我們來做一下對比~
    let resultArr1 = []
    let resultArr2 = []
    let resultArr3 = []
    Object.keys(result).forEach(_ => {
      if (ObjA[_] || ObjB.hasOwnProperty(_)) {
        resultArr1.push((ObjB[_] ? ObjB[_] : _) + ':' + (result[_] || ''))
      }
    })
    resultArr2 = Object.keys(result).map(_ => {
      if (ObjA[_] || ObjB.hasOwnProperty(_)) {
        return (ObjB[_] ? ObjB[_] : _) + ':' + (result[_] || '')
      }
    }).filter(_ => _)
    Object.keys(result).reduce((init, _) => {
      if (ObjA[_] || ObjB.hasOwnProperty(_)) {
        init.push((ObjB[_] ? ObjB[_] : _) + ':' + (result[_] || ''))
      }
      return init
    }, resultArr3)
    console.log('resultArr1', resultArr1)
    console.log('resultArr2', resultArr2)
    console.log('resultArr3', resultArr3)
    // 0: "need1:這個屬性是有用的1"
    // 1: "need2:這個屬性是有用的2"
    // 2: "need3:這個屬性是有用的3"
    // 3: "need4:這個屬性是有用的4"
    // 4: "need5:這個屬性是有用的5"
    // 5: "need6:這個屬性是有用的6,屬性名需要修改成need6"
    // 6: "need7:這個屬性是有用的7,屬性值需要修改成need7"
    // 7: "need8:這個屬性是有用的8,屬性值需要修改成need8"
    // 8: "need9:這個屬性是有用的9,屬性值需要修改成need9"
  </script>
</body>

</html>
复制代码

 

posted @   糖~豆豆  阅读(181)  评论(0编辑  收藏  举报
编辑推荐:
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
阅读排行:
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构
· 字符编码:从基础到乱码解决
Live2D
欢迎阅读『日常JS数据各种操作方法总结~~欢迎大家留言板补充哦~~』
点击右上角即可分享
微信分享提示