react assignment to constant variable. typeerror assignment to constant variable

You’ve made it this far. Let’s build your first application

DhiWise is free to get started with.

Design to code

• Figma plugin
• Documentation
• DhiWise University
• DhiWise vs Anima
• DhiWise vs Appsmith
• DhiWise vs FlutterFlow
• DhiWise vs Monday Hero
• DhiWise vs Retool
• DhiWise vs Supernova
• DhiWise vs Amplication
• DhiWise vs Bubble
• DhiWise vs Figma Dev Mode
• Terms of Service
• Privacy Policy

Fixing the Uncaught TypeError: Assignment to Constant Variable in JavaScript

Rakesh Purohit

Frequently asked questions, what does it mean when javascript says "assignment to constant variable", can i change the properties of an object declared with const, is it possible to declare a constant without initializing it, how can i fix the "assignment to constant variable" error.

In the dynamic world of JavaScript development, encountering errors is a part of the learning curve that every developer must navigate. Among these, the "Uncaught TypeError: Assignment to Constant Variable" stands out as a common yet puzzling hurdle. This error not only interrupts the normal execution of your code but also serves as a crucial learning opportunity to understand JavaScript declarations better.

This blog dives deep into the causes of this error, explores solutions, and offers best practices to avoid it in the future, ensuring your development process is smoother and more efficient.

Understanding the Error

What is the "uncaught typeerror: assignment to constant variable".

The JavaScript exception “Assignment to constant variable” occurs when there's an attempt to alter a constant value. Constants, declared using the const keyword, are meant to be a read-only reference to a value. Unlike var or let, constants cannot be re-assigned or redeclared, making them a staple for values that should remain unchanged throughout the execution of a program.

Why does JavaScript throw this exception?

JavaScript enforces the immutability of constants to ensure code predictability and integrity. When a constant variable is attempted to be modified, JavaScript throws this error to signal a breach of its fundamental rules. Consider the following snippet:

This code attempts to re-assign a new value to const x, leading to the mentioned TypeError.

Causes and Solutions

How can assigning a value to the same constant name cause an error.

Assigning a new value to a constant within the same block scope is a direct violation of the const declaration's principle. Block scope, in JavaScript, refers to the area within a function or a block where the variable or constant is accessible. Since const creates a block-scoped variable, any attempt to re-assign its value within the same scope leads to an error.

What does block scope mean in the context of this error?

Block scope is crucial in understanding this error. It delineates the boundaries within which a constant is valid. For instance:

In this example, a is block-scoped within the if statement, and re-assigning it triggers the error.

Strategies to avoid and resolve this error.

To circumvent this error, developers have multiple options:

• Use let for variables that need re-assignment.

• Ensure that constants are not mistakenly re-assigned within their scope.

• Re-evaluate the need for the variable to be a constant if re-assignment is necessary.

Best Practices for Using Const

What does the const declaration imply for variable mutability.

The const declaration creates a read-only reference, meaning the variable identifier cannot be re-assigned. However, if the constant is an object, the object's properties can still be mutated. This distinction is vital for using const effectively without running into the "assignment to constant variable" error.

Guidelines for using const effectively in JavaScript code.

• Use const for all variables that do not require re-assignment.

• Understand the scope of your constants to avoid invalid assignments.

• Remember, const does not make the value immutable, just the variable identifier.

Debugging and Troubleshooting

Steps to identify and fix the "assignment to constant variable" error..

When faced with this error, the first step is to locate the constant that is being incorrectly re-assigned. Review your code to ensure that you are not trying to alter a constant within its scope. Utilizing debugging tools and console logs can help identify the exact line where the error occurs.

Utilizing debugging tools to isolate and resolve the issue.

Modern IDEs and browsers come equipped with powerful debugging tools that can pinpoint where the re-assignment attempt is happening. Breakpoints and step-through execution allow developers to observe the state of their variables and constants at various execution points, making it easier to understand and fix the error.

Understanding and resolving the "Uncaught TypeError: Assignment to Constant Variable" error is a stepping stone towards mastering JavaScript. By adhering to best practices and utilizing effective debugging strategies, developers can ensure their code is robust, error-free, and maintainable.

Short on time? Speed things up with DhiWise!!

Tired of manually designing screens, coding on weekends, and technical debt? Let DhiWise handle it for you!

You can build an e-commerce store, healthcare app, portfolio, blogging website, social media or admin panel right away. Use our library of 40+ pre-built free templates to create your first application using DhiWise.

TypeError: Assignment to Constant Variable in JavaScript

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

# TypeError: Assignment to Constant Variable in JavaScript

The "Assignment to constant variable" error occurs when trying to reassign or redeclare a variable declared using the const keyword.

When a variable is declared using const , it cannot be reassigned or redeclared.

Here is an example of how the error occurs.

# Declare the variable using let instead of const

To solve the "TypeError: Assignment to constant variable" error, declare the variable using the let keyword instead of using const .

Variables declared using the let keyword can be reassigned.

We used the let keyword to declare the variable in the example.

Variables declared using let can be reassigned, as opposed to variables declared using const .

You can also use the var keyword in a similar way. However, using var in newer projects is discouraged.

# Pick a different name for the variable

Alternatively, you can declare a new variable using the const keyword and use a different name.

We declared a variable with a different name to resolve the issue.

The two variables no longer clash, so the "assignment to constant" variable error is no longer raised.

# Declaring a const variable with the same name in a different scope

You can also declare a const variable with the same name in a different scope, e.g. in a function or an if block.

The if statement and the function have different scopes, so we can declare a variable with the same name in all 3 scopes.

However, this prevents us from accessing the variable from the outer scope.

# The const keyword doesn't make objects immutable

Note that the const keyword prevents us from reassigning or redeclaring a variable, but it doesn't make objects or arrays immutable.

We declared an obj variable using the const keyword. The variable stores an object.

Notice that we are able to directly change the value of the name property even though the variable was declared using const .

The behavior is the same when working with arrays.

Even though we declared the arr variable using the const keyword, we are able to directly change the values of the array elements.

The const keyword prevents us from reassigning the variable, but it doesn't make objects and arrays immutable.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

• SyntaxError: Unterminated string constant in JavaScript
• TypeError (intermediate value)(...) is not a function in JS

Borislav Hadzhiev

Web Developer

Copyright © 2024 Borislav Hadzhiev

TypeError: Assignment to constant variable when using React useState hook

Abstract: Learn about the common error 'TypeError: Assignment to constant variable' that occurs when using the React useState hook in JavaScript. Understand the cause of the error and how to resolve it effectively.

If you are a React developer, you have probably come across the useState hook, which is a powerful feature that allows you to manage state in functional components. However, there may be times when you encounter a TypeError: Assignment to constant variable error while using the useState hook. In this article, we will explore the possible causes of this error and how to resolve it.

Understanding the Error

The TypeError: Assignment to constant variable error occurs when you attempt to update the value of a constant variable that is declared using the const keyword. In React, when you use the useState hook, it returns an array with two elements: the current state value and a function to update the state value. If you mistakenly try to assign a new value to the state variable directly, you will encounter this error.

Common Causes

There are a few common causes for this error:

• Forgetting to invoke the state update function: When using the useState hook, you need to call the state update function to update the state value. For example, instead of stateVariable = newValue , you should use setStateVariable(newValue) . Forgetting to invoke the function will result in the TypeError: Assignment to constant variable error.
• Using the wrong state update function: If you have multiple state variables in your component, make sure you are using the correct state update function for each variable. Mixing up the state update functions can lead to this error.
• Declaring the state variable inside a loop or conditional statement: If you declare the state variable inside a loop or conditional statement, it will be re-initialized on each iteration or when the condition changes. This can cause the TypeError: Assignment to constant variable error if you try to update the state value.

Resolving the Error

To resolve the TypeError: Assignment to constant variable error, you need to ensure that you are using the state update function correctly and that you are not re-declaring the state variable inside a loop or conditional statement.

If you are forgetting to invoke the state update function, make sure to add parentheses after the function name when updating the state value. For example, change stateVariable = newValue to setStateVariable(newValue) .

If you have multiple state variables, double-check that you are using the correct state update function for each variable. Using the wrong function can result in the error. Make sure to match the state variable name with the corresponding update function.

Lastly, if you have declared the state variable inside a loop or conditional statement, consider moving the declaration outside of the loop or conditional statement. This ensures that the state variable is not re-initialized on each iteration or when the condition changes.

The TypeError: Assignment to constant variable error is a common mistake when using the useState hook in React. By understanding the causes of this error and following the suggested resolutions, you can overcome this issue and effectively manage state in your React applications.

Tags: :  javascript reactjs react-state

Latest news

• Kindle-friendly HTML5 Canvas: Building Simple Web Apps with User-Drawn Canvas Objects
• Deprecated Gradle Features Used in build.gradle Making Incompatible with Gradle 9.0.q
• Implementing an Elorating System for Local Tennis Players: Setting Starting Values
• Rewriting a Regulard Discord Bot to a Discord Self Bot using discord.py-Right
• Understanding switchMap and convertObservable in Angular
• Oracle APEX: Consuming JSON Data from a Webhook for Table Insertion
• Google Sign-In in Android: Default Redirect URI
• Deploying Per-App Content Filters with Intune for iOS 16 and Above
• CSS Scrolling Table Affects Quarto Document: One Table with gt Package
• Failed to Bypass SSL Verification in React Native App
• Updating Dynamically Created Variables with Skillscript: A Step-by-Step Guide
• Resolving Authorization Errors with iOS and macOS Devices on Loading Widgets
• File Corruption Problem in Jupyter Notebook (PyCharm)
• Resolving IOException: An Invalid State Exception When Launching ChromeDriver for Selenium
• Compilation Error in Xcode 16 with iOS 18 when Integrating Flutter Projects
• Understanding the Difference Between MySQL Error and MySQLConnectorError in Python
• Error in Cloud Recognition: Recreating GameObjects
• Tracking Last Login: Managing Client Interactions in CouchDB
• Error in Creating Flutter Bloc: Couldn't find correct Provider<XYZ> BuilderWidget
• Quarkus: Changing OIDC Claim Path for Secured Endpoints
• Making Fields Required Based on Schema-Specific Parent: A Comprehensive Guide
• Missing Origin Level Data on Halfords' Website since September 2024
• VBA: Index Match Lookup Returns Multiple Columns - Column Name but not First Column Lookup
• Kafka Message Compression Not Working at Broker Level
• Adding Border Points to Chart.js
• Introducing Variable X: Range Call Function in Excel
• Desktop Central: Not Connecting Issues with Remote Control Feature
• Running a Face Recognition Project: Which File to Enter Command in VSCode after Cloning GitHub?
• Automatically Port Forwarding Python: A Simple Solution
• Encoding Diacritics in JSON-LD for Software Development Sites: A German Example
• Unable to Get Current Sessions Data Row in Laravel
• IntelliJ: Display Last Execution Timeline in the Editor
• Correct SELinux Policy for MongoDB 7 Enterprise on RHEL 9: Installing the .rpmvs.tgz
• Updating SSL Policy for a GCP Internal Load Balancer Frontend using gCloud CLI
• Boosting Python Performance: Important Localising Variables

How to Fix the ‘TypeError: invalid assignment to const “x” ‘ Error in Our JavaScript App?

• Post author By John Au-Yeung
• Post date August 22, 2021
• No Comments on How to Fix the ‘TypeError: invalid assignment to const “x” ‘ Error in Our JavaScript App?

Sometimes, we may run into the ‘TypeError: invalid assignment to const "x"’ when we’re developing JavaScript apps.

In this article, we’ll look at how to fix the ‘TypeError: invalid assignment to const "x"’ when we’re developing JavaScript apps.

Fix the ‘TypeError: invalid assignment to const "x"’ When Developing JavaScript Apps

To fix the ‘TypeError: invalid assignment to const "x"’ when we’re developing JavaScript apps, we should make sure we aren’t assigning a variable declared with const to a new value.

On Firefox, the error message for this error is TypeError: invalid assignment to const "x" .

On Chrome, the error message for this error is TypeError: Assignment to constant variable.

And on Edge, the error message for this error is TypeError: Assignment to const .

For example, the following code will throw this error:

We tried to assign 100 to COLUMNS which is declared with const , so we’ll get this error.

To fix this, we write:

to declare 2 variables, or we can use let to declare a variable that we can reassign a value to:

Related Posts

Sometimes, we may run into the 'RangeError: invalid date' when we're developing JavaScript apps. In…

Sometimes, we may run into the 'TypeError: More arguments needed' when we're developing JavaScript apps.…

Sometimes, we may run into the 'TypeError: "x" has no properties' when we're developing JavaScript…

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

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.

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

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

TypeError: Assignment to constant variable #9

callum-atwal commented Apr 4, 2020

The only const I could see defined was on line 355 so I changed this to a let and the issue went away. This seems odd since this encoder variable is only being passed through to those other preceding functions.

It might be something worth looking into. Since I'm submitting my work, I'm making these hacky edits - limited by time to investigate this any further but thought I'd raise the issue if there is one that I'm not seeing :D

The text was updated successfully, but these errors were encountered:

dmonad commented Apr 6, 2020

Sorry, something went wrong.

callum-atwal commented Apr 6, 2020

dmonad commented Apr 7, 2020

callum-atwal commented Apr 15, 2020

No branches or pull requests

React Tutorial

React hooks, react exercises, react es6 variables.

Before ES6 there was only one way of defining your variables: with the var keyword. If you did not define them, they would be assigned to the global object. Unless you were in strict mode, then you would get an error if your variables were undefined.

Now, with ES6, there are three ways of defining your variables: var , let , and const .

If you use var outside of a function, it belongs to the global scope.

If you use var inside of a function, it belongs to that function.

If you use var inside of a block, i.e. a for loop, the variable is still available outside of that block.

var has a function scope, not a block scope.

let is the block scoped version of var , and is limited to the block (or expression) where it is defined.

If you use let inside of a block, i.e. a for loop, the variable is only available inside of that loop.

let has a block scope.

Get Certified!

const is a variable that once it has been created, its value can never change.

const has a block scope.

The keyword const is a bit misleading.

It does not define a constant value. It defines a constant reference to a value.

Because of this you can NOT:

• Reassign a constant value
• Reassign a constant array
• Reassign a constant object

But you CAN:

• Change the elements of constant array
• Change the properties of constant object

COLOR PICKER

Contact Sales

If you want to use W3Schools services as an educational institution, team or enterprise, send us an e-mail: [email protected]

Report Error

If you want to report an error, or if you want to make a suggestion, send us an e-mail: [email protected]

Top Tutorials

Top references, top examples, get certified.

Typeerror assignment to constant variable

Doesn’t know how to solve the “Typeerror assignment to constant variable” error in Javascript?

Don’t worry because this article will help you to solve that problem

In this article, we will discuss the Typeerror assignment to constant variable , provide the possible causes of this error, and give solutions to resolve the error.

What is Typeerror assignment to constant variable?

“Typeerror assignment to constant variable” is an error message that can occur in JavaScript code.

It means that you have tried to modify the value of a variable that has been declared as a constant.

Attempting to modify a constant variable, you will receive an error stating:

In this example, we have declared a constant variable greeting and assigned it the value “Hello” .

When we try to reassign greeting to a different value (“Hi”) , we will get the error:

because we are trying to change the value of a constant variable.

How does Typeerror assignment to constant variable occurs ?

This “ TypeError: Assignment to constant variable ” error occurs when you attempt to modify a variable that has been declared as a constant.

In JavaScript, constants are variables whose values cannot be changed once they have been assigned.

If you try to modify the value of a constant variable, you will get the error:

Here is an example :

In this example, we declared a constant variable age and assigned it the value 30 .

If you declare an object using the const keyword, you can still modify the properties of the object.

If you try to reassign a constant object, you will get the error.

For example:

In this example, we declared a constant object person with two properties ( name and age ).

We are able to modify the age property of the object without triggering an error.

If you try to modify a constant variable in strict mode, you will get the error.

In this example, we declared a constant variable name and assigned it the value John .

However, because we are using strict mode, any attempt to modify the value of name will trigger the error.

Now let’s fix this error.

Typeerror assignment to constant variable – Solutions

Solution 1: declare the variable using the let or var keyword:.

Just like the example below:

Solution 2: Use an object or array instead of a constant variable:

If you need to modify the properties of a variable, you can use an object or array instead of a constant variable.

Solution 3: Declare the variable outside of strict mode:

If you are using strict mode and need to modify a variable, you can declare the variable outside of strict mode:

Solution 4: Use the const keyword and use a different name :

Solution 5: declare a const variable with the same name in a different scope :.

But with a different value, without modifying the original constant variable.

You can create a new constant variable with the same name, without modifying the original constant variable.

This can be useful when you need to use the same variable name in multiple scopes without causing conflicts or errors.

So those are the alternative solutions that you can use to fix the TypeError.

Here are the other fixed errors that you can visit, you might encounter them in the future.

In conclusion, in this article, we discussed   “Typeerror assignment to constant variable” , provided its causes and give solutions that resolve the error.

I hope this article helps you to solve your problem regarding a  Typeerror   stating  “assignment to constant variable” .

We’re happy to help you.

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

The const declaration declares block-scoped local variables. The value of a constant can't be changed through reassignment using the assignment operator , but if a constant is an object , its properties can be added, updated, or removed.

The name of the variable to declare. Each must be a legal JavaScript identifier or a destructuring binding pattern .

Initial value of the variable. It can be any legal expression.

Description

The const declaration is very similar to let :

• const declarations are scoped to blocks as well as functions.
• const declarations can only be accessed after the place of declaration is reached (see temporal dead zone ). For this reason, const declarations are commonly regarded as non-hoisted .
• const declarations do not create properties on globalThis when declared at the top level of a script.
• const declarations cannot be redeclared by any other declaration in the same scope.
• const begins declarations , not statements . That means you cannot use a lone const declaration as the body of a block (which makes sense, since there's no way to access the variable). js if (true) const a = 1; // SyntaxError: Lexical declaration cannot appear in a single-statement context

An initializer for a constant is required. You must specify its value in the same declaration. (This makes sense, given that it can't be changed later.)

The const declaration creates an immutable reference to a value. It does not mean the value it holds is immutable — just that the variable identifier cannot be reassigned. For instance, in the case where the content is an object, this means the object's contents (e.g., its properties) can be altered. You should understand const declarations as "create a variable whose identity remains constant", not "whose value remains constant" — or, "create immutable bindings ", not "immutable values".

Many style guides (including MDN's ) recommend using const over let whenever a variable is not reassigned in its scope. This makes the intent clear that a variable's type (or value, in the case of a primitive) can never change. Others may prefer let for non-primitives that are mutated.

The list that follows the const keyword is called a binding list and is separated by commas, where the commas are not comma operators and the = signs are not assignment operators . Initializers of later variables can refer to earlier variables in the list.

Basic const usage

Constants can be declared with uppercase or lowercase, but a common convention is to use all-uppercase letters, especially for primitives because they are truly immutable.

Block scoping

It's important to note the nature of block scoping.

const in objects and arrays

const also works on objects and arrays. Attempting to overwrite the object throws an error "Assignment to constant variable".

However, object keys are not protected, so the following statement is executed without problem.

You would need to use Object.freeze() to make an object immutable.

The same applies to arrays. Assigning a new array to the variable throws an error "Assignment to constant variable".

Still, it's possible to push items into the array and thus mutate it.

Declaration with destructuring

The left-hand side of each = can also be a binding pattern. This allows creating multiple variables at once.

For more information, see Destructuring assignment .

Specifications

Browser compatibility

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

• Constants in the JavaScript Guide

Java Tutorials

• Java Interview questions
• Java 8 Stream

Data structure and algorithm

• Data structure in java
• Data structure interview questions

Spring tutorials

• Spring tutorial
• Spring boot tutorial
• Spring MVC tutorial
• Spring interview questions
• keyboard_arrow_left Previous

[Fixed] TypeError: Assignment to constant variable in JavaScript

Table of Contents

Problem : TypeError: Assignment to constant variable

Rename the variable, change variable type to let or var, check if scope is correct, const and immutability.

TypeError: Assignment to constant variable in JavaScript occurs when we try to reassign value to const variable. If we have declared variable with const , it can’t be reassigned.

Let’s see with the help of simple example.

Solution : TypeError: Assignment to constant variable

If you are supposed to declare another constant, just declare another name.

If you are supposed to change the variable value, then it shouldn’t be declared as constant.

Change type to either let or var.

You can check if scope is correct as you can have different const in differnt scopes such as function.

This is valid declaration as scope for country1 is different.

const declaration creates read only reference. It means that you can not reassign it. It does not mean that you can not change values in the object.

Let’s see with help of simple example:

But, you can change the content of country object as below:

That’s all about how to fix TypeError: Assignment to constant variable in javascript.

Was this post helpful?

Related posts:.

• jQuery before() and insertBefore() example
• jQuery append and append to example
• Round to 2 decimal places in JavaScript
• Convert Seconds to Hours Minutes Seconds in Javascript
• [Solved] TypeError: toLowerCase is not a function in JavaScript
• TypeError: toUpperCase is not a function in JavaScript
• Remove First Character from String in JavaScript
• Get Filename from Path in JavaScript
• Write Array to CSV in JavaScript

Get String Between Two Characters in JavaScript

[Fixed] Syntaxerror: invalid shorthand property initializer in Javascript

Convert epoch time to Date in Javascript

Follow Author

Related Posts

Table of ContentsUsing substring() MethodUsing slice() MethodUsing split() MethodUsing substr() Method 💡TL;DR Use the substring() method to get String between two characters in JavaScript. [crayon-66ebff2a64d07601391266/] [crayon-66ebff2a64d0b318817463/] Here, we got String between , and ! in above example. Using substring() Method Use the substring() method to extract a substring that is between two specific characters from […]

Return Boolean from Function in JavaScript

Table of ContentsUsing the Boolean() FunctionUse the Boolean() Function with Truthy/Falsy ValuesUsing Comparison OperatorUse ==/=== Operator to Get Boolean Using Booleans as ObjectsUse ==/=== Operator to Compare Two Boolean Objects Using the Boolean() Function To get a Boolean from a function in JavaScript: Create a function which returns a Boolean value. Use the Boolean() function […]

Create Array from 1 to 100 in JavaScript

Table of ContentsUse for LoopUse Array.from() with Array.keys()Use Array.from() with Array ConstructorUse Array.from() with length PropertyUse Array.from() with fill() MethodUse ... Operator Use for Loop To create the array from 1 to 100 in JavaScript: Use a for loop that will iterate over a variable whose value starts from 1 and ends at 100 while […]

Get Index of Max Value in Array in JavaScript

Table of ContentsUsing indexOf() with Math.max() MethodUsing for loopUsing reduce() FunctionUsing _.indexOf() with _.max() MethodUsing sort() with indexOf() Method Using indexOf() with Math.max() Method To get an index of the max value in a JavaScript array: Use the Math.max() function to find the maximum number from the given numbers. Here, we passed an array and […]

Update Key with New Value in JavaScript

Table of ContentsUsing Bracket NotationUpdate Single Key with New ValueUpdate Multiple Keys with New ValuesUsing Dot NotationUpdate Single Key with New ValueUpdate Multiple Keys with New ValuesUsing forEach() MethodUpdate All Keys with New ValuesUsing map() MethodUpdate All Keys with New Values Using Bracket Notation We can use bracket notation to update the key with the […]

Format Phone Number in JavaScript

Table of ContentsUsing match() MethodFormat Without Country CodeFormat with Country Code Using match() Method We use the match() method to format a phone number in JavaScript. Format Without Country Code To format the phone number without country code: Use the replace() method with a regular expression /\D/g to remove non-numeric elements from the phone number. […]

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.

Let’s be Friends

© 2020-22 Java2Blog Privacy Policy

React - assignment to constant variable using useState()

I am trying to increment slideIndex  (which is inside useState() hook) on click event but React throws the following error in the console:

I've tried to change useState() from  const to let in my code and it works but I don't think it should be like that:

The problem is that you are trying to increment slideIndex using ++ operator ( ++slideIndex ).

Change  ++slideIndex  to the slideIndex + 1 and it should work.

Your code should look like this:

Native Advertising

Dirask - we help you to, solve coding problems., ask question..

• Stack Overflow for Teams Where developers & technologists share private knowledge with coworkers
• Advertising & Talent Reach devs & technologists worldwide about your product, service or employer brand
• OverflowAI GenAI features for Teams
• OverflowAPI Train & fine-tune LLMs
• Labs The future of collective knowledge sharing
• About the company Visit the blog

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.

Ionic React Uncaught TypeError: Assignment to constant variable

This code to calculate a price used to work in class components before react JS was updated. Now im using useState instead of this.state and im having trouble getting my old code working. Im mainly having a hard time setting the state values and using them in the check price function.

Im also getting an error :

Uncaught TypeError: Assignment to constant variable....... basePrice += basePrice * (percentage / 100)

If anyone could point me in the right direction it would be very much appreciated! THANK YOU!!

• ionic-framework
• react-hooks

• 1 Don't directly mutate your state, I am guessing you declared your basePrice like const [basePrice, setBasePrice] , and you are doing basePrice += basePrice * (percentage / 100); . You are trying to assign a value to a const –  junwen-k Commented Nov 26, 2019 at 16:38
• Correct thats exactly what I did. So should I create another state like newBasePrice and make it setNewBasePrice(basePrice * (percentage / 100)) –  Jordan Spackman Commented Nov 26, 2019 at 16:45
• Why would you need that as a state ? Also I would suggest you to create a map of packageSelected to price instead. Your code looks repetitive and very uncomfortable to read. –  junwen-k Commented Nov 26, 2019 at 16: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 reactjs ionic-framework calculator react-hooks or ask your own question .

• The Overflow Blog
• Looking under the hood at the tech stack that powers multimodal AI
• Featured on Meta
• User activation: Learnings and opportunities
• Preventing unauthorized automated access to the network
• What does a new user need in a homepage experience on Stack Overflow?
• Announcing the new Staging Ground Reviewer Stats Widget

Hot Network Questions

• Why did mire/bog skis fall out of use?
• Big bang and the horizon problem
• If morality is real and has causal power, could science detect the moment the "moral ontology" causes a measurable effect on the physical world?
• My one-liner 'delete old files' command finds the right files but will not delete them
• Is it ok if I was wearing lip balm and my bow touched my lips by accident and then that part of the bow touched the wood on my viola?
• Play the Final Fantasy Prelude
• When is due diligence enough when attempting to contact a copyright holder?
• What is the meaning of a sentence from Agatha Christie (*Murder of Roger Ackroyd*)?
• What's "jam" mean in "The room reeled and he jammed his head down" (as well as the sentence itself)?
• Why is the #16 always left open?
• Frequent Statistics updates in SQL Server 2022 Enterprise Edition
• Does "Speak with animals" allow you to improve the attitude of an animal like "wild empathy"?
• Trinitarian Christianity says Jesus was fully God and Fully man. Did Jesus (the man) know this to be the case?
• Model looks dented but geometry is correct
• Was the total glaciation of the world, a.k.a. snowball earth, due to Bok space clouds?
• "First et al.", many authors with same surname, and IEEE citations
• Why are no metals green or blue?
• Why did early pulps make use of “house names” where multiple authors wrote under the same pseudonym?
• How to do smooth merging of two points using tikzpicture
• How to translate the letter Q to Japanese?
• What is a “bearded” oyster?
• Why does constexpr prevent auto type deduction in this statement?
• SF story set in an isolated (intergalactic) star system
• corresponding author not as the last author in physics or engineering