- Assignment to property of function parameter no-param-reassign
Last updated: Mar 7, 2024 Reading time · 3 min
# Table of Contents
- Disabling the no-param-reassign ESLint rule for a single line
- Disabling the no-param-reassign ESLint rule for an entire file
- Disabling the no-param-reassign ESLint rule globally
# Assignment to property of function parameter no-param-reassign
The ESLint error "Assignment to property of function parameter 'X' eslint no-param-reassign" occurs when you try to assign a property to a function parameter.
To solve the error, disable the ESLint rule or create a new object based on the parameter to which you can assign properties.
Here is an example of how the error occurs.
The ESLint rule forbids assignment to function parameters because modifying a function's parameters also mutates the arguments object and can lead to confusing behavior.
One way to resolve the issue is to create a new object to which you can assign properties.
We used the spread syntax (...) to unpack the properties of the function parameter into a new object to which we can assign properties.
If you need to unpack an array, use the following syntax instead.
The same approach can be used if you simply need to assign the function parameter to a variable so you can mutate it.
We declared the bar variable using the let keyword and set it to the value of the foo parameter.
We are then able to reassign the bar variable without any issues.
# Disabling the no-param-reassign ESLint rule for a single line
You can use a comment if you want to disable the no-param-reassign ESLint rule for a single line.
Make sure to add the comment directly above the assignment that causes the error.
# Disabling the no-param-reassign ESLint rule for an entire file
You can also use a comment to disable the no-param-reassign ESLint rule for an entire file.
Make sure to add the comment at the top of the file or at least above the function in which you reassign parameters.
The same approach can be used to disable the rule only for a single function.
The first comment disables the no-param-reassign rule and the second comment enables it.
If you try to reassign a parameter after the second comment, you will get an ESLint error.
# Disabling the no-param-reassign ESLint rule globally
If you need to disable the no-param-reassign rule globally, you have to edit your .eslintrc.js file.
If you only want to be able to assign properties to an object parameter, set props to false instead of disabling the rule completely.
The following code is valid after making the change.
If you use a .eslintrc or .eslintrc.json file, make sure to double-quote the properties and values.
If you want to only allow assignment to object parameters, use the following line instead.
Make sure all properties are double-quoted and there are no trailing commas if your config is written in JSON.
# Additional Resources
You can learn more about the related topics by checking out the following tutorials:
- eslint is not recognized as an internal or external command
- Plugin "react" was conflicted between package.json » eslint-config-react-app
- React: Unexpected use of 'X' no-restricted-globals in ESLint
- TypeScript ESLint: Unsafe assignment of an any value [Fix]
- ESLint error Unary operator '++' used no-plusplus [Solved]
- ESLint Prefer default export import/prefer-default-export
- Arrow function should not return assignment. eslint no-return-assign
- TypeError: Cannot redefine property: X in JavaScript [Fixed]
- ESLint: disable multiple rules or a rule for multiple lines
- Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style
- Missing return type on function TypeScript ESLint error
Borislav Hadzhiev
Web Developer
Copyright © 2024 Borislav Hadzhiev
no-param-reassign
Disallow reassigning function parameters
Assignment to variables declared as function parameters can be misleading and lead to confusing behavior, as modifying function parameters will also mutate the arguments object when not in strict mode (see When Not To Use It below). Often, assignment to function parameters is unintended and indicative of a mistake or programmer error.
This rule can be also configured to fail when function parameters are modified. Side effects on parameters can cause counter-intuitive execution flow and make errors difficult to track down.
Rule Details
This rule aims to prevent unintended behavior caused by modification or reassignment of function parameters.
Examples of incorrect code for this rule:
Examples of correct code for this rule:
This rule takes one option, an object, with a boolean property "props" , and arrays "ignorePropertyModificationsFor" and "ignorePropertyModificationsForRegex" . "props" is false by default. If "props" is set to true , this rule warns against the modification of parameter properties unless they’re included in "ignorePropertyModificationsFor" or "ignorePropertyModificationsForRegex" , which is an empty array by default.
Examples of correct code for the default { "props": false } option:
Examples of incorrect code for the { "props": true } option:
Examples of correct code for the { "props": true } option with "ignorePropertyModificationsFor" set:
Examples of correct code for the { "props": true } option with "ignorePropertyModificationsForRegex" set:
When Not To Use It
If you want to allow assignment to function parameters, then you can safely disable this rule.
Strict mode code doesn’t sync indices of the arguments object with each parameter binding. Therefore, this rule is not necessary to protect against arguments object mutation in ESM modules or other strict mode functions.
This rule was introduced in ESLint v0.18.0.
Further Reading
- Rule source
- Tests source
- Skip to main content
- Skip to search
- Skip to select language
- Sign up for free
- Remember language
- Português (do Brasil)
Default parameters
Baseline widely available.
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015 .
- See full compatibility
- Report feedback
Default function parameters allow named parameters to be initialized with default values if no value or undefined is passed.
Description
In JavaScript, function parameters default to undefined . However, it's often useful to set a different default value. This is where default parameters can help.
In the following example, if no value is provided for b when multiply is called, b 's value would be undefined when evaluating a * b and multiply would return NaN .
In the past, the general strategy for setting defaults was to test parameter values in the function body and assign a value if they are undefined . In the following example, b is set to 1 if multiply is called with only one argument:
With default parameters, checks in the function body are no longer necessary. Now, you can assign 1 as the default value for b in the function head:
Parameters are still set left-to-right, overwriting default parameters even if there are later parameters without defaults.
Note: The first default parameter and all parameters after it will not contribute to the function's length .
The default parameter initializers live in their own scope, which is a parent of the scope created for the function body.
This means that earlier parameters can be referred to in the initializers of later parameters. However, functions and variables declared in the function body cannot be referred to from default value parameter initializers; attempting to do so throws a run-time ReferenceError . This also includes var -declared variables in the function body.
For example, the following function will throw a ReferenceError when invoked, because the default parameter value does not have access to the child scope of the function body:
This function will print the value of the parameter a , because the variable var a is hoisted only to the top of the scope created for the function body, not the parent scope created for the parameter list, so its value is not visible to b .
The default parameter allows any expression, but you cannot use await or yield that would pause the evaluation of the default expression. The parameter must be initialized synchronously .
Note: Because the default parameter is evaluated when the function is called, not when the function is defined, the validity of the await and yield operators depends on the function itself, not its surrounding function. For example, if the current function is not async , await will be parsed as an identifier and follow normal identifier syntax rules , even when this function is nested in an async function.
Passing undefined vs. other falsy values
In the second call in this example, even if the first argument is set explicitly to undefined (though not null or other falsy values), the value of the num argument is still the default.
Evaluated at call time
The default argument is evaluated at call time . Unlike with Python (for example), a new object is created each time the function is called.
This even applies to functions and variables:
Earlier parameters are available to later default parameters
Parameters defined earlier (to the left) are available to later default parameters:
This functionality can be approximated like this, which demonstrates how many edge cases are handled:
Destructured parameter with default value assignment
You can use default value assignment with the destructuring assignment syntax.
A common way of doing that is to set an empty object/array as the default value for the destructured parameter; for example: [x = 1, y = 2] = [] . This makes it possible to pass nothing to the function and still have those values prefilled:
Specifications
Browser compatibility.
BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.
- Functions guide
- Rest parameters
- Nullish coalescing operator ( ?? )
How TO - Set Default Parameters
Learn how to set default parameter values for JavaScript functions.
Default Parameters
If a function in JavaScript is called with missing arguments (less than declared), the missing values are set to undefined .
Sometimes this is acceptable, but sometimes it is better to assign a default value to the parameter:
Read more about functions in our JavaScript Function Tutorial .
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.
IMAGES
VIDEO
COMMENTS
This behavior is prohibited by the rule. To resolve it, copy the argument to a temporary variable and work on it instead: const result = {...res}; // if result is object. // const result = [...res]; // if result is array. // Rest of your code can work without change.
Assignment to property of function parameter is a JavaScript feature that allows you to assign a value to a property of a function parameter. This can be useful for initializing the value of a parameter or for passing a reference to an object.
The ESLint error "Assignment to property of function parameter 'X' eslint no-param-reassign" occurs when you try to assign a property to a function parameter. To solve the error, disable the ESLint rule or create a new object based on the parameter to which you can assign properties.
Often, assignment to function parameters is unintended and indicative of a mistake or programmer error. This rule can be also configured to fail when function parameters are modified. Side effects on parameters can cause counter-intuitive execution flow and make errors difficult to track down.
Function Parameters and Arguments. Earlier in this tutorial, you learned that functions can have parameters: function functionName(parameter1, parameter2, parameter3) {. // code to be executed. } Function parameters are the names listed in the function definition.
The destructuring assignment syntax is a JavaScript expression that makes it possible to unpack values from arrays, or properties from objects, into distinct variables.
There's no need to reassign the pos property of the function arguments (a, b). You should just assign a new variable (aPos, bPos), which is a best practice, hence why ESLint is complaining.
Default function parameters allow named parameters to be initialized with default values if no value or undefined is passed.
Reassigning arguments is considered harmful so there's and ESlint rule for that. But mutating object properties is fine in some cases, especially in the DOM context, so here your code is perfectly fine. I would recommend modifying the ESlint rule as such : "no-param-reassign": ["error", { "props": false }]
Learn how to set default parameter values for JavaScript functions. Default Parameters. If a function in JavaScript is called with missing arguments (less than declared), the missing values are set to undefined. Sometimes this is acceptable, but sometimes it is better to assign a default value to the parameter: Example. function myFunction (x, y) {