with
Deprecated: This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that this feature may cease to work at any time.
Note: Use of the with statement is not recommended, as it may be the source of confusing bugs and compatibility issues, makes optimization impossible, and is forbidden in strict mode. The recommended alternative is to assign the object whose properties you want to access to a temporary variable.
The with statement extends the scope chain for a statement.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
with Deprecated | 1 | 12 | 1 | 1 | 18 | 1 |
| Built-in object | ||||||
| The [Symbol.unscopables] data property of Array.prototype is shared by all Array instances. It contains property names that were not included in the ECMAScript standard prior to the ES2015 version and that are ignored for with statement-binding purposes. | 38 | 12 | 48 | 10 | 38 | 10 |
| The Symbol.unscopables static data property represents the well-known symbol Symbol.unscopables. The Statements/with statement looks up this symbol on the scope object for a property containing a collection of properties that should not become bindings within the with environment. | 38 | 12 | 48 | 9 | 38 | 9 |
Syntax
// with example
// See MDN Web Docs for details Live demo
Access object properties with with
Use the legacy with statement to shorten repeated property access.
Compare with direct property access
Show the same logic written without the with statement.
Highlight name ambiguity
See how with can make identifier lookup harder to reason about.
Use cases
-
Legacy code cleanup
Replace with blocks during migration so scope rules become explicit again.
-
Reading historical scripts
Recognize with when auditing older JavaScript that predates modern style guidance.
Cautions
- with makes it difficult to tell where names come from, which harms readability and tooling support.
- Strict mode disallows it for good reason; keep object access explicit instead.
Accessibility
- No direct accessibility effect, but confusing scope rules increase maintenance risk in interactive code.
- Clarity in state and property access helps teams preserve accessible behavior over time.