javascript - Define an array of objects in typescript - Stack Overflow

admin管理员组

文章数量:1384555

I want to define in typescript an array of objects:

const a = [{
  name: 1,
  age: 2,
  car1: 8,
  car2: 8,
  car3: 8,
  name4: 1,
  age4: 2,
  car41: 8,
  car42: 8,
  car34: 8,
},
{
  name: 1,
  age: 2,
  car1: 8,
  car2: 8,
  car3: 8,
  name4: 1,
  age4: 2,
  car41: 8,
  car42: 8,
  car34: 8,
}
]

const fun = (obj: Array < object > ) => {
  console.log(obj)
}

fun(a)

I want to define in typescript an array of objects:

const a = [{
  name: 1,
  age: 2,
  car1: 8,
  car2: 8,
  car3: 8,
  name4: 1,
  age4: 2,
  car41: 8,
  car42: 8,
  car34: 8,
},
{
  name: 1,
  age: 2,
  car1: 8,
  car2: 8,
  car3: 8,
  name4: 1,
  age4: 2,
  car41: 8,
  car42: 8,
  car34: 8,
}
]

const fun = (obj: Array < object > ) => {
  console.log(obj)
}

fun(a)

In my case it is correct to use this construction: obj: Array <object> or i should define each key of my object?

• javascript
• typescript

Share Improve this question Follow edited Dec 1, 2020 at 10:36 Asking asked Dec 1, 2020 at 10:22 AskingAsking 4,2402121 gold badges8282 silver badges163163 bronze badges 3

• 1 What you have above is rather array of (a single) object, which doesn't seem to make much sense. – Yevhen Horbunkov Commented Dec 1, 2020 at 10:26
• @YevgenGorbunkov, i just wanted to ask a random case. For example my array has 5 objects, should my typescript code look like i show or not? – Asking Commented Dec 1, 2020 at 10:37
• I guess, proper pattern here would be to specify Interface that describes the shape of each array item – Yevhen Horbunkov Commented Dec 1, 2020 at 10:41

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

The solution of the question depends on the scenario you want to program in!. Here are some of the possible scenarios with your code.

Define an object and infer its keys from it.

const persons = [
  { name: "John", age: 12 },
  { name: "Ben", age: 20 }
];

const fun = (info: typeof persons) => {
  //You will get intellisense here
  console.log(info[0].name);
};

You want to have objects with fixed keys, you can use types and interfaces in that case.

interface IPerson {
  id?: string; // ID is optional (use of ? operator)
  name: string; // Name is Required
  age: number;
}

const persons: Array<IPerson> = [
  { name: "John", age: 12 },
  { name: "Ben", age: 20 }
];

// Both are same: Array<IPerson> === IPerson[]
const fun = (info: Array<IPerson>) => {
  //You will get intellisense here
  console.log(info[0].name);
};

You want to have object with fixed keys, and you want to provide partial information.

interface IPerson {
  id?: string; // ID is optional (use of ? operator)
  name: string; // Name is Required
  age: number;
}

const persons: Array<Partial<IPerson>> = [
  { name: "John" }, // You can do it.
  { name: "Ben", age: 20 }
];

// Both are same: Array<IPerson> === IPerson[]
const fun = (info: Partial<IPerson>[]) => {
  //You will get intellisense here
  console.log(info[0].name);
};

Additional Information, Typescript does not support runtime type checking, it only supports type checking at pile type.

For validation at runtime you can implement the function as follows:

const is_valid_person = (person: any): Boolean => {
  return (
    typeof person === "object" &&
    typeof person.name === "string" &&
    typeof person.age === "number" &&
    person.name.length >= 5 &&
    person.age >= 1
  );
};

console.log("Is person valid: ", is_valid_person({}));
console.log("Is person valid: ", is_valid_person("Invalid Person"));

I hope one of the above ways should solve your problem.

In my case it is correct to use this construction: obj: Array or i should define each key of my object?

Answer to above question is:

• You can use any one of shown method above, because typescript helps you write better code and make less mistakes at pile time. Once your program gets piled, the code that gets executed is plain Javascript. And javascript doesn't validate your responses.

• All the above patterns generate same JavaScript code, so there are no performance issues.

As you can see in the documentation, using object is maybe a bit lazy.

Assuming all the objects in the array have the same properties, you can solve this problem like so:

interface UserWithCars {
  name: number;
  age: number;
  // All other properties
}

const fun = (objectArray: Array<UserWithCars>): void => {
  console.log(objectArray);
}

If all the objects will be of the same type, you can even create a class (which should be the way to go actually):

class UserWithCars {
  name: number;
  age: number;
  // All other properties

  constructor(/* etc */) {
    // constructor operations
  }
}

const fun = (objectArray: Array<UserWithCars>): void => {
  console.log(objectArray);
}

You could create your own custom object type:

type CustomObject = {
  name: number
  age: number
  car1: number
  car2: number
  car3: number
  name4: number
  age4: number
  car41: number
  car42: number
  car34: number
}

const arrayOfCustomObjects: CustomObject[] = [{
  name: 1,
  age: 2,
  car1: 8,
  car2: 8,
  car3: 8,
  name4: 1,
  age4: 2,
  car41: 8,
  car42: 8,
  car34: 8,
},
{
  name: 1,
  age: 2,
  car1: 8,
  car2: 8,
  car3: 8,
  name4: 1,
  age4: 2,
  car41: 8,
  car42: 8,
  car34: 8,
}
]

const fun = (objs: CustomObject[]) => {
    objs.forEach((obj) => {
        console.log(obj)
    })
}

fun(arrayOfCustomObjects)

本文标签： javascriptDefine an array of objects in typescriptStack Overflow