Рефакторинг. Улучшение проекта существующего кода

Второе издание книги Мартина Фаулера объясняет, что такое рефакторинг на самом деле, впрочем, как и первое издание, выпущенное 20 лет назад. После прочтения книги вы найдете ответы на следующие вопросы:

1. Зачем мне рефакторинг моего кода?
2. Как я могу распознать код, который нуждается в рефакторинге?
3. Как я могу успешно провести рефакторинг своего кода?

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

Добро пожаловать в бар CodeWars

Бар CodeWars советует вам пить 1 стакан воды после того, как вы выпьете 1 алкогольный напиток. Ваши знакомые кодеры купили вам несколько напитков в виде строки. Верните им строку, которая укажет, сколько нужно выпить стаканов воды, чтобы не быть с похмелья.

Примеры
"1 beer" --> "1 glass of water"
"1 shot, 5 beers, 2 shots, 1 glass of wine, 1 beer" --> "10 glasses of water"

Паттерны проектирования

Эта книга, у которой сразу 4 автора, учит вас шаблонам проектирования и лучшим практикам, используемым другими разработчиками для создания функционального, повторно используемого, и гибкого ПО. В издании много наглядных представлений, которые помогут вам легче освоить новые концепции.

Если вы хотите узнать о таких вещах, как фабрики, синглтоны, внедрение зависимостей и т.д., эта книга — отличный выбор. Примеры написаны на Java, поэтому было бы неплохо знать этот, либо любой другой объектно-ориентированный язык.

Eсть ли разница между window и document?

Да. У JavaScript есть глобальный объект и всё происходит через него.
Window – тот самый объект, который хранит глобальные переменные, функции, местоположение, историю. Всё находится внутри него, setTimeout, XMLHttpRequest, console и localStorage также являются частью window.

Аналогично дело обстоит и с document, который является свойством объекта window и представляет DOM.
Все ноды – это часть document, следовательно, вы можете использовать getElementById или addEventListener для document. Но обратите внимание, что этих методов нет в объекте window.

В чём опасность использования for .. in для объекта или массива?

For..in итерируется по всем полям объекта и его прототипов (т.е. проходит по всей цепочке прототипов).

В приведённом в вопросе коде проблем как таковых нет, но они могут появиться при использовании библиотек/полифиллов, которые переопределяют или создают новые свойства для прототипов стандартных конструкторов (таких как Array или Object).
var arr = [3, 4, 5];
Array.prototype.each = function() {
/*some fancy polyfill*/
};

for (var i in arr) {
console.log(i);
}

Выведет

 0 
 1 
 2 
 each 

Чтобы избежать таких проблем, можно воспользоваться методом Object.prototype.hasOwnProperty.
Модифицированный пример, который работает корректно:

var arr = [3, 4, 5];
Array.prototype.each = function() {
/*some fancy polyfill*/
};

for (var i in arr) {
if (arr.hasOwnProperty(i)){
console.log(i);
}
}

Настойчивый баггер

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

Примеры:

persistence(39) === 3 // так как 3*9 = 27, 2*7 = 14, 1*4=4
// и число 4 состоит из 1 символа

persistence(999) === 4 // так как 9*9*9 = 729, 7*2*9 = 126,
// 1*2*6 = 12, и наконец 1*2 = 2

persistence(4) === 0 // так как 4 уже состоит из одного символа

​Как добавлять элементы на HTML страницу динамически?

Создание новых элементов осуществляется с помощью document.createElement(tagName);

После создания элемента его нужно присоединить к родительскому элементу с помощью .appendChild(node);

Пример:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Title</title>
<script type="text/javascript">
function addNode() {
var newP = document.createElement("p");
var textNode = document.createTextNode(" I'm a new text node");
newP.appendChild(textNode);
document.getElementById("target").appendChild(newP);
}
</script>
</head>
<body onload="addNode();">
<p id="target">sart here<p>
</body>
</html>

В чем разница между Object.getOwnPropertyNames() и Object.keys()

Object.getOwnPropertyNames() возвращает перечислимые и не перечислимые свойства из объекта или массива.

 var arr = ["a", "b", "c"]; 
 print(Object.getOwnPropertyNames(arr).sort()); // prints "0,1,2,length" 

 // Array-like object 
 var obj = { 0: "a", 1: "b", 2: "c"}; 
 print(Object.getOwnPropertyNames(obj).sort()); // prints "0,1,2" 

Object.keys() возвращает перечислимые свойства из объекта или массива.

var arr = ["a", "b", "c"];
alert(Object.keys(arr)); // will alert "0,1,2"

// array like object
var obj = { 0 : "a", 1 : "b", 2 : "c"};
alert(Object.keys(obj)); // will alert "0,1,2"

С помощью какой конструкции языка можно управлять потоком выполнения скрипта и отслеживать ошибки?

Это возможно с помощью конструкции try{}... catch{}
Пример:
try {
var number = 9;
alert( number.toString(2) );
// ...
alert('Выполнено без ошибок!');
} catch(e) {
alert('Ошибка!');
}

Шаблоны корпоративных приложений

Книга Мартина Фаулера, посвященная разработке корпоративных приложений. После краткого руководства Мартин предлагает вам более 40 шаблонов в качестве решения распространенных проблем при разработке корпоративных приложений. В книге вы найдете большое количество UML визуализаций и примеров кода, написанных на Java или C#.

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