更改打字稿中的数组类型

Question

我有这种类型的数组：

0: Client
clientId: 405229
clientName: "Test, Jamie"
1: Client
clientId: 405288
clientName: "Test1, Jamie"
2: Client
clientId: 405239
clientName: "Test3, Jamie"

我基本上想将其转换为没有像这样的类的纯数组

0:
clientId: 405229
clientName: "Test, Jamie"
1:
clientId: 405288
clientName: "Test1, Jamie"
2: 
clientId: 405239
clientName: "Test3, Jamie"

我尝试做：

Array.map(x=> new Array(x))

但是会产生相同的结果。

有什么帮助吗？

Answer 1

如果您想使其适用于任何对象，我将使用JavaScript Object.keys来返回所有对象自身的属性名称，请详细了解here

然后创建一个将映射任何类对象的函数。

let clientArray : Client[] = [ 
  new Client(24, 'Kobe'), 
  new Client(23, 'Lebron James'),
  new Client(1, 'Zion Williams')
]
let productsArray : Product[] = [ 
  new Product(24, 'Sneakers'), 
  new Product(23, 'Bling),
]

// use this function to map any class to to a simple object.
function mapToSimple(client){ 
    let keys = Object.keys(client)
    let result = {}
    keys.forEach((key) => {
        result[key] = client[key];
    })
    return result;
};

let results = clientArray.map(mapToSimple)
let anotherResults = productsArray.map(mapToSimple)
console.log(results);
console.log(anotherResults);

Answer 2

这是一种很好的，类似于ES6的实用方式：

# Import requrired libraries/packages
from tkinter import Tk, Checkbutton, IntVar

# Create intance of tkinter
root = Tk()

# Define variables
rule1_on_choice = IntVar()
rule1_trace_choice = IntVar()
rule2_on_choice = IntVar()
rule2_trace_choice = IntVar()

# Create first set of checkbutton
# The 'trace' checkbutton is dependent on the 'on' checkbutton
# If the 'on' checkbutton is turned ON, 'trace' checkbutton should be turned off but user should be able to turn it on again
# If the 'on' checkbutton is turned OFF, 'trace' checkbutton should also be turned off but user should not be able to turn it on
rule1_on_checkbutton = Checkbutton(root, text = "Rule 1 ON", indicatoron = 0, bg = "green", variable = rule1_on_choice, onvalue = 1, offvalue = 0, selectcolor = "green")
rule1_trace_checkbutton = Checkbutton(root, text = "Rule 1 Trace", indicatoron = 0, bg = "red", variable = rule1_trace_choice, onvalue = 1, offvalue = 0, selectcolor = "red")

# Create second set of checkbuttons
rule2_on_checkbutton = Checkbutton(root, text = "Rule 2 ON", indicatoron = 0, bg = "green", variable = rule2_on_choice, onvalue = 1, offvalue = 0, selectcolor = "green")
rule2_trace_checkbutton = Checkbutton(root, text = "Rule 2 Trace", indicatoron = 0, bg = "red", variable = rule2_trace_choice, onvalue = 1, offvalue = 0, selectcolor = "red")

# The 'on' checkbuttons are turned on by default
# The 'trace' checkbuttons are turned off by default
rule1_on_checkbutton.select()
rule1_trace_checkbutton.deselect()
rule2_on_checkbutton.select()
rule2_trace_checkbutton.deselect()

rule1_on_checkbutton.pack()
rule1_trace_checkbutton.pack()
rule2_on_checkbutton.pack()
rule2_trace_checkbutton.pack()

# Function to change text and color of checkbutton
# If a Rule checkbutton is clicked, should turn green whith text showing "ON"
# The same checkbutton is clicked, it should now turn red with text showing "OFF"
def checkbutton_state(event = None):

    if rule1_on_choice.get() == 1:
        rule1_on_checkbutton.configure(text = "Rule 1 OFF", bg = "red", fg = "grey")

    else:
        rule1_on_checkbutton.configure(text = "Rule 1 ON", bg = "green", fg = "white")

# Binding function to Rule 1 'on' checkbutton
rule1_on_checkbutton.bind("<Button-1>", checkbutton_state)

root.mainloop()

Answer 3

将Client的数组映射到Client属性的数组需要map方法提供的函数来选择属性。例如

假设有以下Client类：

class Client {
   clientId: Number;
   clientName: string;

   constructor(clientId: Number, clientName: string) {
      this.clientId = clientId;
      this.clientName = clientName;
   }
}

并且有一个初始的客户端实例数组。

const clientInstances  : Client[] = [ 
  new Client(1, 'Raymond'), 
  new Client(2, 'Damond') 
]

console.log(clientInstances);
// [ Client { clientId: 1, clientName: 'Raymond' },
//   Client { clientId: 2, clientName: 'Damond' } ]

为map方法提供的功能将传递给每个客户端实例，并返回一个新对象，该对象具有为相关键设置的客户端属性值。

interface IClient { 
    clientName: string;
    clientId: Number; 
}

const clientObjects : IClient[] = clientInstances.map(
  client => (
    { clientName: client.clientName, clientId: client.clientId }
  )
)

console.log(clientObjects);
// [ { clientName: 'Raymond', clientId: '1' },
//   { clientName: 'Damond', clientId: '2' } ]

Answer 4

• 对于纯TS解决方案，您只需关心类型Pick

class Client {
   clientId: number;
   clientName: string;

   constructor(clientId: number, clientName: string) {
      this.clientId = clientId;
      this.clientName = clientName;
   }
}

type ClientArray = Client[];
type JustValues = Pick<Client, 'clientId' | 'clientName'>[]

如果您知道要包括“类” /接口中的所有值，则可以

type JustValues = Pick<Client, keyof Client>[]

TSPlayground