【问题标题】:How to create a new property in a array object based on a condition in TypeScript如何根据 TypeScript 中的条件在数组对象中创建新属性
【发布时间】:2019-11-26 09:53:28
【问题描述】:

我有下面的数组对象

 arr = [
   { Name: "ABC", Age: 20},
   { Name: "XXX", Age: 15}
 ];

仅当 Typescript 中的 Age 大于 15 时,我才想将名为“Flag”的新属性添加为 1。 我只是想知道我们可以通过哪些方式即时为上述条件创建属性。

样本输出,

arr = [
   { Name: "ABC", Age: 20, Flag: 1},
   { Name: "XXX", Age: 15}
 ];

提前致谢

【问题讨论】:

  • 您可以将Flag 设为可选,如Flag?: number,无论您在哪里定义类型并根据您的条件添加它。
  • 如果未定义标志怎么办。我只是想知道在那种情况下我们是否可以拥有房产@Shubham
  • 一切都和普通的javascript一样。

标签: javascript typescript object arrayobject


【解决方案1】:

您可以使用非常简单的地图,例如:

const addFlagIfCond = (obj: {Name: string, Age: number}) => ({
  ...obj,
  ...(obj.Age > 15 ? { Flag: 1 } : {})
})

const newArr = arr.map(addFlagIfCond)

【讨论】:

    【解决方案2】:

    由于它是打字稿,我将为我的数组创建一个类型并执行以下操作:

    type Array = { Name: string; Age: number; Flag?: 1 | 0 }[];
    let arr: Array = [
      { Name: "ABC", Age: 20 },
      { Name: "XXX", Age: 15 }
    ];
    arr.map(element => {
      if (element.Age > 15) {
        element.Flag = 1;
      }
    });
    
    console.log(arr);
    

    您可以根据需要更改标志的类型。它可以是布尔值、数字或像我一样定义的集合。

    【讨论】:

      【解决方案3】:

      使用map修改数组。

      arr.map(o => { 
        if(o.Age > 15) {
          o.Flag = 1;
        }
      });
      

      【讨论】:

        【解决方案4】:

        使用类而不是普通对象,并为标志重载 getter 以动态生成它。

        class Person {
            constructor(public name: string, public age: number) {}
        
            get flag() {
                return this.age > 15 ? 1 : 0;
            } 
        }
        
        const person: Person = new Person('Johnny', 6);
        console.log(person.flag);
        // outputs 0
        
        person.age = 20;
        console.log(person.flag);
        // outputs 1
        

        【讨论】:

          【解决方案5】:

          这是你的对象数组

              let arr = [
                 { Name: "ABC", Age: 20},
                { Name: "XXX", Age: 15}
              ];
          

          对所有对象应用条件的for循环

              for(let length=0;length<arr.length;length++)
              {
                if(arr[length].Age>15)
                  arr[length]["Flag"]=1;
              }
          

          【讨论】:

            【解决方案6】:

            如果您精确定义Age 类型,它可以在编译时完成。大量打字,但您已对类型级别进行了全面检查。

            type AgeTo15 = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15;
            type AgeAbove15 = 15 | 16 | 17 | 18 | 19 | 20 | 21; // and so on to 100 :)
            
            
            // definition of two possible versions of our type
            type To15Data = {
                Name: string,
                Age: AgeTo15,
            }
            
            type Above15Data = {
                Name: string,
                Age: AgeAbove15,
                Flag: number,
            }
            
            type Data = To15Data | Above15Data;
            
            const el: Data = {
                Name: 'Name',
                Age: 10, 
            } // valid
            
            const el2: Data = {
                Name: 'Name',
                Age: 20, 
            } // invalid
            
            const el3: Data = {
                Name: 'Name',
                Age: 20, 
                Flag: 1
            } // valid
            
            
            const arr: Data[] = [
               { Name: "ABC", Age: 20},
               { Name: "XXX", Age: 15}
             ]; // invalid
            
            const arr2: Data[] = [
               { Name: "ABC", Age: 20, Flag: 1},
               { Name: "XXX", Age: 15}
             ]; // valid
            

            【讨论】:

              猜你喜欢
              • 2021-11-25
              • 2017-07-23
              • 2011-08-22
              • 2023-03-05
              • 1970-01-01
              • 1970-01-01
              • 2021-10-21
              • 1970-01-01
              • 2019-07-11
              相关资源
              最近更新 更多