Invalid left-hand side in assignment in JavaScript [Solved]

avatar

Last updated: Mar 2, 2024 Reading time · 2 min

banner

# Invalid left-hand side in assignment in JavaScript [Solved]

The "Invalid left-hand side in assignment" error occurs when we have a syntax error in our JavaScript code.

The most common cause is using a single equal sign instead of double or triple equals in a conditional statement.

To resolve the issue, make sure to correct any syntax errors in your code.

invalid left hand side in assignment error

Here are some examples of how the error occurs.

# Use double or triple equals when comparing values

The most common cause of the error is using a single equal sign = instead of double or triple equals when comparing values.

use double or triple equals when comparing values

The engine interprets the single equal sign as an assignment and not as a comparison operator.

We use a single equals sign when assigning a value to a variable.

assignment vs equality

However, we use double equals (==) or triple equals (===) when comparing values.

# Use bracket notation for object properties that contain hyphens

Another common cause of the error is trying to set an object property that contains a hyphen using dot notation.

use bracket notation for object properties containing hyphens

You should use bracket [] notation instead, e.g. obj['key'] = 'value' .

# Assigning the result of calling a function to a value

The error also occurs when trying to assign the result of a function invocation to a value as shown in the last example.

If you aren't sure where to start debugging, open the console in your browser or the terminal in your Node.js application and look at which line the error occurred.

The screenshot above shows that the error occurred in the index.js file on line 25 .

You can hover over the squiggly red line to get additional information on why the error was thrown.

book cover

Borislav Hadzhiev

Web Developer

buy me a coffee

Copyright © 2024 Borislav Hadzhiev

How to fix SyntaxError: invalid assignment left-hand side

uncaught syntaxerror invalid left hand side in assignment main chunk js

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

How to reproduce this error

How to fix this error, other causes for this error.

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

Take your skills to the next level ⚡️

  • 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

Improve your Coding Skills with Practice

 alt=

What kind of Experience do you want to share?

Airbrake logo144-1

  • 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.

 alt=

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

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

Uncaught syntaxerror invalid left-hand side in assignment

The   uncaught syntaxerror invalid left-hand side in assignment   is an error message that is frequently encountered while working with JavaScript.

This error message is easy to fix however, if you’re not familiar with you’ll get confused about how to resolve it.

Fortunately, in this article, we’ll delve into the causes of this syntaxerror and solutions for the  invalid left-hand side in assignment expression .

What is uncaught syntaxerror “invalid left-hand side in assignment”?

Here’s another one:

In addition to that, this error message typically indicates that there is a problem with the syntax of an assignment statement.

Why does the “invalid left-hand side in assignment” syntaxerror occur?

It is because you are using a single equal = sign rather than a double == or triple sign ===.

How to fix the “uncaught syntaxerror invalid left-hand side in assignment”?

To fix the  uncaught syntaxerror invalid left hand side in assignment expression   error, you need to identify where the unexpected assignment is happening in your code.

Solution 1: Use double equals (==) or triple equals (===) when comparing values in JavaScript

Incorrect code:

Solution 2: Use correct operator for string concatenation

Corrected code:

In conclusion, the error message uncaught syntaxerror invalid left-hand side in assignment expression  happens in JavaScript when you make an unexpected assignment somewhere. 

To fix this   error, you need to identify where the unexpected assignment is happening in your code and ensure that you are using the correct operator for the intended operation.

This article already provides solutions to fix this error message. By executing the solutions above, you can master this  SyntaxError  with the help of this guide.

Leave a Comment Cancel reply

  • Main Content

uncaught syntaxerror invalid left hand side in assignment main chunk js

  • JavaScript Promises
  • ES6 Features

JavaScript Errors and How to Fix Them

JavaScript can be a nightmare to debug: Some errors it gives can be very difficult to understand at first, and the line numbers given aren’t always helpful either. Wouldn’t it be useful to have a list where you could look to find out what they mean and how to fix them? Here you go!

Below is a list of the strange errors in JavaScript. Different browsers can give you different messages for the same error, so there are several different examples where applicable.

How to read errors?

Before the list, let’s quickly look at the structure of an error message. Understanding the structure helps understand the errors, and you’ll have less trouble if you run into any errors not listed here.

A typical error from Chrome looks like this:

The structure of the error is as follows:

  • Uncaught TypeError : This part of the message is usually not very useful. Uncaught means the error was not caught in a catch statement, and TypeError is the error’s name.
  • undefined is not a function : This is the message part. With error messages, you have to read them very literally. For example in this case it literally means that the code attempted to use undefined like it was a function.

Other webkit-based browsers, like Safari, give errors in a similar format to Chrome. Errors from Firefox are similar, but do not always include the first part, and recent versions of Internet Explorer also give simpler errors than Chrome – but in this case, simpler does not always mean better.

Now onto the actual errors.

Uncaught TypeError: undefined is not a function

Related errors: number is not a function, object is not a function, string is not a function, Unhandled Error: ‘foo’ is not a function, Function Expected

Occurs when attempting to call a value like a function, where the value is not a function. For example:

This error typically occurs if you are trying to call a function in an object, but you typed the name wrong.

Since object properties that don’t exist are undefined by default, the above would result in this error.

The other variations such as “number is not a function” occur when attempting to call a number like it was a function.

How to fix this error: Ensure the function name is correct. With this error, the line number will usually point at the correct location.

Uncaught ReferenceError: Invalid left-hand side in assignment

Related errors: Uncaught exception: ReferenceError: Cannot assign to ‘functionCall()’, Uncaught exception: ReferenceError: Cannot assign to ‘this’

Caused by attempting to assign a value to something that cannot be assigned to.

The most common example of this error is with if-clauses:

In this example, the programmer accidentally used a single equals instead of two. The message “left-hand side in assignment” is referring to the part on the left side of the equals sign, so like you can see in the above example, the left-hand side contains something you can’t assign to, leading to the error.

How to fix this error: Make sure you’re not attempting to assign values to function results or to the this keyword.

Uncaught TypeError: Converting circular structure to JSON

Related errors: Uncaught exception: TypeError: JSON.stringify: Not an acyclic Object, TypeError: cyclic object value, Circular reference in value argument not supported

Always caused by a circular reference in an object, which is then passed into JSON.stringify .

Because both a and b in the above example have a reference to each other, the resulting object cannot be converted into JSON.

How to fix this error: Remove circular references like in the example from any objects you want to convert into JSON.

Unexpected token ;

Related errors: Expected ), missing ) after argument list

The JavaScript interpreter expected something, but it wasn’t there. Typically caused by mismatched parentheses or brackets.

The token in this error can vary – it might say “Unexpected token ]” or “Expected {” etc.

How to fix this error: Sometimes the line number with this error doesn’t point to the correct place, making it difficult to fix.

  • An error with [ ] { } ( ) is usually caused by a mismatching pair. Check that all your parentheses and brackets have a matching pair. In this case, line number will often point to something else than the problem character
  • Unexpected / is related to regular expressions. The line number for this will usually be correct.
  • Unexpected ; is usually caused by having a ; inside an object or array literal, or within the argument list of a function call. The line number will usually be correct for this case as well

Uncaught SyntaxError: Unexpected token ILLEGAL

Related errors: Unterminated String Literal, Invalid Line Terminator

A string literal is missing the closing quote.

How to fix this error: Ensure all strings have the correct closing quote.

Uncaught TypeError: Cannot read property ‘foo’ of null, Uncaught TypeError: Cannot read property ‘foo’ of undefined

Related errors: TypeError: someVal is null, Unable to get property ‘foo’ of undefined or null reference

Attempting to read null or undefined as if it was an object. For example:

How to fix this error: Usually caused by typos. Check that the variables used near the line number pointed by the error are correctly named.

Uncaught TypeError: Cannot set property ‘foo’ of null, Uncaught TypeError: Cannot set property ‘foo’ of undefined

Related errors: TypeError: someVal is undefined, Unable to set property ‘foo’ of undefined or null reference

Attempting to write null or undefined as if it was an object. For example:

How to fix this error: This too is usually caused by typos. Check the variable names near the line the error points to.

Uncaught RangeError: Maximum call stack size exceeded

Related errors: Uncaught exception: RangeError: Maximum recursion depth exceeded, too much recursion, Stack overflow

Usually caused by a bug in program logic, causing infinite recursive function calls.

How to fix this error: Check recursive functions for bugs that could cause them to keep recursing forever.

Uncaught URIError: URI malformed

Related errors: URIError: malformed URI sequence

Caused by an invalid decodeURIComponent call.

How to fix this error: Check that the decodeURIComponent call at the error’s line number gets correct input.

XMLHttpRequest cannot load http://some/url/. No ‘Access-Control-Allow-Origin’ header is present on the requested resource

Related errors: Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://some/url/

This error is always caused by the usage of XMLHttpRequest.

How to fix this error: Ensure the request URL is correct and it respects the same-origin policy . A good way to find the offending code is to look at the URL in the error message and find it from your code.

InvalidStateError: An attempt was made to use an object that is not, or is no longer, usable

Related errors: InvalidStateError, DOMException code 11

Means the code called a function that you should not call at the current state. Occurs usually with XMLHttpRequest , when attempting to call functions on it before it’s ready.

In this case, you would get the error because the setRequestHeader function can only be called after calling xhr.open .

How to fix this error: Look at the code on the line pointed by the error and make sure it runs at the correct time, or add any necessary calls before it (such as xhr.open )

JavaScript has some of the most unhelpful errors I’ve seen, with the exception of the notorious Expected T_PAAMAYIM_NEKUDOTAYIM in PHP. With more familiarity the errors start to make more sense. Modern browsers also help, as they no longer give the completely useless errors they used to.

What’s the most confusing error you’ve seen? Share the frustration in the comments!

Jani Hartikainen

Jani Hartikainen has spent over 10 years building web applications. His clients include companies like Nokia and hot super secret startups. When not programming or playing games, Jani writes about JavaScript and high quality code on his site.

codeutopia.net jhartikainen Posts

Recent Features

CSS Animations Between Media Queries

CSS Animations Between Media Queries

CSS animations are right up there with sliced bread. CSS animations are efficient because they can be hardware accelerated, they require no JavaScript overhead, and they are composed of very little CSS code. Quite often we add CSS transforms to elements via CSS during...

Welcome to My New Office

Welcome to My New Office

My first professional web development was at a small print shop where I sat in a windowless cubical all day. I suffered that boxed in environment for almost five years before I was able to find a remote job where I worked from home. The first...

Incredible Demos

jQuery Chosen Plugin

jQuery Chosen Plugin

Without a doubt, my least favorite form element is the SELECT element.  The element is almost unstylable, looks different across platforms, has had inconsistent value access, and disaster that is the result of multiple=true is, well, a disaster.  Needless to say, whenever a developer goes...

Chris Coyier’s Favorite CodePen Demos

Chris Coyier’s Favorite CodePen Demos

David asked me if I'd be up for a guest post picking out some of my favorite Pens from CodePen. A daunting task! There are so many! I managed to pick a few though that have blown me away over the past few months. If you...

To avoid RangeError errors- the best way might be changing recursions to loops, because browsers have limitations for JavaScript call stack- which is usually from 1525 (IE) to 334028 (FF). I prepared demo to check it in your browser:

http://codepen.io/malyw/pen/pvwoyK

Some Math calculation might take more cycles- so it’s good idea to change them to loops and move e.g. to Web Workers.

That’s a great tip Sergey. It’s true that in some algorithms, it’s possible to run into the recursion limitations without a bug.

This article nails JavaScript errors right on the head. Especially the one about the Unexpected[] or {}. I’ve had that point to the jQuery library when it was just within my own code!

Thanks for sharing!

You can eliminate a lot of these errors by using a linter like jshint or eslint. It’s useful to have a linter in your build process as well as in your editor.

Yeah, I’ve been looking at these kinds of tools lately. Others like Flow and TypeScript could also be useful, though may require a bit more work to set up.

Definitely a topic I might write about in the future!

“I’ve been looking at these kinds of tools lately”? Wow, I thought they were standard practice in the industry nowadays, does anyone really still run their code without checking it with some tool first?

For what is worth, eslint is vastly superior to jshint – more rules (and the ability to write your own), and it differentiates between errors and warnings (so you don’t have to stop a build because of unimportant formatting).

I had similar experience for Javascript, and decided the problem was with the actual language itself. I realise that there is not much point to use Javascript when there are languages available which are not limited and broken and are a pleasure to use and jebug.

Wow! good information very nice article I hope it helps me a lot thanks for sharing

Thanks for this very helpful article. Locating and rectifying error in a large Javascript code has been hugely frustrating, I some times prayed for the day, when some body develops a compiler, interpreter or any helpful tool to help us debug and remove errors.

Great article! Also, I agree with Till about using a linter like JSHint. It’s one way to save page reload time, typing to open the console, finding the correct line where the error occurred, deciphering some of the more cryptic error messages in certain browsers, and teaching good practices when the linter is configured correctly.

Very useful.Thanks!

Awesome article, well done. What further complicates the problem is that each browser has implemented {object Error} in a different way! The behavior and contents change wildly browser to browser. I did a talk on these differences last year:

http://vimeo.com/97537677

Running a JavaScript Error Logging service ( http://Trackjs.com ), we’ve seen tons of crazy errors. Sometimes devices or plugins overload behavior and use JavaScript as a transport layer. For example, Chrome on IOS overloads XmlHttpRequest with extra properties and uses it to communicate to the native webkit client. If you mess with the XmlHttpRequest on this platform, chrome shows tons of nasty security errors!

A code highlighting editor will pretty much make almost all of these errors except the circular JSON reference go away.

er.. and the other runtime errors that i didn’t notice at first glance. :-D

Be grateful you don’t still have to code for IE6, and it’s notoriously unhelpful “unspecified error at line 1” :-O

Thanks a bunch. Saved me a lot of stress

I’m getting an Uncaught TypeError when a response from a jsonp request is received after the timeout I specified. Most of the time it works. However, there are times that our api server is so heavily busy. How do I catch the error rather than seeing Uncaught TypeError in the console?

Thanks! Great site!

  • oleg 9112334024676320 + 1 === 9112334024676320 //=> true //in node,chrome,firefox

Internet Explorer is generating the error “Unable to get property ‘chunkSize’ of undefined or null reference”. What does that mean?

I keep in running into “ORIGINAL EXCEPTION: TypeError: Cannot read property ‘request’ of undefined”

Hi, I have a problem, that I don’t understand. I am using angular/D3/Typescript in a class that creates a chart. I use d3.evet.clientX and all is well, but in my controller it is undefined. why?

Thanks Mike

IE9 has just offered this pair of doozies with absolutely no reference to whatever the issue is, so 7,000 possible lines of code to sift through. Fun :-|

Not a js error though,

fixed the issue. Head banging time finished.

<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>

Even though included necessary files am following error

“{Uncaught TypeError: Cannot read property ‘encode’ of undefined}”

am trying to create front end code editor for python mode but couldn’t make it. have had following this example to compile and execute the code.

“http://qnimate.com/create-an-frontend-editor-with-code-highlighting-and-execution/”

could anyone help me to fix it?

Looking forward

A look at this error would help

Thanks, Aldo

After getting tons of undefined is not an object error just surfing (I gave up on programming in 1965 in the SPS IBM 1620 era) I gave up and decided to find out what I was doing wrong. Thanks for a clear explanation that even an over the hill brain can understand. Good to know the problem isn’t all me ;-)

Getting XML5686: Unspecified XML error while getting response. When response XML huge in IE11. Is their any resolution.

Another strange JS error:

Uncaught (in promise) , pointing to the first empty (!) line of my document

Then, after A LOT of debugging, I realised that it’s caused by an unhandled Promise, rejected by an empty string!

If this isn’t confusing, what is?

Maybe it is cause of uncaught rejection with any parameter?) You should always write caught handler with promises.

where is the problem?

The snippet above resulting error below in the handler function ;-( TypeError: callback is not a function

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!

Navigation Menu

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 You must be signed in to change notification settings

Invalid left-hand side in assignment #29629

@randalpinto

randalpinto Oct 3, 2021

11.1.2

12.22.1

Chrome

MacOS

Other platform

When packaging up my application for serverless deployment the following code:

gets packaged up to:

true = JSON.stringify(true);

which results in the following exception at runtime:

No exception

I am deploying my app using:

A simple API route that returns 200 OK results in this error.

Beta Was this translation helpful? Give feedback.

right, after a tortuous path I finally found the culprit. We use Sentry and deep in their docs it says that the webpack configuration is not compatible with serverless environments: https://docs.sentry.io/platforms/javascript/guides/nextjs/manual-setup/ . This can be closed.

Replies: 4 comments · 3 replies

Patrickchodev oct 3, 2021.

isn't the JavaScript and TypeScript restricted words?

ijjk Oct 5, 2021 Maintainer

Hi, this sounds like a bug in how the bundling in is being handled as shouldn't be processed with webpack which it sounds like it is since the value is being replaced probably via which shouldn't be run on .

@randalpinto

{{editor}}'s edit

Randalpinto oct 6, 2021 author.

the plot thickens, i have tried a completely different serverless deployment method (using AWS amplify) and i get the exact same error. Someone else in the serverless-next issue i opened said:

I am using:

Any ideas?

right, after a tortuous path I finally found the culprit. We use Sentry and deep in their docs it says that the webpack configuration is not compatible with serverless environments: . This can be closed.

zigang93 Apr 11, 2023

after few hour of investigation,
middleware.ts will broken when your next.config.js have webpack config like this below:

remove the config will start your middleware..
any other solution to have build ID ? I want notify user when new build was deploy to docker

webpack: (config, { buildId }) => { config.plugins.push( new webpack.DefinePlugin({ 'process.env': { BUILD_ID: JSON.stringify(buildId), }, }) ) return config },

@KosGrillis

KosGrillis Nov 10, 2023

I can confirm that this is the culprit. Does any one have any fixes for this?

@favll

favll May 5, 2024

Simply rewriting the key for the was enough to fix the issue for me.

.plugins.push( new webpack.DefinePlugin({ "process.env.BUILD_ID": JSON.stringify(buildId), }) );

This is probably due to how the works. To quote the docs:

@randalpinto

This discussion was converted from issue #29582 on October 05, 2021 03:50.

  • Numbered list
  • Unordered list
  • Attach files

Select a reply

  • Stack Overflow Public questions & answers
  • Stack Overflow for Teams Where developers & technologists share private knowledge with coworkers
  • Talent Build your employer brand
  • Advertising Reach developers & technologists worldwide
  • Labs The future of collective knowledge sharing
  • About the company

Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Get early access and see previews of new features.

Invalid left-hand side in assignment but I am trying to assign a variable

I am trying to make a to do list with a edit mode and view mode. I get this error:

Full can be found at https://repl.it/@UCYT5040/Notekeeper , but the Javascript is below.

UCYT5040's user avatar

  • 1 You can't do document.getElementById('item' + (i + 1)) = . . . . I think you may mean document.getElementById('item' + (i + 1)).innerHTML = "<h1 id=\"itemTitle" + (i + 1) + "\">" + document.getElementById('itemTitle' + (i + 1)).value + "</h1>" . You're trying to reassign a function call right now. –  Carcigenicate Feb 2, 2021 at 0:06
  • @Carcigenicate Thanks for the help. Do you know why when I turn on edit mode it returns as <div id="item1"><input type="text" id="itemTitle1" value="New Note"></h1></div> ? It should return as <div id="item1"><input type="text" id="itemTitle1" value="New Note"></input></div>. –  UCYT5040 Feb 2, 2021 at 0:29
  • A separate suggestion: always declare variables used in code and never rely on assignment to an identifier to create global variables for you. (I checked script.js in the codepen does not declare variables). Include "use strict;" as the first line in a script or function to have the compiler generate errors for missing variable declarations. –  traktor Feb 2, 2021 at 2:51

Know someone who can answer? Share a link to this question via email , Twitter , or Facebook .

Your answer.

Reminder: Answers generated by artificial intelligence tools are not allowed on Stack Overflow. Learn more

Sign up or log in

Post as a guest.

Required, but never shown

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy .

Browse other questions tagged javascript html or ask your own question .

  • Featured on Meta
  • The 2024 Developer Survey Is Live
  • The return of Staging Ground to Stack Overflow
  • The [tax] tag is being burninated
  • Policy: Generative AI (e.g., ChatGPT) is banned

Hot Network Questions

  • Who would I call to inspect the integrity of a truss after an electrician cut into it?
  • Are there any jobs that are forbidden by law to convicted felons?
  • Word for a country declaring independence from an empire
  • Is 1.5 hours enough for flight transfer in Frankfurt?
  • Can I travel with my child to the UK if I am not the person named in their visitor's visa?
  • Build the first 6 letters of an Italian codice fiscale (tax identification number)
  • How do you keep the horror spooky when your players are a bunch of goofballs?
  • Converting NEMA 10-30 to 14-30 using ground from adjacent 15 amp receptacle
  • Which program is used in this shot of the movie "The Wrong Woman"
  • What is my new plant Avocado tree leaves dropping?
  • Reaction of RuCl3 and alkaline solution
  • Why is the Mean Value Theorem called "Gauss's"?
  • How to make Bash remove quotes after parameter expansion?
  • Is it rational for heterosexuals to be proud that they were born heterosexual?
  • Tying shoes on Shabbat if you don’t plan to untie them in a day
  • Resolving conflicts
  • Why was the client spooked when he saw the professor's face?
  • Sum of square roots (as an algebraic number)
  • Does retirement (pre-Full Retirement Age) qualify for a special enrollment period for the affordable care act?
  • What percentage of light gets scattered by a mirror?
  • NES Emulator in C
  • A trigonometric equation: how hard could it be?
  • Smallest Harmonic number greater than N
  • How might a physicist define 'mind' using concepts of physics?

uncaught syntaxerror invalid left hand side in assignment main chunk js

  • Skip to main content
  • Skip to search
  • Skip to select language
  • Sign up for free
  • English (US)
  • Português (do Brasil)

このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

ReferenceError: invalid assignment left-hand side

JavaScript の例外 "invalid assignment left-hand side" は、どこかで予想外の代入が行われたときに発生します。例えば、単一の " = " の記号が " == " や " === " の代わりに使用された場合です。

ReferenceError 。

どこかに予想外の代入があります。たとえば、 代入演算子 と 等値演算子 が合っていないからかもしれません。 " = " 記号が 1 つの場合は変数に値を割り当てる一方、" == " か " === " 演算子は値を比較します。

if 文では、等価演算子 ("==") が必要ですし、文字連結にはプラス ("+") 演算子が必要です。

COMMENTS

  1. Why I get "Invalid left-hand side in assignment"?

    7. The problem is that the assignment operator, =, is a low-precedence operator, so it's being interpreted in a way you don't expect. If you put that last expression in parentheses, it works: for(let id in list)(. (!q.id || (id == q.id)) &&. (!q.name || (list[id].name.search(q.name) > -1)) &&. (result[id] = list[id]) ); The real problem is ...

  2. SyntaxError: invalid assignment left-hand side

    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. js. function foo() { return { a: 1 }; } foo ...

  3. Invalid left-hand side in assignment in JavaScript [Solved]

    # Invalid left-hand side in assignment in JavaScript ... Uncaught ReferenceError: Invalid left-hand side in an assignment at index.js:25 SyntaxError: Invalid left-hand side in assignment at ESMLoader.moduleStrategy (node: ...

  4. How to fix SyntaxError: invalid assignment left-hand side

    SyntaxError: invalid assignment left-hand side or SyntaxError: Invalid left-hand side in assignment 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.

  5. Invalid assignment left-hand side

    The Left Shift Assignment Operator is represented by "<<=". This operator moves the specified number of bits to the left and assigns that result to the variable. We can fill the vacated place by 0. The left shift operator treats the integer stored in the variable to the operator's left as a 32-bit binary number. This can also be explained as

  6. JavaScript

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

  7. SyntaxError: invalid assignment left-hand side

    SyntaxError: 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 ===.

  8. JS

    Specifically "Uncaught SyntaxError: Invalid left-hand side in assignment". It is not. The text was updated successfully, but these errors were encountered:

  9. Uncaught syntaxerror invalid left-hand side in assignment

    The JavaScript exception invalid assignment left-hand side usually occurs when there was an unexpected assignment. It is because you are using a single equal = sign rather than a double == or triple sign ===. Invalid assignments don't always produce syntax errors. Sometimes the syntax is almost correct, but at runtime, the left-hand side ...

  10. Invalid left-hand side in assignment · Issue #6628 · vitejs/vite

    You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window.

  11. JavaScript Errors and How to Fix Them

    Uncaught ReferenceError: Invalid left-hand side in assignment Related errors: Uncaught exception: ReferenceError: Cannot assign to 'functionCall()', Uncaught exception: ReferenceError: Cannot assign to 'this'

  12. Three.js minification

    The only difference I can see is that in Nuglify, the initial variables method is being closed before the function is called, wheras the three.min.js isn't and is pulling the function in before closing (apologies for the terminology, happy to be corrected).

  13. SyntaxError: invalid assignment left-hand side

    这类错误会在程序执行到该语句时发生,即在实际执行阶段出现。. js. function foo() { return { a: 1 }; } foo() = 1; // ReferenceError: invalid assignment left-hand side. 函数调用、 new 调用、 super() 和 this 都是值而不是引用。. 如果你想在左侧使用它们,赋值目标需要是它们产生的 ...

  14. SyntaxError: Invalid left-hand side in assignment #846

    Describe the bug. Looks like the tool doesn't play nice when you have an .env variable in the same folder you run serverless.I understand there's a way of passing environment variables to the script but for people coming in trying to deploy their existing apps that already use this form of passing parameters might have a bad experience with the tool.

  15. ReferenceError: invalid assignment left-hand side

    SyntaxError: getter and setter for private name #x should either be both static or non-static; SyntaxError: identifier starts immediately after numeric literal; SyntaxError: illegal character; ReferenceError: invalid assignment left-hand side; SyntaxError: invalid BigInt syntax; SyntaxError: flag de expressão regular inválida "x"

  16. Uncaught ReferenceError : Invalid left-hand side in assignment

    Thanks @micha. It would be better to associate a single click handler with the containing div instead of having one on every span, then give each span an id or data-company attribute or something which the click handler could retrieve to select the appropriate phrase from.

  17. Invalid left-hand side in assignment · vercel next.js

    What version of Next.js are you using? 11.1.2 What version of Node.js are you using? 12.22.1 What browser are you using? Chrome What operating system are you using? MacOS How are you deploying your...

  18. javascript

    I am trying to make a to do list with a edit mode and view mode. I get this error: ReferenceError: Invalid left-hand side in assignment at toggleEditMode (/script.js:8:18) at HTMLButtonElem...

  19. ReferenceError: invalid assignment left-hand side

    SyntaxError: getter and setter for private name #x should either be both static or non-static; SyntaxError: identifier starts immediately after numeric literal; SyntaxError: illegal character; ReferenceError: invalid assignment left-hand side; SyntaxError: invalid BigInt syntax; SyntaxError: invalid regular expression flag "x"