> For the complete documentation index, see [llms.txt](https://cbwire.ortusbooks.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://cbwire.ortusbooks.com/the-essentials/computed-properties.md).

# Computed Properties

Computed Properties are dynamic properties that are cached per component rendering.

## Differences

Computed Properties are similar to [Data Properties](/the-essentials/properties.md) with some key differences:

* They are declared as functions within your component with a computed attribute added.
* They are cached.
* They can return any CFML data type, not just values that can be parsed by JavaScript like [Data Properties](/the-essentials/properties.md).

{% hint style="info" %}
Computed properties are meant to return values and not change state such as modifying [Data Properties](/the-essentials/properties.md). If you need to update a data property, use [Actions](/the-essentials/actions.md) instead.
{% endhint %}

## Defining Computed Properties

You can define Computed Properties on your components as functions with the computed attribute added.

{% tabs %}
{% tab title="BoxLang" %}

```javascript
class extends="cbwire.models.Component" {   

    // Computed property
    function isEven() computed {
        return data.counter % 2 == 0;
    }

}
```

{% endtab %}

{% tab title="CFML" %}

```javascript
component extends="cbwire.models.Component" {   

    // Computed property
    function isEven() computed {
        return data.counter % 2 == 0;
    }

}
```

{% endtab %}
{% endtabs %}

## Templates

You can access Computed Properties in your component template using propertyName().

{% tabs %}
{% tab title="BoxLang" %}

```html
<bx:output>
    <div>
        Is Even: #isEven()#
    </div>
</bx:output>
```

{% endtab %}

{% tab title="CFML" %}

```html
<cfoutput>
    <div>
        Is Even: #isEven()#
    </div>
</cfoutput>
```

{% endtab %}
{% endtabs %}

## Actions

You can also access Computed Properties from within your [Actions](#actions).

```javascript
// Computed property
function isEven() computed {
    return data.counter % 2 == 0;
}

// Action
function increment() {
    if ( isEven() ) {
        data.counter += 2;
    } else {
        data.counter += 1;
    }
}
```

## Caching

Computed Properties cache their results for the lifetime of the request. It will only execute once if you reference your Computed Property three times in your component template or from within a component action.

```javascript
// Computed properties
function getUUID() computed {
    return createUUID();
}
```

```html
<div>
    <p>#getUUID()#</p>
    <p>#getUUID()#</p> <!-- Outputs the same ID because of caching -->
</div>
```

You can prevent caching on a computed property by passing a false argument when invoking it.

```html
<div>
    <p>#getUUID()#</p>
    <p>#getUUID( false )#</p> <!-- Does not have the same ID because caching disabled -->
</div>
```


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://cbwire.ortusbooks.com/the-essentials/computed-properties.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.