--- schema_version: "1" id: a5151472d4ac1342c84da741b6e812feeafcff38eb12107656c37b61e54778ed title: Using 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-intro.md canonical_url: https://developer.salesforce.com/docs/platform/aura-platform/guide/js-intro.html source_site: developer.salesforce.com content_type: documentation content_hash: 7d55813b0c57b93b84b51708815e2ada3bb589db9cdd73688989eea96fcd870a products: - Lightning Aura Components Developer Guide - Platform Developer Content --- # Using JavaScript Use JavaScript for client-side code. The `$A` namespace is the entry point for using the framework in JavaScript code. For all the methods available in `$A`, see the [JavaScript API](https://developer.salesforce.com/docs/platform/aura-platform/ref-jsapi/ref-jsapi-intro.md). A component bundle can contain JavaScript code in a client-side controller, helper, or renderer. Client-side controllers are the most commonly used of these JavaScript resources. ## Expressions in JavaScript Code In JavaScript, use string syntax to evaluate an expression. For example, this expression retrieves the `label` attribute in a component. ```javascript var theLabel = cmp.get("v.label"); ``` **note:** Only use the `{! }` expression syntax in markup in .app or .cmp resources. - **[Supported JavaScript](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-supported-es.md)** The Aura Components programming model supports ES5 syntax and ES6 Promises. - **[Invoking Actions on Component Initialization](https://developer.salesforce.com/docs/platform/aura-platform/js-cb/js-cb-init-handler.md)** Use the `init` event to initialize a component or fire an event after component construction but before rendering. - **[Sharing JavaScript Code in a Component Bundle](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-helper.md)** Put functions that you want to reuse in the component’s helper. Helper functions also enable specialization of tasks, such as processing data and queueing server-side actions. Helper functions are local to a component, improve code reuse, and move the heavy lifting of JavaScript logic away from the client-side controller, where possible. - **[Sharing JavaScript Code Across Components](https://developer.salesforce.com/docs/platform/aura-platform/security/security-share-code.md)** You can build simple Lightning components that are entirely self-contained. However, if you build more complex applications, you probably want to share code, or even client-side data, between components. - **[Using External JavaScript Libraries](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-libs-platform.md)** To reference a JavaScript library, upload it as a static resource and use a `` tag in your .cmp or .app markup. - **[Dynamically Creating Components](https://developer.salesforce.com/docs/platform/aura-platform/js-cb/js-cb-dynamic-cmp-async.md)** Create a component dynamically in your client-side JavaScript code by using the `$A.createComponent()` method. To create multiple components, use `$A.createComponents()`. - **[Detecting Data Changes with Change Handlers](https://developer.salesforce.com/docs/platform/aura-platform/js-cb/js-cb-data-change.md)** Configure a component to automatically invoke a change handler, which is a client-side controller action, when a value in one of the component's attributes changes. - **[Finding Components by ID](https://developer.salesforce.com/docs/platform/aura-platform/js-cb/js-cb-find-by-id.md)** Retrieve a component by its ID in JavaScript code. - **[Working with Attribute Values in JavaScript](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-attr-values.md)** These common patterns are useful for working with attribute values in JavaScript. - **[Working with a Component Body in JavaScript](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-cmp-body.md)** These are useful and common patterns for working with a component’s body in JavaScript. - **[Working with Events in JavaScript](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-event.md)** These are useful and common patterns for working with events in JavaScript. - **[Modifying the DOM](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-dom-access.md)** The Document Object Model (DOM) is the language-independent model for representing and interacting with objects in HTML and XML documents. It’s important to know how to modify the DOM safely so that the framework’s rendering service doesn’t stomp on your changes and give you unexpected results. - **[Checking Component Validity](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-cmp-isvalid.md)** If you navigate elsewhere in the UI while asynchronous code is executing, the framework unrenders and destroys the component that made the asynchronous request. You can still have a reference to that component, but it is no longer valid. The `cmp.isValid()` call returns `false` for an invalid component. - **[Modifying Components Outside the Framework Lifecycle](https://developer.salesforce.com/docs/platform/aura-platform/js-cb/js-cb-mod-ext-js.md)** Use `$A.getCallback()` to wrap any code that modifies a component outside the normal rerendering lifecycle, such as in a `setTimeout()` call. The `$A.getCallback()` call ensures that the framework rerenders the modified component and processes any enqueued actions. - **[Throwing and Handling Errors](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-throw-error.md)** The framework gives you flexibility in handling unrecoverable and recoverable app errors in JavaScript code. For example, you can throw these errors in a callback when handling an error in a server-side response. - **[Calling Component Methods](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-cmp-methods.md)** Use `` to define a method as part of a component's API. This enables you to directly call a method in a component’s client-side controller instead of firing and handling a component event. Using `` simplifies the code needed for a parent component to call a method on a child component that it contains. - **[Dynamically Adding Event Handlers To a Component](https://developer.salesforce.com/docs/platform/aura-platform/js-cb/js-cb-dynamic-handler.md)** You can dynamically add a handler for an event that a component fires. - **[Dynamically Showing or Hiding Markup](https://developer.salesforce.com/docs/platform/aura-platform/js-cb/js-cb-show-hide-markup.md)** You can use CSS to toggle markup visibility. However, `` is the preferred approach because it defers the creation and rendering of the enclosed element tree until needed. - **[Adding and Removing Styles](https://developer.salesforce.com/docs/platform/aura-platform/js-cb/js-cb-styles.md)** You can add or remove a CSS style on a component or element during runtime. - **[Which Button Was Pressed?](https://developer.salesforce.com/docs/platform/aura-platform/js-cb/js-cb-which-button-pressed.md)** To find out which button was pressed in a component containing multiple buttons, use `Component.getLocalId()`. - **[Formatting Dates in JavaScript](https://developer.salesforce.com/docs/platform/aura-platform/js-cb/js-cb-format-dates.md)** The `AuraLocalizationService` JavaScript API provides methods for formatting and localizing dates. - **[Using JavaScript Promises](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-promises.md)** You can use ES6 Promises in JavaScript code. Promises can simplify code that handles the success or failure of asynchronous calls, or code that chains together multiple asynchronous calls. - **[Making API Calls from Components](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-api-calls-platform.md)** By default, you can’t make calls to third-party APIs from client-side code. Add a remote site as a Trusted URL with Content Security Policy (CSP) directives to allow client-side component code to load assets from and make API requests to that site’s domain. **See Also** - [Handling Events with Client-Side Controllers](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-client-side-controller.md)