Assignment to constant variable ошибка

5


0

TypeError: Assignment to constant variable.

  at finalGrade (finalGrade.js:4:16)
  at Object.<anonymous>.test (__tests__/finalGrade.test.js:4:35)
  at Promise.resolve.then.el (../../local/share/.config/yarn/global/node_modules/p-map/index.js:42:16)

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.

First, let us know what this error means.

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

In JavaScript, when you declare a variable using the const keyword, its value cannot be changed or reassigned.

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

TypeError: Assignment to constant variable.

Here is an example code snippet that triggers the error:

const greeting = "Hello";
greeting = "Hi"; // This will trigger a Typeerror assignment to constant variable error

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:

TypeError: Assignment to constant variable.

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

Let us explore more about how this error occurs.

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.

When you declare a variable using the const keyword, you are telling JavaScript that the value of the variable will remain constant throughout the program.

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

TypeError: Assignment to constant variable.

This error can occur in various situations, such as:

• Attempting to reassign a constant variable:

When you declare a variable using the const keyword, its value cannot be changed.

If you try to reassign the value of a constant variable, you will get this error.

Here is an example:

const age = 30;
age = 35; // This will trigger a Typeerror assignment to constant variable error

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

When we try to reassign age to a different value (35), we will get the error:

TypeError: Assignment to constant variable.

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

• Attempting to modify a constant object:

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

However, you cannot reassign the entire object to a new value.

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

For example:

const person = {
  name: "John",
  age: 23
};
person.age = 24; // This will not trigger an error

person = {
  name: "gladyz",
  age: 24
}; // This will trigger a Typeerror assignment to constant variable error

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.

However, when we try to reassign person to a new object, we will get the Typeerror.

• Using strict mode:

In strict mode, JavaScript throws more errors to help you write better code.

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

Example:

"use strict";
const name = "John";
name = "Jane"; // This will trigger a Typeerror assignment to constant variable 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

Here are the alternative solutions that you can use to fix “Typeerror assignment to constant variable”:

Solution 1: Declare the variable using the let or var keyword:

If you need to modify the value of a variable, you should declare it using the let or var keyword instead of const.

Just like the example below:

const age = 23;
let newAge = age + 1; // This will not trigger an error

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.

For example:

const person = {
  name: "John",
  age: 30
};
person.age = 35; // This will not trigger an error

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:

"use strict";
let name = "John";
name = "Jane"; // This will not trigger an error

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

This allows you to keep the original constant variable intact and create a new variable with a different value.

For example:

const name = 'John';
const newName = name + ' Paul';

console.log(newName); // Output: john Paul

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

This allows you to create a new constant variable with the same name as the original constant variable.

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

For Example:

const name = 'John';

function updateName() {
  const name = 'Paul';
  console.log(name); // Output: Paul
}

updateName(); // Call the function
console.log(name); // Output: John

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

By declaring a constant variable with the same name in a different scope.

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.

By following those solutions, you can fix the “Typeerror assignment to constant variable” error in your JavaScript code.

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

• typeerror unsupported operand type s for str and int
• typeerror: object of type int64 is not json serializable
• typeerror: bad operand type for unary -: str

Conclusion

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

By following the given solution, surely you can fix the error quickly and proceed to your coding project again.

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

We’re happy to help you.

Happy coding! Have a Good day and God bless.

Время на прочтение
6 мин

Количество просмотров 29K

^{Источник картинки}

Работающий код может иметь изъяны — например, быть недостаточно простым, лаконичным и понятным. Это может быть признаком более глубоких проблем в коде, а избавиться от них можно с помощью рефакторинга. В этой статье разберем наиболее популярные недостатки кода. Материал адаптирован на русский язык вместе с Глебом Михеевым, директором по технологиям Skillbox и спикером профессии «Frontend-разработчик PRO» и преподавателем курса Frontend-разработки в Skillbox Борзуновым Игорем.

Непонятный выбор имени

Код должен оставаться читаемым и удобным для всей команды. Для этого компании нужны единые принципы выбора имен переменных, методов, классов, констант и других единиц кода. Единая стратегия пригодится, когда команда начнет расти и сотрудникам придется говорить на одном языке. Если стратегии еще нет, то ее надо создать.

Общие принципы выбора имени:

• Стратегия выбора последовательна.

• Из имени понятно назначение переменной.

• Имена легко различимы между собой.

• Имя переменной можно произнести вслух.

• Переменная должна легко искаться, а значит, в имени лучше не использовать популярные слова или буквы.

const a = 'Frontend course';

const b = 1;

const c = '100$'

Как вы можете наблюдать, подобный нейминг приводит простой код в непонятный набор символов, который работает неочевидно. Заменив нейминг, можно легко превратить данный код в самодокументирующуюся конструкцию

const courseName = 'Frontend course';

const courseId = 1;

const coursePrice = '100$'

Длинный метод

Метод, функция или процедура, которые занимают слишком много строк, — это источник ошибок. Понять работу такого кода становится сложно. Мы рекомендуем придерживаться принципа, по которому метод выполняет только одну задачу и выполняет ее хорошо.

async function makeAnOrder() {

  const form = document.querySelector<HTMLFormElement>('form#basket');

  const basket = new FormData(form);

  if (!basket.get('name')) {

      throw new Error('Вы не указали имя');

  }

  if (!basket.get('address')) {

      throw new Error('Вы не указали адрес доставки');

  }

  const user = await fetch('/api/user').then(results => results.json())

  basket.set('user_id', user.id);

  basket.set('discount', user.discount);

  fetch('/api/order', { method: 'POST', body: basket })

      .then(results => results.json())

      .then(() => {

          alert('Заказ удачно отправлен')

      })

}

Подобный код сочетает в себе смешанную логику всего действия. Если представить, что параметров в классе будет еще больше, с течение времени, такой код станет неподдерживаемым. 

Если воспользоваться принципом разделения ответственности, такой код станет читабельнее и разделит ответственность так, как это заложено логически.

async function makeAnOrder() {

  const basket = getBasket();

  vaildateBasket(basket);

  await applyDiscount(basket);

  createOrder(basket).then(() => {

    alert('Заказ удачно отправлен')

  })

}

function getBasket() {

  const form = document.querySelector('form#basket');

  return new FormData(form);

}

function vaildateBasket(basket) {

  if (!basket.get('name')) {

    throw new Error('Вы не указали имя');

  }

  if (!basket.get('address')) {

    throw new Error('Вы не указали адрес доставки');

  }

}

function createOrder(basket) {

  fetch('/api/order', { method: 'POST', body: basket })

    .then(results => results.json())

}

async function applyDiscount() {

  const user = await fetch('/api/user').then(results => results.json())

  basket.set('user_id', user.id);

  basket.set('discount', user.discount);

}

Объект бога

Объект кода, который хранит в себе слишком много составляющих программы и отвечает за слишком большое количество задач. Объект бога сложно поддерживать, при этом от него зависит работа всей программы.

Вместо лаконичных трех строчек выходит огромная функция с большой когнитивной сложностью. Ее прочтение занимает много времени, а корректировка грозит непредсказуемыми поломками. Все это усложняет поддержку кода. В результате его дороже обслуживать, как морально, так и с точки зрения прямой стоимости.

Вот почему важно не оставлять такой код как есть, а после разработки функционала проводить рефакторинг. Упрощать код логически, разнося на маленькие простые блоки, которые легко читать, изменять и тестировать».

Ситуация, при которой идентичный или очень похожий код повторяется в программе. Из-за существования дубликатов разработчикам становится сложнее вносить изменения, поскольку они вынуждены искать все повторы. Помимо этого, существование клонов снижает скорость работы программы и усложняет ее понимание.

Избавиться от дубликатов можно с помощью создания вспомогательного метода или класса, а также с помощью выражения одного клона через другой. Наличие дубликатов в исходном коде может указывать на более глубокие проблемы, например, неудачный выбор архитектуры.

let button = document.getElementById("button");

let anotherButton = document.getElementById("anotherButton");

button.onclick = function() {

    modal.style.display = "block";

    modal.style.height = "100%";

    modal.style.width = "50%";

    modal.style.position = "fixed";

}

anotherButton.onclick = function() {

    modal.style.display = "block";

    modal.style.height = "100%";

    modal.style.width = "50%";

    modal.style.position = "fixed";

}

Для того, чтобы избегать подобных казусов, следует пользоваться обобщенными конструкциями:

function showModal() {

  modal.style.display = "block";

  modal.style.display = "block";

  modal.style.height = "100%";

  modal.style.width = "50%";

  modal.style.position = "fixed";

}

button.onclick = showModal

anotherButton.onclick = showModal

Слишком много параметров

Большое число аргументов функции затрудняет чтение и тестирование кода. Разработчик Роберт Мартин в книге «Чистый код. Создание анализ и рефакторинг» назвал ноль идеальным числом параметров:

Глеб Михеев: «В идеальном случае количество аргументов функции равно нулю. Далее следуют функции с одним аргументом и с двумя аргументами. Функций с тремя аргументами следует по возможности избегать. Необходимость функций с большим количеством аргументов должна быть подкреплена очень вескими доводами».

Надуманная сложность

Код, в который ввели сложные шаблоны проектирования, в то время как с поставленной задачей справится и более простое решение. Такой код создают, стремясь упростить существующие решения, но достигают обратных результатов: код становится сложным и нечитаемым.

Введение сложных шаблонов проектирования не говорит о высоком уровне разработчика. Наоборот, это указывает на его незрелость: неумение упрощать и оценивать задачу целиком.

Стрельба дробью

Ситуация, когда для выполнения, казалось бы, простых задач вносят большое количество изменений в код. При этом сами изменения идентичны или очень похожи между собой. Это похоже на стрельбу по цели из дробовика вместо одного точного выстрела — отсюда и название. 

При рефакторинге повторяющийся код нужно свести к одному участку. Возможно, придется изменить саму архитектуру кода, которая привела к появлению таких решений. При написании программы разработчикам нужно иметь в виду, что код будет дорабатываться, а быстрое решение проблемы впоследствии может привести к «стрельбе дробью».

Мутации переменной

Это специфическая проблема JavaScript, которая указывает на изменения переменной. Но мутация отличается от изменения тем, что происходит непредсказуемо. Из-за изменения одной переменной в другом месте меняется и другая, связанная с ней.

Если воспользоваться ключевым словом let, то значение переменной действительно можно переопределить 

let age = 25;

age = "Двадцать пять";

В случае с const, будет выведена ошибка, так как ключевое слово const неизменно в данном примере 

const age = 25;

age = 'Ягодка опять';

> Uncaught TypeError: Assignment to constant variable.