---
schema_version: "1"
id: f8ca1450fc21cd6fdc8a38faa3f77be19c596ee10353f5573239f745de4dbb7c
title: Working with Attribute Values in JavaScript
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/platform/aura-platform/guides/aura/js/js-attr-values.md
canonical_url: https://developer.salesforce.com/docs/platform/aura-platform/guide/js-attr-values.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: 3a4d754d3ea32b0d7c0afa3e8197567d4122621c786f6a9e23e69778e730d446
products:
  - Lightning Aura Components Developer Guide
  - Platform Developer Content
---

# Working with Attribute Values in JavaScript

These common patterns are useful for working with attribute values in JavaScript.

`component.get(String key)` and `component.set(String key, Object value)` retrieves and assigns values associated with the specified key on the component. Keys are passed in as an expression, which represents an attribute value.

To retrieve an attribute value of a component reference, use `component.find("cmpId").get("v.value")`.

Similarly, to set the attribute value of a component reference, use `component.find("cmpId").set("v.value", myValue)`.

This example shows how you can retrieve and set attribute values on a component reference, represented by the button with an ID of `button1`.

```nolang
<aura:component>
    <aura:attribute name="buttonLabel" type="String"/>
    <lightning:button aura:id="button1" label="Button 1"/>
    {!v.buttonLabel}
    <lightning:button label="Get Label" onclick="{!c.getLabel}"/>
</aura:component>
```

This controller action retrieves the `label` attribute value of a button in a component and sets its value on the `buttonLabel` attribute.

```javascript
({
    getLabel : function(component, event, helper) {
        var myLabel = component.find("button1").get("v.label");
        component.set("v.buttonLabel", myLabel);
    }
})
```

In the following examples, `cmp` is a reference to a component in your JavaScript code.

To get the value of a component’s `label` attribute:

```javascript
var label = cmp.get("v.label");
```

## Set an Attribute Value

To set the value of a component’s `label` attribute:

```javascript
cmp.set("v.label","This is a label");
```

## Deep Set an Attribute Value

If an attribute has an object or collection type, such as `Map`, you can deep set properties in the attribute value using the dot notation for expressions. For example, this code sets a value for the `firstName` property in the `user` attribute.

```javascript
component.set("v.user.firstName", "Nina");

```

For deeply nested objects and attributes, continue adding dots to traverse the structure and access the nested values.

Let’s look at a component with a `user` attribute of type `Map`.

```nolang
<aura:component >
        <aura:attribute name="user" type="Map"
          default="{
            'id': 99,
            'firstName': 'Eunice',
            'lastName': 'Gomez'}" />
    
    <p>First Name: {!v.user.firstName}</p>
    
    <lightning:button onclick="{!c.deepSet}" label="Deep Set" />
</aura:component>
```

When you click the button in the component, you call the `deepSet` action in the client-side controller.

```javascript
({
    deepSet : function(component, event, helper) {
        console.log(component.get("v.user.firstName"));
        component.set("v.user.firstName", "Nina");
        console.log(component.get("v.user.firstName"));
    }
})
```

The `component.set("v.user.firstName", "Nina")` line sets a value for the `firstName` property in the `user` attribute.

## Validate That an Attribute Value Is Defined

To determine if a component’s `label` attribute is defined:

```javascript
var isDefined = !$A.util.isUndefined(cmp.get("v.label"));
```

## Validate That an Attribute Value Is Empty

To determine if a component’s `label` attribute is empty:

```javascript
var isEmpty = $A.util.isEmpty(cmp.get("v.label"));
```

**See Also**  


-   [Working with a Component Body in JavaScript](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-cmp-body.md)