Build on FLOW | Learn FCL - 3. How to Return Custom Value from Script
Tags: javascript, tutorial, flow, fcl
Published: 2022-05-30 14:47:48

## Overview

In this guide you will learn how to return value containing multiple other values that doesn’t share the same type. We will do this by defining and using custom Cadence Struct.

- define custom Struct in the body of the script
- create instance of aforementioned Struct and use it as return value of the script

> :bulb: Learn better with video? Lucky for you there is a video you can follow along w/ this guide. Narrated by one and only Flow Developer Advocate [Kimcodeashian](https://twitter.com/kimcodeashian)!

### Kimazing Content
{% youtube dZlCsuQilT0 %}

## Previously on "Learn FCL"

In the [previous post](https://dev.to/onflow/build-on-flow-learn-fcl-2-pass-arguments-to-scripts-393f), we learned how to pass arguments to our Cadence script. But if you recall from one of the examples - ``passMultipleDifferentTypes`` - we could only return a single value, even though we passed in multiple different types. 

Today, I will show you how you can define a custom Struct in the body of your script and then use it as a return type. 

Let’s begin! 💪 

### Step 1 - Installation

Add `"@onflow/fcl": "1.0.0"` as your dependency

### Step 2 - Setup

Just like the last time, we will import the necessary methods and setup FCL:

```jsx
import { query, config } from "@onflow/fcl";

const api = "https://rest-testnet.onflow.org";
config().put("accessNode.api", api);
```

## Step 3 - Implement `fetchCustom` method
It is allowed define new Structs in the body of the script. We will create one and call it `Custom`(use can use any name you want)
```jsx
const fetchCustom = async (name) => {
  const cadence = `
    // We will define custom Struct with name Custom :)
    pub struct Custom {

      pub let number: Int
      pub let address: Address
      
      // underscore before name of the arguments will allow us to pass values
      // without specifying the name of the arguments, which is usefull when
      // you have only a few of them

      init(number: Int, address: Address){
        self.number = number
        self.address = address
      }
    }

    pub fun main():Custom {
        // in order to create instance of a struct you use it's name
        // and pass initialization arguments in parentheses
        let t = Custom(number: 42, address: 0x1337)
        return t
    }
  `;

  const custom = await query({ cadence });

  const { number, address } = custom;
  console.log(`number field is ${number}`)
  console.log(`address field is ${address}`)
};
```

## Finally

As always, let’s execute the code with IIFE:

```jsx
(async () => {
  console.clear();
  await fetchCustom();
})();
```

You should see the following result in the console:

```jsx
number field is: 42
address field is: 0x0000000000001337
```

Did you get lost 🤷‍♂️?  No worries 😉 - checkout the [full code on Codesandbox](https://codesandbox.io/s/dev-to-fcl-return-custom-struct-sgywnx?file=/src/index.js:1399-1512)

Next time we will put our aquired skills to use and use [.find](https://find.xyz/) deployed contract to convert .find identity name to address.

Until next time 👋

## Resources

- Example Code - [https://codesandbox.io/s/dev-to-fcl-return-custom-struct-sgywnx](https://codesandbox.io/s/dev-to-fcl-return-custom-struct-sgywnx?file=/src/index.js:1399-1512)
- Cadence Structs - [https://docs.onflow.org/cadence/language/composite-types/#composite-type-declaration-and-creation](https://docs.onflow.org/cadence/language/composite-types/#composite-type-declaration-and-creation)

Other resources you might find useful:

- **Flow Docs Site** - [https://docs.onflow.org/](https://docs.onflow.org/) - More detailed information about Flow blockchain and how to interact with it
- **Flow Portal** - [https://flow.com/](https://flow.com/) - your entry point to Flow
- **FCL JS** - [https://github.com/onflow/fcl-js](https://github.com/onflow/fcl-js) - Source code and ability to contribute to the FCL JS library
- **Cadence** - [https://docs.onflow.org/cadence/](https://docs.onflow.org/cadence/) - Introduction to Cadence
- **Codesandbox** - [https://codesandbox.io](https://codesandbox.io/) - An amazing in-browser IDE enabling quick prototyping