syntaxerror invalid left hand side in assignment

How to fix SyntaxError: invalid assignment left-hand side

by Nathan Sebhastian

Posted on Jul 10, 2023

Reading time: 3 minutes

When running JavaScript code, you might encounter an error that says:

Both errors are the same, and they occured when you use the single equal = sign instead of double == or triple === equals when writing a conditional statement with multiple conditions.

Let me show you an example that causes this error and how I fix it.

How to reproduce this error

Suppose you have an if statement with two conditions that use the logical OR || operator.

You proceed to write the statement as follows:

When you run the code above, you’ll get the error:

This error occurs because you used the assignment operator with the logical OR operator.

An assignment operator doesn’t return anything ( undefined ), so using it in a logical expression is a wrong syntax.

How to fix this error

To fix this error, you need to replace the single equal = operator with the double == or triple === equals.

Here’s an example:

By replacing the assignment operator with the comparison operator, the code now runs without any error.

The double equal is used to perform loose comparison, while the triple equal performs a strict comparison. You should always use the strict comparison operator to avoid bugs in your code.

Other causes for this error

There are other kinds of code that causes this error, but the root cause is always the same: you used a single equal = when you should be using a double or triple equals.

For example, you might use the addition assignment += operator when concatenating a string:

The code above is wrong. You should use the + operator without the = operator:

Another common cause is that you assign a value to another value:

This is wrong because you can’t assign a value to another value.

You need to declare a variable using either let or const keyword, and you don’t need to wrap the variable name in quotations:

You can also see this error when you use optional chaining as the assignment target.

For example, suppose you want to add a property to an object only when the object is defined:

Here, we want to assign the age property to the person object only when the person object is defined.

But this will cause the invalid assignment left-hand side error. You need to use the old if statement to fix this:

Now the error is resolved.

The JavaScript error SyntaxError: invalid assignment left-hand side occurs when you have an invalid syntax on the left-hand side of the assignment operator.

This error usually occurs because you used the assignment operator = when you should be using comparison operators == or === .

Once you changed the operator, the error would be fixed.

I hope this tutorial helps. Happy coding!

Take your skills to the next level ⚡️

I'm sending out an occasional email with the latest tutorials on programming, web development, and statistics. Drop your email in the box below and I'll send new stuff straight into your inbox!

Hello! This website is dedicated to help you learn tech and data science skills with its step-by-step, beginner-friendly tutorials. Learn statistics, JavaScript and other programming languages using clear examples written for people.

Learn more about this website

Connect with me on Twitter

Or LinkedIn

Type the keyword below and hit enter

Click to see all tutorials tagged with:

• Skip to main content
• Select language
• Skip to search
• ReferenceError: invalid assignment left-hand side

ReferenceError .

What went wrong?

There was an unexpected assignment somewhere. This might be due to a mismatch of a assignment operator and a comparison operator , for example. While a single " = " sign assigns a value to a variable, the " == " or " === " operators compare a value.

In the if statement, you want to use a comparison operator ("=="), and for the string concatenation, the plus ("+") operator is needed.

• Assignment operators
• Comparison operators

Document Tags and Contributors

• ReferenceError
• Introduction
• Grammar and types
• Control flow and error handling
• Loops and iteration
• Expressions and operators
• Numbers and dates
• Text formatting
• Regular expressions
• Indexed collections
• Keyed collections
• Working with objects
• Details of the object model
• Iterators and generators
• Meta programming
• JavaScript basics
• JavaScript technologies overview
• Introduction to Object Oriented JavaScript
• A re-introduction to JavaScript
• JavaScript data structures
• Equality comparisons and sameness
• Inheritance and the prototype chain
• Strict mode
• JavaScript typed arrays
• Memory Management
• Concurrency model and Event Loop
• References:
• ArrayBuffer
• AsyncFunction
• Float32Array
• Float64Array
• GeneratorFunction
• InternalError
• Intl.Collator
• Intl.DateTimeFormat
• Intl.NumberFormat
• ParallelArray
• SIMD.Bool16x8
• SIMD.Bool32x4
• SIMD.Bool64x2
• SIMD.Bool8x16
• SIMD.Float32x4
• SIMD.Float64x2
• SIMD.Int16x8
• SIMD.Int32x4
• SIMD.Int8x16
• SIMD.Uint16x8
• SIMD.Uint32x4
• SIMD.Uint8x16
• SharedArrayBuffer
• StopIteration
• SyntaxError
• Uint16Array
• Uint32Array
• Uint8ClampedArray
• decodeURI()
• decodeURIComponent()
• encodeURI()
• encodeURIComponent()
• parseFloat()
• Arithmetic operators
• Array comprehensions
• Bitwise operators
• Comma operator
• Conditional (ternary) Operator
• Destructuring assignment
• Expression closures
• Generator comprehensions
• Grouping operator
• Legacy generator function expression
• Logical Operators
• Object initializer
• Operator precedence
• Property accessors
• Spread syntax
• async function expression
• class expression
• delete operator
• function expression
• function* expression
• in operator
• new operator
• void operator
• Legacy generator function
• async function
• for each...in
• try...catch
• Arguments object
• Arrow functions
• Default parameters
• Method definitions
• Rest parameters
• constructor
• Error: Permission denied to access property "x"
• InternalError: too much recursion
• RangeError: argument is not a valid code point
• RangeError: invalid array length
• RangeError: precision is out of range
• RangeError: radix must be an integer
• RangeError: repeat count must be less than infinity
• RangeError: repeat count must be non-negative
• ReferenceError: "x" is not defined
• ReferenceError: assignment to undeclared variable "x"
• ReferenceError: deprecated caller or arguments usage
• ReferenceError: reference to undefined property "x"
• SyntaxError: "use strict" not allowed in function with non-simple parameters
• SyntaxError: "x" is not a legal ECMA-262 octal constant
• SyntaxError: JSON.parse: bad parsing
• SyntaxError: Malformed formal parameter
• SyntaxError: Unexpected token
• SyntaxError: Using //@ to indicate sourceURL pragmas is deprecated. Use //# instead
• SyntaxError: missing ) after argument list
• SyntaxError: missing ; before statement
• SyntaxError: missing ] after element list
• SyntaxError: missing } after property list
• SyntaxError: redeclaration of formal parameter "x"
• SyntaxError: return not in function
• SyntaxError: test for equality (==) mistyped as assignment (=)?
• SyntaxError: unterminated string literal
• TypeError: "x" has no properties
• TypeError: "x" is (not) "y"
• TypeError: "x" is not a constructor
• TypeError: "x" is not a function
• TypeError: "x" is read-only
• TypeError: More arguments needed
• TypeError: invalid Array.prototype.sort argument
• TypeError: property "x" is non-configurable and can't be deleted
• TypeError: variable "x" redeclares argument
• Warning: -file- is being assigned a //# sourceMappingURL, but already has one
• Warning: JavaScript 1.6's for-each-in loops are deprecated
• Warning: unreachable code after return statement
• Lexical grammar
• Enumerability and ownership of properties
• Iteration protocols
• Transitioning to strict mode
• Template literals
• Deprecated features
• ECMAScript 5 support in Mozilla
• ECMAScript 6 support in Mozilla
• ECMAScript Next support in Mozilla
• Firefox JavaScript changelog
• New in JavaScript 1.1
• New in JavaScript 1.2
• New in JavaScript 1.3
• New in JavaScript 1.4
• New in JavaScript 1.5
• New in JavaScript 1.6
• New in JavaScript 1.7
• New in JavaScript 1.8
• New in JavaScript 1.8.1
• New in JavaScript 1.8.5
• Documentation:
• All pages index
• Methods index
• Properties index
• Pages tagged "JavaScript"
• JavaScript doc status
• The MDN project

SyntaxError: invalid assignment left-hand side

The JavaScript exception "invalid assignment left-hand side" occurs when there was an unexpected assignment somewhere. It may be triggered when a single = sign was used instead of == or === .

SyntaxError or ReferenceError , depending on the syntax.

What went wrong?

There was an unexpected assignment somewhere. This might be due to a mismatch of an assignment operator and an equality operator , for example. While a single = sign assigns a value to a variable, the == or === operators compare a value.

Typical invalid assignments

In the if statement, you want to use an equality operator ( === ), and for the string concatenation, the plus ( + ) operator is needed.

Assignments producing ReferenceErrors

Invalid assignments don't always produce syntax errors. Sometimes the syntax is almost correct, but at runtime, the left hand side expression evaluates to a value instead of a reference , so the assignment is still invalid. Such errors occur later in execution, when the statement is actually executed.

Function calls, new calls, super() , and this are all values instead of references. If you want to use them on the left hand side, the assignment target needs to be a property of their produced values instead.

Note: In Firefox and Safari, the first example produces a ReferenceError in non-strict mode, and a SyntaxError in strict mode . Chrome throws a runtime ReferenceError for both strict and non-strict modes.

Using optional chaining as assignment target

Optional chaining is not a valid target of assignment.

Instead, you have to first guard the nullish case.

• Assignment operators
• Equality operators

© 2005–2023 MDN contributors. Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Invalid_assignment_left-hand_side

• Get Started

Jan 26, 2017 6:00:03 AM | JavaScript - ReferenceError: invalid assignment left-hand side

Today we examine the invalid assignment error, which is thrown, as the name implies, when code attempts to perform an invalid assignment somewhere.

Next on the list in our extensive JavaScript Error Handling series we're going to examine the Invalid Left-Hand Assignment error in greater detail. The Invalid Left-Hand Assignment error is a sub-object of ReferenceError and is thrown, as the name implies, when code attempts to perform an invalid assignment somewhere.

In this post we'll look at a few code examples to illustrate some common methods of producing an Invalid Left-Hand Assignment error, as well as examine how to handle this error when it rears its ugly head. Let the party begin!

The Technical Rundown

• All JavaScript error objects are descendants of the  Error  object, or an inherited object therein.
• The  ReferenceError  object is inherited from the  Error  object.
• The Invalid Left-Hand Assignment error is a specific type of ReferenceError object.

When Should You Use It?

As one of the simplest JavaScript errors to understand, the Invalid Left-Hand Assignment error appears in only a handful of situations in which code is attempting to pass an assignment incorrectly. While this is generally thought of as a syntactic issue, JavaScript defines this particular assignment error as a ReferenceError, since the engine effectively assumes an assignment to a non-referenced variable is being attempted.

The most common example of an Invalid Left-Hand Assignment error is when attempting to compare a value using a assignment operator (=), rather than using a proper comparison operator (== or ===). For example, here we're attempting to perform a basic comparison of the variable name with the values John or Fred. Unfortunately, we've made the mistake of using the assignment operator =, instead of a comparison operator such as == or ===:

try { var name = 'Bob'; if (name = 'John' || name = 'Fred') { console.log(`${name} returns!`) } else { console.log(`Just ${name} this time.`) } } catch (e) { if (e instanceof ReferenceError) { printError(e, true); } else { printError(e, false); } }

Sure enough, rather than giving us an output, the JavaScript engine produces the expected Invalid Left-Hand Assignment error:

It's worth noting that catching an Invalid Left-Hand Assignment error with a typical try-catch block is particular difficult, because the engine parses the code from inside out, meaning inner code blocks are parsed and executed before outer blocks. Since the issue of using a = assignment operator instead of a == comparison operator means the actual structure of the code is changed from the expected, the outer try-catch fails to be parsed and properly executed. In short, this means Invalid Left-Hand Assignment errors are always "raw", without any simple means of catching them.

Another common method for producing an Invalid Left-Hand Assignment error is when attempting to concatenate a string value onto a variable using the addition assignment += operator, instead of the concatenation operator +. For example, below we're attempting to perform concatenation on the name variable on multiple lines, but we've accidentally used the += operator:

try { var name = 'Bob' += ' Smith';

console.log(`Name is ${name}.`); } catch (e) { if (e instanceof ReferenceError) { printError(e, true); } else { printError(e, false); } }

This isn't the syntax JavaScript expects when concatenating multiple values onto a string, so an Invalid Left-Hand Assignment error is thrown:

To resolve this, we simply need to replace += with the concatenation operator +:

try { var name = 'Bob' + ' Smith';

Now we skip the Invalid Left-Hand Assignment error entirely and get our expected output indicating the full name stored in the name variable:

To dive even deeper into understanding how your applications deal with JavaScript Errors, check out the revolutionary Airbrake JavaScript error tracking tool for real-time alerts and instantaneous insight into what went wrong with your JavaScript code.

Written By: Frances Banks

You may also like.

Dec 28, 2016 8:00:56 AM | JavaScript Error Handling - ReferenceError: assignment to undeclared variable “x”

Feb 15, 2017 7:41:35 am | javascript error handling: syntaxerror: "use strict" not allowed in function with non-simple parameters, may 21, 2017 9:00:51 am | javascript errors - syntaxerror: test for equality mistyped as assignment.

© Airbrake. All rights reserved. Terms of Service | Privacy Policy | DPA

ReferenceError: invalid assignment left-hand side

The JavaScript exception "invalid assignment left-hand side" occurs when there was an unexpected assignment somewhere. For example, a single " = " sign was used instead of " == " or " === ".

ReferenceError .

What went wrong?

There was an unexpected assignment somewhere. This might be due to a mismatch of a assignment operator and an equality operator , for example. While a single " = " sign assigns a value to a variable, the " == " or " === " operators compare a value.

What went wrong?

ReferenceError .

There was an unexpected assignment somewhere. This might be due to a mismatch of a assignment operator and a comparison operator , for example. While a single " = " sign assigns a value to a variable, the " == " or " === " operators compare a value.

In the if statement, you want to use a comparison operator ("=="), and for the string concatenation, the plus ("+") operator is needed.

• Assignment operators
• Comparison operators

Document Tags and Contributors

• ReferenceError
• JavaScript basics
• JavaScript first steps
• JavaScript building blocks
• Introducing JavaScript objects
• Introduction
• Grammar and types
• Control flow and error handling
• Loops and iteration
• Expressions and operators
• Numbers and dates
• Text formatting
• Regular expressions
• Indexed collections
• Keyed collections
• Working with objects
• Details of the object model
• Using promises
• Iterators and generators
• Meta programming
• Client-side web APIs
• A re-introduction to JavaScript
• JavaScript data structures
• Equality comparisons and sameness
• Inheritance and the prototype chain
• Strict mode
• JavaScript typed arrays
• Memory Management
• Concurrency model and Event Loop
• References:
• ArrayBuffer
• AsyncFunction
• Float32Array
• Float64Array
• GeneratorFunction
• InternalError
• Intl.Collator
• Intl.DateTimeFormat
• Intl.ListFormat
• Intl.NumberFormat
• Intl.PluralRules
• Intl.RelativeTimeFormat
• SharedArrayBuffer
• SyntaxError
• Uint16Array
• Uint32Array
• Uint8ClampedArray
• WebAssembly
• decodeURI()
• decodeURIComponent()
• encodeURI()
• encodeURIComponent()
• parseFloat()
• Arithmetic operators
• Array comprehensions
• Bitwise operators
• Comma operator
• Conditional (ternary) operator
• Destructuring assignment
• Expression closures
• Generator comprehensions
• Grouping operator
• Legacy generator function expression
• Logical operators
• Object initializer
• Operator precedence
• (currently at stage 1) pipes the value of an expression into a function. This allows the creation of chained function calls in a readable manner. The result is syntactic sugar in which a function call with a single argument can be written like this:">Pipeline operator
• Property accessors
• Spread syntax
• async function expression
• class expression
• delete operator
• function expression
• function* expression
• in operator
• new operator
• void operator
• Legacy generator function
• async function
• for await...of
• for each...in
• function declaration
• import.meta
• try...catch
• Arrow functions
• Default parameters
• Method definitions
• Rest parameters
• The arguments object
• constructor
• element loaded from a different domain for which you violated the same-origin policy.">Error: Permission denied to access property "x"
• InternalError: too much recursion
• RangeError: argument is not a valid code point
• RangeError: invalid array length
• RangeError: invalid date
• RangeError: precision is out of range
• RangeError: radix must be an integer
• RangeError: repeat count must be less than infinity
• RangeError: repeat count must be non-negative
• ReferenceError: "x" is not defined
• ReferenceError: assignment to undeclared variable "x"
• ReferenceError: can't access lexical declaration`X' before initialization
• ReferenceError: deprecated caller or arguments usage
• ReferenceError: reference to undefined property "x"
• SyntaxError: "0"-prefixed octal literals and octal escape seq. are deprecated
• SyntaxError: "use strict" not allowed in function with non-simple parameters
• SyntaxError: "x" is a reserved identifier
• SyntaxError: JSON.parse: bad parsing
• SyntaxError: Malformed formal parameter
• SyntaxError: Unexpected token
• SyntaxError: Using //@ to indicate sourceURL pragmas is deprecated. Use //# instead
• SyntaxError: a declaration in the head of a for-of loop can't have an initializer
• SyntaxError: applying the 'delete' operator to an unqualified name is deprecated
• SyntaxError: for-in loop head declarations may not have initializers
• SyntaxError: function statement requires a name
• SyntaxError: identifier starts immediately after numeric literal
• SyntaxError: illegal character
• SyntaxError: invalid regular expression flag "x"
• SyntaxError: missing ) after argument list
• SyntaxError: missing ) after condition
• SyntaxError: missing : after property id
• SyntaxError: missing ; before statement
• SyntaxError: missing = in const declaration
• SyntaxError: missing ] after element list
• SyntaxError: missing formal parameter
• SyntaxError: missing name after . operator
• SyntaxError: missing variable name
• SyntaxError: missing } after function body
• SyntaxError: missing } after property list
• SyntaxError: redeclaration of formal parameter "x"
• SyntaxError: return not in function
• SyntaxError: test for equality (==) mistyped as assignment (=)?
• SyntaxError: unterminated string literal
• TypeError: "x" has no properties
• TypeError: "x" is (not) "y"
• TypeError: "x" is not a constructor
• TypeError: "x" is not a function
• TypeError: "x" is not a non-null object
• TypeError: "x" is read-only
• TypeError: 'x' is not iterable
• TypeError: More arguments needed
• TypeError: Reduce of empty array with no initial value
• TypeError: can't access dead object
• TypeError: can't access property "x" of "y"
• TypeError: can't define property "x": "obj" is not extensible
• TypeError: can't delete non-configurable array element
• TypeError: can't redefine non-configurable property "x"
• TypeError: cannot use 'in' operator to search for 'x' in 'y'
• TypeError: cyclic object value
• TypeError: invalid 'instanceof' operand 'x'
• TypeError: invalid Array.prototype.sort argument
• TypeError: invalid arguments
• TypeError: invalid assignment to const "x"
• TypeError: property "x" is non-configurable and can't be deleted
• TypeError: setting getter-only property "x"
• TypeError: variable "x" redeclares argument
• URIError: malformed URI sequence
• Warning: -file- is being assigned a //# sourceMappingURL, but already has one
• Warning: 08/09 is not a legal ECMA-262 octal constant
• Warning: Date.prototype.toLocaleFormat is deprecated
• Warning: JavaScript 1.6's for-each-in loops are deprecated
• Warning: String.x is deprecated; use String.prototype.x instead
• Warning: expression closures are deprecated
• Warning: unreachable code after return statement
• X.prototype.y called on incompatible type
• JavaScript technologies overview
• Lexical grammar
• Enumerability and ownership of properties
• Iteration protocols
• Transitioning to strict mode
• Template literals
• Deprecated features
• ECMAScript 2015 support in Mozilla
• ECMAScript 5 support in Mozilla
• ECMAScript Next support in Mozilla
• Firefox JavaScript changelog
• New in JavaScript 1.1
• New in JavaScript 1.2
• New in JavaScript 1.3
• New in JavaScript 1.4
• New in JavaScript 1.5
• New in JavaScript 1.6
• New in JavaScript 1.7
• New in JavaScript 1.8
• New in JavaScript 1.8.1
• New in JavaScript 1.8.5
• Documentation:
• All pages index
• Methods index
• Properties index
• Pages tagged "JavaScript"
• JavaScript doc status
• The MDN project

Learn the best of web development

Get the latest and greatest from MDN delivered straight to your inbox.

Thanks! Please check your inbox to confirm your subscription.

If you haven’t previously confirmed a subscription to a Mozilla-related newsletter you may have to do so. Please check your inbox or your spam filter for an email from us.

• DSA with JS - Self Paced
• JS Tutorial
• JS Exercise
• JS Interview Questions
• JS Operator
• JS Projects
• JS Examples
• JS Free JS Course
• JS A to Z Guide
• JS Formatter
• JavaScript Error Object Complete Reference

JS Range Error

• JavaScript RangeError - Invalid date
• JavaScript RangeError - Repeat count must be non-negative

JS Reference Error

• JavaScript ReferenceError - Can't access lexical declaration`variable' before initialization
• JavaScript ReferenceError - Invalid assignment left-hand side
• JavaScript ReferenceError - Assignment to undeclared variable
• JavaScript ReferenceError - Reference to undefined property "x"
• JavaScript ReferenceError - variable is not defined
• JavaScript ReferenceError Deprecated caller or arguments usage

JS Syntax Error

• JavaScript SyntaxError - Illegal character
• JavaScript SyntaxError - Identifier starts immediately after numeric literal
• JavaScript SyntaxError - Function statement requires a name
• JavaScript SyntaxError - Missing } after function body
• JavaScript SyntaxError - Missing } after property list
• JavaScript SyntaxError - Missing variable name
• JavaScript SyntaxError - Missing ] after element list
• JavaScript SyntaxError - Invalid regular expression flag "x"
• JavaScript SyntaxError "variable" is a reserved identifier
• JavaScript SyntaxError - Missing ':' after property id
• JavaScript SyntaxError - Missing ) after condition
• JavaScript SyntaxError - Missing formal parameter
• JavaScript SyntaxError - Missing ; before statement
• JavaScript SyntaxError - Missing = in const declaration
• JavaScript SyntaxError - Missing name after . operator
• JavaScript SyntaxError - Redeclaration of formal parameter "x"
• JavaScript SyntaxError - Missing ) after argument list
• JavaScript SyntaxError - Return not in function
• JavaScript SyntaxError: Unterminated string literal
• JavaScript SyntaxError - Applying the 'delete' operator to an unqualified name is deprecated
• JavaScript SyntaxError - Using //@ to indicate sourceURL pragmas is deprecated. Use //# instead
• JavaScript SyntaxError - Malformed formal parameter
• JavaScript SyntaxError - "0"-prefixed octal literals and octal escape sequences are deprecated
• JavaScript SyntaxError - Test for equality (==) mistyped as assignment (=)?
• JavaScript SyntaxError - "x" is not a legal ECMA-262 octal constant

JS Type Error

• JavaScript TypeError - "X" is not a non-null object
• JavaScript TypeError - "X" is not a constructor
• JavaScript TypeError - "X" has no properties
• JavaScript TypeError - "X" is (not) "Y"
• JavaScript TypeError - "X" is not a function
• JavaScript TypeError - 'X' is not iterable
• JavaScript TypeError - More arguments needed
• JavaScript TypeError - "X" is read-only
• JavaScript TypeError - Reduce of empty array with no initial value
• JavaScript TypeError - Can't assign to property "X" on "Y": not an object
• JavaScript TypeError - Can't access property "X" of "Y"
• JavaScript TypeError - Can't define property "X": "Obj" is not extensible
• JavaScript TypeError - X.prototype.y called on incompatible type
• JavaScript TypeError - Invalid assignment to const "X"
• JavaScript TypeError - Property "X" is non-configurable and can't be deleted
• JavaScript TypeError - Can't redefine non-configurable property "x"
• JavaScript TypeError - Variable "x" redeclares argument
• JavaScript TypeError - Setting getter-only property "x"
• JavaScript TypeError - Invalid 'instanceof' operand 'x'
• JavaScript TypeError - Invalid Array.prototype.sort argument
• JavaScript TypeError - Cyclic object value
• JavaScript TypeError - Can't delete non-configurable array element

JS Other Errors

• JavaScript URIError | Malformed URI Sequence
• JavaScript Warning - Date.prototype.toLocaleFormat is deprecated
• Logging Script Errors in JavaScript

JS Error Instance

• JavaScript Error message Property
• JavaScript Error name Property
• JavaScript Error.prototype.toString() Method

JavaScript ReferenceError – Invalid assignment left-hand side

This JavaScript exception invalid assignment left-hand side occurs if there is a wrong assignment somewhere in code. A single “=” sign instead of “==” or “===” is an Invalid assignment.

Error Type:

Cause of the error: There may be a misunderstanding between the assignment operator and a comparison operator.

Basic Example of ReferenceError – Invalid assignment left-hand side, run the code and check the console

Example 1: In this example, “=” operator is misused as “==”, So the error occurred.

Example 2: In this example, the + operator is used with the declaration, So the error has not occurred.

Output: 

Please Login to comment...

Similar reads.

• JavaScript-Errors
• Web Technologies
• 10 Ways to Use Microsoft OneNote for Note-Taking
• 10 Best Yellow.ai Alternatives & Competitors in 2024
• 10 Best Online Collaboration Tools 2024
• 10 Best Autodesk Maya Alternatives for 3D Animation and Modeling in 2024
• 30 OOPs Interview Questions and Answers (2024)

Improve your Coding Skills with Practice

What kind of Experience do you want to share?

• Skip to main content

• ReferenceError: invalid assignment left-hand side

The JavaScript exception "invalid assignment left-hand side" occurs when there was an unexpected assignment somewhere. For example, a single " = " sign was used instead of " == " or " === ".

ReferenceError .

What went wrong?

There was an unexpected assignment somewhere. This might be due to a mismatch of a assignment operator and a comparison operator , for example. While a single " = " sign assigns a value to a variable, the " == " or " === " operators compare a value.

Typical invalid assignments

In the if statement, you want to use a comparison operator ("=="), and for the string concatenation, the plus ("+") operator is needed.

• Assignment operators
• Comparison operators
• JavaScript basics
• JavaScript first steps
• JavaScript building blocks
• Introducing JavaScript objects
• Introduction
• Grammar and types
• Control flow and error handling
• Loops and iteration
• Expressions and operators
• Numbers and dates
• Text formatting
• Regular expressions
• Indexed collections
• Keyed collections
• Working with objects
• Details of the object model
• Using promises
• Iterators and generators
• Meta programming
• JavaScript modules
• Client-side web APIs
• A re-introduction to JavaScript
• JavaScript data structures
• Equality comparisons and sameness
• Inheritance and the prototype chain
• Strict mode
• JavaScript typed arrays
• Memory Management
• Concurrency model and Event Loop
• References:
• AggregateError
• ArrayBuffer
• AsyncFunction
• BigInt64Array
• BigUint64Array
• Float32Array
• Float64Array
• GeneratorFunction
• InternalError
• ReferenceError
• SharedArrayBuffer
• SyntaxError
• Uint16Array
• Uint32Array
• Uint8ClampedArray
• WebAssembly
• decodeURI()
• decodeURIComponent()
• encodeURI()
• encodeURIComponent()
• parseFloat()
• Arithmetic operators
• Bitwise operators
• Comma operator
• Conditional (ternary) operator
• Destructuring assignment
• Function expression
• Grouping operator
• Logical operators
• Nullish coalescing operator
• Object initializer
• Operator precedence
• Optional chaining
• Pipeline operator
• Property accessors
• Spread syntax
• async function expression
• class expression
• delete operator
• function* expression
• in operator
• new operator
• void operator
• async function
• for await...of
• function declaration
• import.meta
• try...catch
• Arrow function expressions
• Default parameters
• Method definitions
• Rest parameters
• The arguments object
• Class fields
• constructor
• Error: Permission denied to access property "x"
• InternalError: too much recursion
• RangeError: argument is not a valid code point
• RangeError: invalid array length
• RangeError: invalid date
• RangeError: precision is out of range
• RangeError: radix must be an integer
• RangeError: repeat count must be less than infinity
• RangeError: repeat count must be non-negative
• ReferenceError: "x" is not defined
• ReferenceError: assignment to undeclared variable "x"
• ReferenceError: can't access lexical declaration "x" before initialization
• ReferenceError: deprecated caller or arguments usage
• ReferenceError: reference to undefined property "x"
• SyntaxError: "0"-prefixed octal literals and octal escape seq. are deprecated
• SyntaxError: "use strict" not allowed in function with non-simple parameters
• SyntaxError: "x" is a reserved identifier
• SyntaxError: JSON.parse: bad parsing
• SyntaxError: Malformed formal parameter
• SyntaxError: Unexpected token
• SyntaxError: Using //@ to indicate sourceURL pragmas is deprecated. Use //# instead
• SyntaxError: a declaration in the head of a for-of loop can't have an initializer
• SyntaxError: applying the "delete" operator to an unqualified name is deprecated
• SyntaxError: for-in loop head declarations may not have initializers
• SyntaxError: function statement requires a name
• SyntaxError: identifier starts immediately after numeric literal
• SyntaxError: illegal character
• SyntaxError: invalid regular expression flag "x"
• SyntaxError: missing ) after argument list
• SyntaxError: missing ) after condition
• SyntaxError: missing : after property id
• SyntaxError: missing ; before statement
• SyntaxError: missing = in const declaration
• SyntaxError: missing ] after element list
• SyntaxError: missing formal parameter
• SyntaxError: missing name after . operator
• SyntaxError: missing variable name
• SyntaxError: missing } after function body
• SyntaxError: missing } after property list
• SyntaxError: redeclaration of formal parameter "x"
• SyntaxError: return not in function
• SyntaxError: test for equality (==) mistyped as assignment (=)?
• SyntaxError: unterminated string literal
• TypeError: "x" has no properties
• TypeError: "x" is (not) "y"
• TypeError: "x" is not a constructor
• TypeError: "x" is not a function
• TypeError: "x" is not a non-null object
• TypeError: "x" is read-only
• TypeError: "x" is not iterable
• TypeError: More arguments needed
• TypeError: Reduce of empty array with no initial value
• TypeError: X.prototype.y called on incompatible type
• TypeError: can't access dead object
• TypeError: can't access property "x" of "y"
• TypeError: can't assign to property "x" on "y": not an object
• TypeError: can't define property "x": "obj" is not extensible
• TypeError: can't delete non-configurable array element
• TypeError: can't redefine non-configurable property "x"
• TypeError: cannot use "in" operator to search for "x" in "y"
• TypeError: cyclic object value
• TypeError: invalid "instanceof" operand "x"
• TypeError: invalid Array.prototype.sort argument
• TypeError: invalid arguments
• TypeError: invalid assignment to const "x"
• TypeError: property "x" is non-configurable and can't be deleted
• TypeError: setting getter-only property "x"
• TypeError: variable "x" redeclares argument
• URIError: malformed URI sequence
• Warning: -file- is being assigned a //# sourceMappingURL, but already has one
• Warning: 08/09 is not a legal ECMA-262 octal constant
• Warning: Date.prototype.toLocaleFormat is deprecated
• Warning: JavaScript 1.6's for-each-in loops are deprecated
• Warning: String.x is deprecated; use String.prototype.x instead
• Warning: expression closures are deprecated
• Warning: unreachable code after return statement
• JavaScript technologies overview
• Lexical grammar
• Enumerability and ownership of properties
• Iteration protocols
• Transitioning to strict mode
• Template literals
• Deprecated features

How to solve “Invalid left-hand side in assignment” in JavaScript

The “Invalid left-hand side in assignment” in JavaScript is a syntax error that often occurs in comparing values, such as using the “=” sign to compare. This article will give examples of everyday situations and how to fix them.

Table of Contents

What causes the “Invalid left-hand side in assignment” in JavaScript?

This is a very common syntax error. There are many causes of errors, such as wrong comparison signs, using “=” to compare two values, and not creating a variable to receive a value from the function. Here are examples of some errors.

Using the wrong comparison sign

“Invalid left-hand side in assignment” is an error caused by misspelled operator when comparing two values.

Using “=” to compare two values

This error also happens because instead of using “===”, you use “=” to compare.

Not creating a variable to receive a value from the function

This case leaves the wrong position of the variable.

Do not use square brackets when accessing object properties

For properties like this, we need to use square brackets.

Solution for the error “Invalid left-hand side in assignment” in JavaScript

Use the correct operator.

We need to pay attention to the comparison signs in expressions.

Pay attention to the position on either side of the “=”

To get the value of a function, we need to create a variable to the left of the “=” sign.

Use square brackets when accessing properties

For properties of objects with two or more words, we use square brackets.

The article has given some examples that lead to the error “Invalid left-hand side in assignment” in JavaScript. These are just syntax errors , pay attention to the process of writing code, and we will avoid such errors. We hope you can fix it quickly through this article. Good luck to you!

Maybe you are interested :

• TypeError: Assignment to Constant Variable in JavaScript
• Element type is invalid, expected a string (for built in components) or a class/function but got – How to solve?
• RangeError: Invalid time value in JavaScript

Carolyn Hise has three years of software development expertise. Strong familiarity with the following languages is required: Python, Typescript/Nodejs, .Net, Java, C++, and a strong foundation in Object-oriented programming (OOP).

Related Posts

How to ignoring case check if array contains string in javascript.

• Mary Ralston
• January 5, 2023

There are two common ways to check if the array contains a string ignoring case […]

How To Check If Date Is Monday Using JavaScript

• Bruce Warren

This article will share how to check if date is Monday using JavaScript. We will […]

Check if an object contains a function in JavaScript

• Edward Anderson

Hello guys! Today we will share a guide on how to check if an object […]

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Save my name, email, and website in this browser for the next time I comment.

Search code, repositories, users, issues, pull requests...

Provide feedback.

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly.

To see all available qualifiers, see our documentation .

• Notifications

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement . We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Invalid left-hand side in assignment #6628

marvix commented Jan 25, 2022

• 👍 1 reaction
• 😕 1 reaction

ncperng commented Feb 18, 2022

Sorry, something went wrong.

bluwy commented Feb 19, 2022

Ncperng commented feb 19, 2022.

github-actions bot commented Feb 19, 2022

Niputi commented Feb 19, 2022

No branches or pull requests

JavaScript初心者必見！Invalid assignment left-hand sideエラーを理解してコードを正確に書こう

Javascriptにおけるinvalid assignment left-hand sideエラー.

このエラーが発生する主な原因は以下の2つです。

• 左辺が未定義の変数である
• 左辺がオブジェクトのプロパティではない

Invalid assignment left-hand side エラーを回避するには、以下の点に注意する必要があります。

• 左辺が有効な変数であることを確認する
• 左辺がオブジェクトのプロパティである場合は、ドット記法を使用する

以下のコードは、 Invalid assignment left-hand side エラーが発生する例です。

Invalid assignment left-hand side エラーは、コードの構文エラーの一種です。このエラーが発生した場合は、コードを見直し、左辺が有効な変数またはオブジェクトのプロパティであることを確認する必要があります。

Invalid assignment left-hand side エラーが発生すると、以下のエラーメッセージが表示されます。

Invalid assignment left-hand side エラーは、JavaScriptの基礎的なエラーの一つです。このエラーを理解することで、より正確なコードを書くことができます。

JavaScript 例外 "invalid assignment left-hand side" は、どこかに予期しない割り当てがあった場合に発生します。 == または === の代わりに単一の = サインが使用された場合にトリガーされる可能性があります。

SyntaxError または ReferenceError (構文に応じて)。

どこかで予期せぬ任務があった。これは、たとえば assignment operator と equality operator の不一致が原因である可能性があります。単一の = 符号が変数に値を割り当てるのに対し、 == または === 演算子は値を比較します。

典型的な無効な割り当て

if ステートメントでは、等価演算子 ( === ) を使用する必要があり、文字列連結にはプラス演算子 ( + ) が必要です。

ReferenceError を生成する割り当て

無効な代入によって常に構文エラーが発生するとは限りません。場合によっては、構文がほぼ正しい場合でも、実行時に左側の式が参照ではなく値に評価されるため、割り当ては依然として無効になります。このようなエラーは、実行後のステートメントが実際に実行されるときに発生します。

関数呼び出し、 new 呼び出し、 super() 、および this はすべて、参照ではなく値です。これらを左側で使用したい場合は、代わりに代入ターゲットを生成された値のプロパティにする必要があります。

注: Firefox と Safari では、最初の例では非厳密モードで ReferenceError が生成され、 strict mode で SyntaxError が生成されます。Chrome は、厳密モードと非厳密モードの両方でランタイム ReferenceError をスローします。

割り当てターゲットとしてオプションのチェーンを使用する

Optional chaining は有効な割り当てのターゲットではありません。

代わりに、最初にnullish caseを保護する必要があります。

• Assignment operators
• Equality operators

© 2005–2023 MDN contributors. Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Invalid_assignment_left-hand_side

JavaScriptの非同期処理：async/awaitとPromiseを使いこなす

await は非同期処理を待機するために使用されるキーワードですが、誤った使い方をすると "Bad await" エラーが発生します。このエラーは、await を使用できない場所で呼び出されたり、await が必要な場所で呼び出されなかったりする場合に発生します。

• 【完全ガイド】JavaScript Arrayのentriesメソッドの使い方と注意点
• JavaScript Array.@@iterator：イテレータの基本を理解しよう
• JavaScriptエラーの種類：SyntaxErrorってどんなエラー？

JavaScript エラーメッセージ「Identifier after number」の詳細解説

JavaScript Date.setMonth() メソッドを使用する際の注意点

Javascript array.copywithin を徹底解説！使用方法、サンプルコード、注意点、エラーまで網羅.