Unwind Operator

Overview

The Unwind operator raises the values in a nested array to the next level.

For example, begin with the following array An array is a type of object that stores one or more data types. Data types supported in arrays include numbers, strings, and objects.:

1
2
3
4
5
6
7
8
9
[
  {
    "key1": "A",
    "key2": "B",
    "key3": [
      "C"
    ]
  }
]

In Lines 5 and 6, the "key3" key contains an nested array as its value. After using the Unwind operator in a Data Workflow component, the value "C" in the "key3" nested array raises to the same level of the data structure as the values "A" and "B". The final array looks like the following:

1
2
3
4
5
6
7
[
  {
    "key1": "A",
    "key2": "B",
    "key3": "C"
  }
]

Now, all three values are at the same level of the data structure.

You'll find the Get operator under the Table group to the left of the Data Workflow canvas.

About the Info Window

Learn more about each setting in the Unwind operator's Info window:

Adding an Unwind Operator

In this example, use a Address Search component to collect and store information about an address. Then, use the Unwind operator in a Data Workflow component to extract values from the Address Search component's "address" data object 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..

The Unqork Training environment contains a preconfigured address service. If you are configuring in a non-Training environment, you might need to set up an address service.

The "address" data object includes commonly-referenced fields, like city or zip. But, each row of the array also has another nested array called "types". The "types" array indicates which category of address information is in that row. For example, the types array can contain the "street_number" or "postal_code_suffix" values. Unwinding the "types" array brings this category value to the same level as the address information itself.

Use the Filter and Get operators to retrieve the specific address information. The Filter operator filters information from the "address_components" array by a particular "types" value. For example, you can filter out the row with "types":"street_number". Then, use the Get operator to extract the street number.

Configure the Address Search Component

Configure an Address Search component to collect the end-user's location. This location stores in an "address" data object.

1.

Drag and drop an Address Search component onto your canvas.

Configure the Data Workflow Component

With the Address Search component configured, use your Unwind operator to retrieve specific values. In this example, your Data Workflow retrieves the two-letter state and country abbreviations.

1.

Drag and drop a Data Workflow component onto your canvas, placing it below the address  Address Search component.

Configure the Input Operator

Connect your Address Search component to the Data Workflow using an Input operator.

Configure the Get Operator

Connect a Get operator to the "address_components" array in the "address" data object.

Configure the Unwind Operator

Use the Unwind operator to unwind the "types" key. Doing so brings the values in the nested "types" array to each row of the "address_components" array.

Configure the Filter Operators

Use two Filter operators to isolate the values you want. Each Filter operator filters according to a specific "types" value. After unwinding, there's now a "types" value in each row of the array. To determine which "types" value to use in the expression, look at the original "types" array. For example, the "types" value of "administrative_area_level_1" corresponds to the State row of information.

Configure Additional  Get Operators

Use two more Get operators to retrieve a specific value from each filtered row. Each row contains both a "long_name" and "short_name" value. For example, if the State "long_name" value is New York, then the "short_name" is NY. For this example, you'll retrieve the "short_name" value for State and Country.

Configure the Console Operators

Add four Console operators to view the outcome of each step in the process. Connect one Console operator to the first Get operator to view the "address_components" array before unwinding. Then, connect another to the Unwind operator to view the "address_components" array after unwinding. Lastly, connect two Console operators to the second and third Get operators. These display exactly what values the Data Workflow retrieves from the address data object.

The second and third Get operators only output to Console operators. Use dedicated Output operators when creating applications. Then, you can connect those Output operators to Hidden components to store the final values for reference elsewhere in an application.

Here's how the completed Data Workflow looks:

Configure the Button Component

Create a button so end-users End-users, also known as Express Users, are the individuals accessing an application through Express View. In most cases, end-users are the customers using the product. can click it in Express View 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. and trigger the Data Workflow.

1.

Drag and drop a Button component onto your canvas, placing it below the dwfUnwind Data Workflow component.

Here's how the completed example looks in the Module Builder:

Preview your module in Express View 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. and open the DevTools Console The DevTools Console helps you securely store, build, test, and deploy your software.. Enter an address in the Address field and click Run DWF Unwind.

Notice that there are more rows in the After Unwindarray An array is a type of object that stores one or more data types. Data types supported in arrays include numbers, strings, and objects. than in the Before Unwind array. Some rows of the original array had two "types" values. For example, look at row two of the Before Unwind array "5th Avenue". Its "types" value is an array with two rows. After unwinding the data, the "types" array separates into row two and row three as displayed in the After Unwind array.

Overview

The Unwind operator raises the values in a nested array to the next level.

For example, begin with the following array An array is a type of object that stores one or more data types. Data types supported in arrays include numbers, strings, and objects.:

1
2
3
4
5
6
7
8
9
[
  {
    "key1": "A",
    "key2": "B",
    "key3": [
      "C"
    ]
  }
]

In Lines 5 and 6, the "key3" key contains an nested array as its value. After using the Unwind operator in a Data Workflow component, the value "C" in the "key3" nested array raises to the same level of the data structure as the values "A" and "B". The final array looks like the following:

1
2
3
4
5
6
7
[
  {
    "key1": "A",
    "key2": "B",
    "key3": "C"
  }
]

Now, all three values are at the same level of the data structure.

You'll find the Get operator under the Table group to the left of the Data Workflow canvas.

About the Info Window

Learn more about each setting in the Unwind operator's Info window:

Adding an Unwind Operator

In this example, use a Address Search component to collect and store information about an address. Then, use the Unwind operator in a Data Workflow component to extract values from the Address Search component's "address" data object 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..

The Unqork Training environment contains a preconfigured address service. If you are configuring in a non-Training environment, you might need to set up an address service.

The "address" data object includes commonly-referenced fields, like city or zip. But, each row of the array also has another nested array called "types". The "types" array indicates which category of address information is in that row. For example, the types array can contain the "street_number" or "postal_code_suffix" values. Unwinding the "types" array brings this category value to the same level as the address information itself.

Use the Filter and Get operators to retrieve the specific address information. The Filter operator filters information from the "address_components" array by a particular "types" value. For example, you can filter out the row with "types":"street_number". Then, use the Get operator to extract the street number.

Configure the Address Search Component

Configure an Address Search component to collect the end-user's location. This location stores in an "address" data object.

1.

In the Module Builder, drag and drop an Address Search component onto your canvas.

Configure the Data Workflow Component

With the Address Search component configured, use your Unwind operator to retrieve specific values. In this example, your Data Workflow retrieves the two-letter state and country abbreviations.

1.

Drag and drop a Data Workflow component onto your canvas, placing it below the address  Address Search component.

Configure the Input Operator

Connect your Address Search component to the Data Workflow using an Input operator.

Configure the Get Operator

Connect a Get operator to the "address_components" array in the "address" data object.

Configure the Unwind Operator

Use the Unwind operator to unwind the "types" key. Doing so brings the values in the nested "types" array to each row of the "address_components" array.

Configure the Filter Operators

Use two Filter operators to isolate the values you want. Each Filter operator filters according to a specific "types" value. After unwinding, there's now a "types" value in each row of the array. To determine which "types" value to use in the expression, look at the original "types" array. For example, the "types" value of "administrative_area_level_1" corresponds to the State row of information.

Configure Additional Get Operators

Use two more Get operators to retrieve a specific value from each filtered row. Each row contains both a "long_name" and "short_name" value. For example, if the State "long_name" value is New York, then the "short_name" is NY. For this example, you'll retrieve the "short_name" value for State and Country.

Configure the Console Operators

Add four Console operators to view the outcome of each step in the process. Connect one Console operator to the first Get operator to view the "address_components" array before unwinding. Then, connect another to the Unwind operator to view the "address_components" array after unwinding. Lastly, connect two Console operators to the second and third Get operators. These display exactly what values the Data Workflow retrieves from the address data object.

The second and third Get operators only output to Console operators. Use dedicated Output operators when creating applications. Then, you can connect those Output operators to Hidden components to store the final values for reference elsewhere in an application.

Here's how the completed Data Workflow looks:

Configure the Button Component

Create a button so end-users End-users, also known as Express Users, are the individuals accessing an application through Express View. In most cases, end-users are the customers using the product. can click it in Express View 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. and trigger the Data Workflow.

1.

Drag and drop a Button component onto your canvas, placing it below the dwfUnwind Data Workflow component.

Here's how the completed example looks in the Module Builder:

Preview your module in Express View 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. and open the DevTools Console The DevTools Console helps you securely store, build, test, and deploy your software.. Enter an address in the Address field and click Run DWF Unwind.

Notice that there are more rows in the After Unwindarray An array is a type of object that stores one or more data types. Data types supported in arrays include numbers, strings, and objects. than in the Before Unwind array. Some rows of the original array had two "types" values. For example, look at row two of the Before Unwind array "5th Avenue". Its "types" value is an array with two rows. After unwinding the data, the "types" array separates into row two and row three as displayed in the After Unwind array.