---
title: "How to: Use the Nest By and Table2Object Operators Together"
slug: "nest-by-operator-using-nest-by-and-table2object-together"
description: "Learn how to use UDesignerClassic DesignerArrays and the Nest By operator to efficiently organize data by account number in your Data Workflow."
updated: 2025-11-24T14:30:41Z
published: 2025-11-25T16:08:31Z
canonical: "docs.unqork.io/nest-by-operator-using-nest-by-and-table2object-together"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.unqork.io/llms.txt
> Use this file to discover all available pages before exploring further.

# How to: Use the Nest By and Table2Object Operators Together

UDesignerClassic Designer

Arrays are a great way to store large amounts of data. The **Nest By operator** lets you create a nested array in your parent array to group information by a particular key/value pair. In this example, you’ll nest data by an account number, where the account number key/value pair exists at the data structure's top level.

The account number exists as a value in the `key/accountNumber` pair. But you might want the account number to be the key instead of a value. Using a **Table2Object operator**, you'll convert your array of objects to an object. Each object in the source array of objects becomes a key/value pair in the final object. In this case, each key will be a unique account number. And the value will be the nested array associated with that account number.

## Configuration

For this example, create a [Data Table](/v1/docs/data-table-component) component that stores a list of customers, account values, and account numbers. Then, set up a [Data Workflow](/v1/docs/data-workflow-component) component and convert your array of objects to an object. Each object in the source array of objects becomes a key/value pair in the final object. In this case, each key will be a unique account number, and the value will be the nested array associated with that account number. A [Hidden](/v1/docs/hidden-component) component is added to store your Data Workflow's output.

### Configure the Data Table Component

First, you'll set up a [Data Table](/v1/docs/data-table-component) component with a list of customers, account values, and account numbers.

1. In the Module Builder, drag and drop a **Data Table** component onto your canvas.
2. In the **Property ID** fields, enter `dtAccountInfo`.
3. In the data table, enter the following:

| accountNumber | firstName | lastName | accountValue |
| --- | --- | --- | --- |
| 12345 | Josephine | Darakjy | 543891 |
| 12346 | Lenna | Paprocki | 1000000 |
| 12346 | Sage | Wieser | 1000000 |
| 12347 | Abel | Maclead | 7432572 |
| 12348 | Ernie | Stenseth | 5000000 |
| 12349 | Valentine | Gillian | 5439294 |
| 12346 | Dyan | Oldroyd | 17890 |
| 12347 | Fatima | Saylors | 19578 |
| 12347 | Willow | Kusko | 54389 |

> [!NOTE]
> You purposely added duplicate information to show the power of the Nest By operator.

![Data table displaying account numbers, names, and account values for various individuals.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(367).png?sv=2026-02-06&spr=https&st=2026-11-08T03%3A56%3A52Z&se=2026-11-08T04%3A56%3A52Z&sr=c&sp=r&sig=7DLAbckgEF6J5D919VG%2FQS0Db5ZWjnkaaKtFeVKO%2BU0%3D)
4. Click **Save Component**.

### Configure the Hidden Component

Now, add a [Hidden](/v1/docs/hidden-component) component to store your Data Workflow's output.

1. Drag and drop a **Hidden** component onto your canvas, placing it below your Data Table component.
2. In the **Property ID** and **Label Text** fields, enter `output`.
3. Click **Save Component**.

### Configure the Button Component

Next, add a [Button](/v1/docs/button-component) component to trigger your Data Workflow component.

1. Drag and drop a **Button** component onto your canvas, placing it below your `output` **Hidden** component.
2. In the **Property ID** field, enter `btnNestToObject`.
3. In the **Label Text** field, enter` Nest to Object`.
4. From the **Action Type** drop-down, select **Event**.
5. In the **On Click** field, enter `dwfNestToObject`.

![Button configuration showing label text and action triggers for event handling.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(368).png?sv=2026-02-06&spr=https&st=2026-11-08T03%3A56%3A52Z&se=2026-11-08T04%3A56%3A52Z&sr=c&sp=r&sig=7DLAbckgEF6J5D919VG%2FQS0Db5ZWjnkaaKtFeVKO%2BU0%3D)
6. Click **Save Component**.

### Configure the Data Workflow Component

Lastly, you’ll add a [Data Workflow](/v1/docs/data-workflow-component) component to convert your array of objects to an object.

1. Drag and drop a **Data Workflow** component onto your canvas, placing it below your `btnNestToObject` **Button** component.
2. In the **Property ID** and **Canvas Label Text** fields, enter `dwfNestToObject`.

#### Configure the Input Operator

1. Drag and drop an **Input** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Input |
| Component | dtAccountInfo |
| Required | No |
| Source | Default |

#### Configure the Nest By Operator

1. Drag and drop a **Nest By** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Nest By |
| Label | accountNumber |
| Parent Keys | accountNumber |
| Child Name | account |
3. Connect the output port (right) of the `dtAccountInfo` **Input** operator to the input port (left) of the `accountNumber` **Nest By** operator.

#### Configure the Table2Object Operator

1. Drag and drop a **Table2Object** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Table2Object |
| Label | Nest to Object |
| Key Column Name | accountNumber |
| Value Column Name | account |
3. Connect the output port (right) of the `accountNumber` **Nest By** operator to the input port (left) of the `Nest to Object` **Table2Object** operator.

#### Configure the Output Operator

1. Drag and drop an **Output** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Output |
| Component | output |
| Action | value |
3. Connect the output port (right) of the `Nest to Object` **Table2Object** operator to the input (left) port of the `output` **Output** operator.

#### Configure the First Console Operator

1. Drag and drop another **Console** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Console |
| Label | After Nest By |
3. Connect the output port (right) of the `accountNumber` **Nest By** operator to the input port (left) of the `After Nest By` **Console** operator.
4. Click **Save Component**.

#### Configure the Second Console Operator

1. Drag and drop another **Console** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Console |
| Label | After Table2Object |
3. Connect the output port (right) of the `Nest to Object` **Table2Object** operator to the input port (left) of the `After Table2Object` **Console** operator.

![Data workflow diagram illustrating input, nesting, and output processes for account information.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(369).png?sv=2026-02-06&spr=https&st=2026-11-08T03%3A56%3A52Z&se=2026-11-08T04%3A56%3A52Z&sr=c&sp=r&sig=7DLAbckgEF6J5D919VG%2FQS0Db5ZWjnkaaKtFeVKO%2BU0%3D)
4. Click **Save Component**.
5. **Save** your module.

Here's how your module looks in the Module Builder:![Interface displaying account information and options for nesting objects in a system.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(370).png?sv=2026-02-06&spr=https&st=2026-11-08T03%3A56%3A52Z&se=2026-11-08T04%3A56%3A52Z&sr=c&sp=r&sig=7DLAbckgEF6J5D919VG%2FQS0Db5ZWjnkaaKtFeVKO%2BU0%3D)

Preview your module in Express View and open the DevTools Console. Click the **Nest to Object** button, and you'll see your data grouped by account number in the `After Nest By` **Console** operator. In the `After Table2Object` **Console** operator, you'll see that each account number is now an array of objects. Expand a tab and you'll see the array(s) inside each object.

![Console output showing account details and nested object structure in Unqork application.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/DWF_Nest_By_16.jpg?sv=2026-02-06&spr=https&st=2026-11-08T03%3A56%3A52Z&se=2026-11-08T04%3A56%3A52Z&sr=c&sp=r&sig=7DLAbckgEF6J5D919VG%2FQS0Db5ZWjnkaaKtFeVKO%2BU0%3D)

Arrays are a great way to store large amounts of data. The **Nest By operator** lets you create a nested array in your parent array to group information by a particular key/value pair. In this example, you’ll nest data by an account number, where the account number key/value pair exists at the data structure's top level.

The account number exists as a value in the `key/accountNumber` pair. But you might want the account number to be the key instead of a value. Using a **Table2Object operator**, you'll convert your array of objects to an object. Each object in the source array of objects becomes a key/value pair in the final object. In this case, each key will be a unique account number. And the value will be the nested array associated with that account number.

## Configuration

For this example, create a [Data Table](/v1/docs/data-table-component) component that stores a list of customers, account values, and account numbers. Then, set up a [Data Workflow](/v1/docs/data-workflow-component) component and convert your array of objects to an object. Each object in the source array of objects becomes a key/value pair in the final object. In this case, each key will be a unique account number, and the value will be the nested array associated with that account number. A [Hidden](/v1/docs/hidden-component) component is added to store your Data Workflow's output.

### Configure the Data Table Component

First, you'll set up a [Data Table](/v1/docs/data-table-component) component with a list of customers, account values, and account numbers.

1. In the Module Builder, drag and drop a **Data Table** component onto your canvas.
2. In the **Label** and **Property Name** fields, enter `dtAccountInfo`.
3. In the data table, enter the following:

| accountNumber | firstName | lastName | accountValue |
| --- | --- | --- | --- |
| 12345 | Josephine | Darakjy | 543891 |
| 12346 | Lenna | Paprocki | 1000000 |
| 12346 | Sage | Wieser | 1000000 |
| 12347 | Abel | Maclead | 7432572 |
| 12348 | Ernie | Stenseth | 5000000 |
| 12349 | Valentine | Gillian | 5439294 |
| 12346 | Dyan | Oldroyd | 17890 |
| 12347 | Fatima | Saylors | 19578 |
| 12347 | Willow | Kusko | 54389 |

> [!NOTE]
> You purposely added duplicate information to show the power of the Nest By operator.

![Data table displaying account information with account numbers, names, and values listed.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(371).png?sv=2026-02-06&spr=https&st=2026-11-08T03%3A56%3A52Z&se=2026-11-08T04%3A56%3A52Z&sr=c&sp=r&sig=7DLAbckgEF6J5D919VG%2FQS0Db5ZWjnkaaKtFeVKO%2BU0%3D)
4. Click **Save**.

### Configure the Hidden Component

Now, let's add a [Hidden](/v1/docs/hidden-component) component to store your Data Workflow's output.

1. Drag and drop a **Hidden** component onto your canvas, placing it below your Data Table component.
2. In the **Property ID** and **Canvas Label Text** fields, enter `output`.
3. Click **Save**.

### Configure the Button Component

Next, add a [Button](/v1/docs/button-component) component to trigger your Data Workflow component.

1. Drag and drop a **Button** component onto your canvas, placing it below your `output` **Hidden** component.
2. In the **Property ID** field, enter `btnNestToObject`.
3. In the **Label Text** field, enter` Nest to Object`.
4. Set the **Action Type** as **Event**.
5. In the **On Click** field, enter `dwfNestToObject`.

![Button configuration with action types and triggers for event handling in a workflow.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(372).png?sv=2026-02-06&spr=https&st=2026-11-08T03%3A56%3A52Z&se=2026-11-08T04%3A56%3A52Z&sr=c&sp=r&sig=7DLAbckgEF6J5D919VG%2FQS0Db5ZWjnkaaKtFeVKO%2BU0%3D)
6. Click **Save & Close**.

### Configure the Data Workflow Component

Lastly, you’ll add a [Data Workflow](/v1/docs/data-workflow-component) component to convert your array of objects to an object.

1. Drag and drop a **Data Workflow** component onto your canvas, placing it below your `btnNestToObject` **Button** component.
2. In the **Canvas Label Text** and **Property Name** fields, enter `dwfNestToObject`.

#### Configure the Input Operator

1. Drag and drop an **Input** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Input |
| Component | dtAccountInfo |
| Required | No |
| Source | Default |

#### Configure the Nest By Operator

1. Drag and drop a **Nest By** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Nest By |
| Label | accountNumber |
| Parent Keys | accountNumber |
| Child Name | account |
3. Connect the output port (right) of the `dtAccountInfo` **Input** operator to the input port (left) of the `accountNumber` **Nest By** operator.

#### Configure the Table2Object Operator

1. Drag and drop a **Table2Object** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Table2Object |
| Label | Nest to Object |
| Key Column Name | accountNumber |
| Value Column Name | account |
3. Connect the output port (right) of the `accountNumber` **Nest By** operator to the input port (left) of the `Nest to Object` **Table2Object** operator.

#### Configure the Output Operator

1. Drag and drop an **Output** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Output |
| Component | output |
| Action | value |
3. Connect the output port (right) of the `Nest to Object` **Table2Object** operator to the input (left) port of the `output` **Output** operator.

#### Configure the First Console Operator

1. Drag and drop another **Console** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Console |
| Label | After Nest By |
3. Connect the output port (right) of the `accountNumber` **Nest By** operator to the input port (left) of the `After Nest By` **Console** operator.

#### Configure the Second Console Operator

1. Drag and drop another **Console** operator onto your Data Workflow canvas.
2. Configure the operator's **Info** window as follows:

| Setting | Value |
| --- | --- |
| Category | Console |
| Label | After Table2Object |
3. Connect the output port (right) of the `Nest to Object` **Table2Object** operator to the input port (left) of the `After Table2Object` **Console** operator.

![Data workflow diagram showing input, output, and console elements for processing data.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(373).png?sv=2026-02-06&spr=https&st=2026-11-08T03%3A56%3A52Z&se=2026-11-08T04%3A56%3A52Z&sr=c&sp=r&sig=7DLAbckgEF6J5D919VG%2FQS0Db5ZWjnkaaKtFeVKO%2BU0%3D)
4. Click **Save**.
5. **Save** your module.

Here's how your module looks in the Module Builder:

![Interface showing account information and options for user interaction and navigation.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/image(374).png?sv=2026-02-06&spr=https&st=2026-11-08T03%3A56%3A52Z&se=2026-11-08T04%3A56%3A52Z&sr=c&sp=r&sig=7DLAbckgEF6J5D919VG%2FQS0Db5ZWjnkaaKtFeVKO%2BU0%3D)

Preview your module in Express View and open the DevTools Console. Click the **Nest to Object** button, and you'll see your data grouped by account number in the `After Nest By` **Console** operator. In the `After Table2Object` **Console** operator, you'll see that each account number is now an array of objects. Expand a tab and you'll see the array(s) inside each object.

![Console output showing account details and nested arrays in Unqork application.](https://cdn.us.document360.io/15548f06-2fba-434c-b0c1-5df88317dbd7/Images/Documentation/DWF_Nest_By_16.jpg?sv=2026-02-06&spr=https&st=2026-11-08T03%3A56%3A52Z&se=2026-11-08T04%3A56%3A52Z&sr=c&sp=r&sig=7DLAbckgEF6J5D919VG%2FQS0Db5ZWjnkaaKtFeVKO%2BU0%3D)

An array is a type of object that stores one or more data types. Data types supported in arrays include numbers, strings, and objects.

A key-value pair is a fundamental data structure where a unique "key" is associated with a specific "value," used for organizing and retrieving data efficiently, like in dictionaries or databases.

An object is a type of data structure that represents a single, self-contained entity that acts as a container for the characteristics of that entity.

Express View is how your end-user views your application. Express View also lets you preview your applications to test your configuration and view the styling. This is also the view your end-users will see when interacting with your application. After configuring a module, click Preview in the Module Builder to interact with the module in Express View.

The DevTools Console helps you securely store, build, test, and deploy your software.

## Related

- [Introduction to Data Workflow](/introduction-to-data-workflow.md)
- [Data Workflow Component](/data-workflow-component.md)