## Imported and Exported Variables In addition to being `reactive`, variables can be `imported` from and `exported` to attributes. During this process, type coercion occurs. If `imported` variables will never change or you plan to implement DOM updates in an alternate manner, you do not need to declare them as `reactive`. Variables can also be automatically exported. Try cut/paste replace the code with the below. ```javascript currentComponent.mount = function() { this.variables({data:Array},{imported}); this.variables({response:Array},{exported}); response = '["You","are","in","a","handbasket"]'; // for demo, since this code is run in a sandbox REPL, attribute changes do not render to the UI const el = document.createElement("div"); el.innerText = self.getAttribute("response"); this.shadowRoot.appendChild(el); } ``` Variables that are `exported` will always update a component's attributes when they change, they do not need to be `reactive` unless you plan to use them elsewhere. *Note*: Because the script is run in a sandbox for security, the REPL itself does not update; hence, the attribute value is retrieved and appended to the result to demonstrate that `exported` works. There are also some extended functional types like `remote` to get a variable value from a URL, `shared` and `constant`. These are [demonstrated later](./5-extended-functional-types.html). See the API documentation on [variables](../api.html#variables) and [imported](../api.html#imported) or [exported](../api.html#exported).