63 lines
4.5 KiB
Markdown
63 lines
4.5 KiB
Markdown
#рефакторинг #методы_рефакторинга
|
||
|
||
![[Pasted image 20241114081213.png]]
|
||
|
||
|
||
### **Проблема**
|
||
У вас есть фрагмент кода, который можно сгруппировать
|
||
```typescript
|
||
printOwing(): void {
|
||
printBanner();
|
||
|
||
// Print details.
|
||
console.log("name: " + name);
|
||
console.log("amount: " + getOutstanding());
|
||
}
|
||
```
|
||
|
||
### **Решение**
|
||
Выделите участок кода в новый метод (или функцию) и вызовите этот метод вместо старого кода
|
||
```typescript
|
||
printOwing(): void {
|
||
printBanner();
|
||
printDetails(getOutstanding());
|
||
}
|
||
|
||
printDetails(outstanding: number): void {
|
||
console.log("name: " + name);
|
||
console.log("amount: " + outstanding);
|
||
}
|
||
```
|
||
|
||
### **Причины рефакторинга**
|
||
Чем больше строк кода в методе, тем сложнее разобраться в том, что он делает. Это основная проблема, которую решает этот рефакторинг.
|
||
|
||
Извлечение метода не только убивает множество запашков в коде, но и является одним из этапов множества других рефакторингов.
|
||
|
||
### **Достоинства**
|
||
- Улучшает читабельность кода. Постарайтесь дать новому методу название, которое бы отражало суть того, что он делает. Например, `createOrder()`, `renderCustomerInfo()` и т. д.
|
||
- Убирает дублирование кода. Иногда код, вынесенный в метод, можно найти и в других местах программы. В таком случае, имеет смысл заменить найденные участки кода вызовом вашего нового метода.
|
||
- Изолирует независимые части кода, уменьшая вероятность ошибок (например, по вине переопределения не той переменной).
|
||
|
||
### **Порядок рефакторинга**
|
||
1. Создайте новую функцию и дайте ей имя, соответствующее ее предназначе нию (тому, что она делает, а не как).
|
||
2. Скопируйте беспокоящий вас фрагмент кода в новый метод. Удалите этот фрагмент из старого места и замените вызовом вашего нового метода. Найдите все переменные, которые использовались в этом фрагменте кода. Если они были объявлены внутри этого фрагмента и не используются вне его, просто оставьте их без изменений — они станут локальными переменными нового метода.
|
||
3. Если переменные объявлены перед интересующим вас участком кода, значит, их следует передать в параметры вашего нового метода, чтобы использовать значения, которые в них находились ранее.
|
||
4. Если вы видите, что локальная переменная как-то изменяется в вашем участке кода, это может означать, что её изменённое значение понадобится дальше в основном методе. Проверьте это. Если подозрение подтвердилось, значение этой переменной следует возвратить в основной метод, чтобы ничего не сломать.
|
||
|
||
### **Борется с запахом**
|
||
- [[Дублируемый код]]
|
||
- [[Длинная функция]]
|
||
- [[Завистливые функции]]
|
||
- [[Повторяющиеся switch]]
|
||
- [[Цепочки сообщений]]
|
||
- [[Комментарии]]
|
||
- [[Классы данных]]
|
||
|
||
### **Обратный рефакторинг**
|
||
- [[Встраивание функции (Inline Function)]]
|
||
|
||
|
||
### **Ссылки**
|
||
- https://refactoring.guru/ru/extract-method
|
||
- [[Мартин Фаулер - Рефакторинг кода на JavaScript]] |