Можно ли сделать работу кода более оптимизированнее?

Question

[Адам Сулумов]

Здравствуйте.
В общем сделал вот такой вот код, который преобразовывает ссылку на видео youtube, vimeo и coub в плеер от этих видео хостингов (если последний можно так назвать).

Сам я изучаю js всего 2 недели, поэтому не знаю методов исполнить ниже изложенное более качественнее.

var $v1 = 'ССЫЛКА НА РОЛИК',
     $v2;

// Для youtube
if($v1.indexOf('youtube.com') + 1 || $v1.indexOf('youtu.be') + 1) {
	// Ищем и заменяем, чтобы проще обработать
	$v2 = $v1.replace('.com/embed/', '.com/watch?v=');
	$v1 = $v2.replace('.be/', '.com/watch?v=');
	//Отсеиваем ненужные части, чтобы получить чистый id
	$v2 = $v1.split(".com/watch?v=")[1];
	$v1 = $v2.split("&index")[0];
	$v2 = $v1.replace('&', '?');
	//Получаем чистый id, вставляем его непосредственно в плеер
	document.write('<iframe width="685" height="386" src="https://www.youtube.com/embed/' + $v2 + '" frameborder="0" allowfullscreen></iframe>');
} 
// Для Coub
else if ($v1.indexOf('http://coub.com/') + 1) {
	// Производим замену
	$v2 = $v1.replace('/view/', '/embed/');
	// Вставляем id в плеер
	document.write('<iframe src="' + $v2 + '?muted=false&amp;autostart=false&originalSize=false&hideTopBar=false&noSiteButtons=false&startWithHD=false" allowfullscreen="true" frameborder="0" width="685" height="386"></iframe>');
} 
// Для vimeo
else if ($v1.indexOf('vimeo.com') + 1) {
	// Производим замену
	$v2 = $v1.replace('vimeo.com/', 'player.vimeo.com/video/');
	// Вставляем id в плеер
	document.write('<iframe src="' + $v2 +'" width="685" height="386" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>');
} 
	//В случае, если не удалось обработать
else {document.write('<div style="color:red">Ошибка: не могу воспроизвести.</div>');}

Как вы видите, используется всего 2 переменной. В основном скрипт ищет и заменяет, отсеивает ненужные символы, и получает чистый id который встраивает в плеер. Для youtube было сделано столько действий, чтобы скрипт поддерживал абсолютно все типы ссылок на видео: с таймкодом, из плейлиста и т.д.

Сам код с работой справляется.

Сделайте замечания, укажите мне на мои ошибки.
Подскажите, как сделать то же, только качественнее.

Answer 1

[Константин Китманов]

Не экономьте на переменных, это не ассемблер. Вообще самое стремное — это вот эти куски типа

v1 = v2.something();
v2 = v1.somethingElse();

Отлаживать это кошмар, модифицировать — как ходить по минному полю.

document.write не очень хорошо, т.к. блокирует страницу, да и деструктивно очень уж. Вообще эти места не очень опрятное, так и хочется создать функцию, которая принимает URL, создает iframe и вставляет его в положенное место.

Вместо кучи split и replace можно регулярками, особенно в случае с ютубом.

Не используйте $ для переменных, это не PHP (в крайнем случае можно, только если в такой переменной лежит jQuery-объект)

Comments

[Dark Hole]

$-переменные используют как переменные браузера, могут быть проблемы