zoukankan      html  css  js  c++  java
  • 记录一些常用的方法

    一些函数的封装

    1.根据模板处理数据

    后端反的数据

    处理成循环的数组

    方法1:

    先把后端返回的数据处理成可以循环的数组进行双向绑定,再把循环的数组处理成后端需要的字段进行提交

      let data = [
        {drugName:'',drugFrequency:'',drugUse:''},
        {drugName:'',drugFrequency:'',drugUse:''},
        {drugName:'',drugFrequency:'',drugUse:''},
      ]
      let dataTemplate = ['drugName','drugFrequency','drugUse']
      const  mergeObject = (function(arr,arr2){
        let newObje = {}
        for(let i = 0; i < arr.length; i++){
            var data = arr[i]//每行的数据
            for(let j = 0 ; j < arr2.length; j++){
                // newData2.childName 1 = data.childName
                newObje[`${arr2[j]}${i+1}`] = data[arr2[j]]// 给模板进行行赋值;
            }
        }
        return newObje
    })
      let muban =  mergeObject(data,dataTemplate)
    

    方法二:

         // 处理成数组对象
         let list  = [{},{},{},{},{}]
         for(let key in res){
         let newkey =  key.substr(0, key.length - 1);
           for(let i = 0; i < 5; i++){
             if(!list[i].hasOwnProperty(newkey)){
               list[i][newkey] = ""
             }
           }
         }
        // console.log(list)
    
         // 还原成后端提交规定的字段
         let obj ={}
         let newList = [...list]
          newList.forEach((item, index) => {
          for(let val in item){
            obj[val + (index +1)] = item[val]
          }
        })
        // console.log(obj)
    

    2.数组去重 对象 || id相同的对象

    indexOf() , reduce()

    方法一:

      let arrRe = [
        {id:1, name: '张三', age: 18},
        {id:1, name: '张三', age: 18},
        {id:2, name: '李四', age: 14},
        {id:2, name: '李四', age: 14},
      ]
    const arrFnc = (function(arr){
      let arrId = []// 获取所有id
      let newArr = []
      // 第一遍循环取出所有的id,并且取出重复的id
      for (let i = 0; i < arr.length; i++) {
        if(arrId.indexOf(arr[i].id) == -1){
          arrId.push(arr[i].id)
        }
      }
      // 第二遍循环拿着存放的id去查找传过来的arr数组
      for(let i = 0; i < arrId.length; i++){
        for(let j = 0; j < arr.length; j++){
          if(arrId[i] == arr[j].id){
            // debugger
            newArr[i] = arr[j]
          }
        }
      }
      return newArr
    })
      let dataarr = arrFnc(arrRe)
    

    方法二:

    reduce使用方法: 求和

    var numbers = [15, 2, 1, 5, 6];
    // preVal: 输出的是第一项的值或上一次叠加的结果,curVal: 正在被处理的元素,
    sum = numbers.reduce(function(preVal,curVal){
      return preVal + curVal // 0 + 15; 15 + 2; 17 + 1; 18 + 5; 23 + 6;
    },0)  // 0 传递给函数的初始值
    console.log(sum) // 29
    

    数组对象去重

    let arrRe = [
      {id:1, name: '张三', age: 18},
      {id:1, name: '张三', age: 18},
      {id:2, name: '李四', age: 14},
      {id:2, name: '李四', age: 14},
    ]
    let hash = {};
    data3 = arrRe.reduce(function(preVal, curVal) {
    hash[curVal.id] ? ' ' : hash[curVal.id] = true && preVal.push(curVal);// 如果hash没有这个属性,就push到preVal里
    return preVal
    }, []);// 默认传个空数组
    console.log(333,data3);
    

    3.找出两个数组对象相同的属性值, 如果一样就合并

    find() , Object.assign() , Object.fromEntries() , forEach() , map()

    方法一:

    A.map(item =>{
    const matched = B.find(({chineseName}) => chineseName == item.name);
    if(matched){
    	Object.assign(item,{icon:matched.icon})
    }
    })
    

    方法二:

    const _B = Object.fromEntries(B.map(({ chineseName, ...rest }) => [chineseName, rest]));
    A.forEach(item => {
        const matched = _B[item.name];
        if (matched) {
            Object.assign(item, { icon: matched.icon });
        }
    });
    

    4.判断对象是否在数组里面

    indexOf()
     let list = [
            { name: "张三" },
            { name: "李四" },
            { name: "王五" },
            { name: "赵六" },
          ]
     let val = { name: '张三' }
     const isExist = (function(list,val){
      return JSON.stringify(list).indexOf(JSON.stringify(val)) != -1
    })
     let isData = isExist(list,val)// true
    

    5.根据数组的值 来过滤数组对象

    filter() , indexOf()
     let list = [
          { name: "张三" },
          { name: "李四" },
          { name: "王五" },
          { name: "赵六" },
        ]
     let appointList = ['张三', '李四']
     const fncAppoint = function(list,appointList){
      return list.filter(item => appointList.indexOf(item.name) != -1)
    }
     let Appoint = fncAppoint(list,appointList)
    

    6.处理树数组对象,

    hasOwnProperty() 方法会返回一个布尔值,指示对象自身属性中是否具有指定的属性

    方法一:

        var data = [
        {target1:31},
        {target1:32},
        {target1:33},
        {target1:34},
        {target2:41},
        {target2:42},
        {target2:43},
        {target2:44},
        {target3:51},
        {target3:52},
        {target3:53},
        {target3:54}
        ];
        var tindex = 0;
        var list = [];
        //第一步找出target1出现几次,表示有几个对象,顺便给list的对象index值赋了
        data.forEach(item => {
          if (item.target1) {
            list.push({
              "index": tindex,
            })
            tindex += 1;
          }
        })
        //第二部开始拼,最终结果是list
        data.forEach(item => {
          //循环对象
          for (let key in item) {
            for (var i = 0; i < list.length; i++) {
              //判断对象是否有这个属性,如果有就是已经赋值过了。
              if (!list[i].hasOwnProperty(key)) { //如果list数组对象没有这个key 就添加进去
                list[i][key] = item[key]
                break;
              }
            }
          }
        })
    
  • 相关阅读:
    Win10 UWP Tile Generator
    Win10 BackgroundTask
    UWP Tiles
    UWP Ad
    Win10 build package error collections
    Win10 八步打通 Nuget 发布打包
    Win10 UI入门 pivot multiable DataTemplate
    Win10 UI入门 导航滑动条 求UWP工作
    UWP Control Toolkit Collections 求UWP工作
    Win10 UI入门 SliderRectangle
  • 原文地址:https://www.cnblogs.com/cl1998/p/14292634.html
Copyright © 2011-2022 走看看