Багаторядковість в JavaScript
До
var str = '' +
'<!doctype html>' +
'<html>' +
' <body>' +
' <h1>❤ unicorns</h1>' +
' </body>' +
'</html>' +
'';
Після
var str = multiline(function(){/*
<!doctype html>
<html>
<body>
<h1>❤ unicorns</h1>
</body>
</html>
*/});
ЯК
Це працює за допомогою обертання тексту в блоці коментаря, анонімної функції і виклику функції. Анонімна функція передається у виклику функції і зміст коментаря вилучається.
Не дивлячись на те, що це працює повільніше ніж рядковий Concat, зручність завжди важливіша мікро-продуктивності.
Інсталювання
Використання
Все, від першого рядка до останнього, буде повернене, як показано нижче:
var str = multiline(function(){/*
<!doctype html>
<html>
<body>
<h1>❤ unicorns</h1>
</body>
</html>
*/});
На виході:
<!doctype html>
<html>
<body>
<h1>❤ unicorns</h1>
</body>
</html>
Смуга відступу
Ви можете використовувати multiline.stripIndent(), щоб зробити багатостроковий відступ без збереження надлишкових пропусків.
var str = multiline.stripIndent(function(){/*
<!doctype html>
<html>
<body>
<h1>❤ unicorns</h1>
</body>
</html>
*/});
На виході:
<!doctype html>
<html>
<body>
<h1>❤ unicorns</h1>
</body>
</html>
Заміна рядків
console.log() підтримує string substitution:
var str = 'unicorns';
console.log(multiline(function(){/*
I love %s
*/}), str);
//=> I love unicorns
FAQ
Але в JS вже є багатостроковий текст з \?
var str = 'foo\
bar';
Це не багаторядковість. Це лінія-продовження. Вона не зберігає нові рядки.
Ви повинні зробити наступне:
var str = 'foo\n\
bar';
Але тоді ви могли б виконати об'єднання так:
var str = 'foo\n' +
'bar';
Зверніть увагу, що ES6 матиме реальний багатостроковий текст.
Браузер
У той час як це гарно працює в браузері, воно в основному призначене для використання в Node.js. Використовуйте на свій страх і ризик.
Інсталювання
Сумісність
- Найновіший Chrome
- Firefox >=17
- Safari >=4
- Opera >=9
- Internet Explorer >=6
Мініфікація
Не дивлячись на те, що коментарі прибрані за замовчуванням, є способи, щоб зберегти їх:
- Спотворювання: Використовувати
/*@preserveзамість/*та задіяти функцію коментування - Компілятор закриття: Використовувати
/*@preserveзамість/* - YUI компресор: Використовувати
/*!instead of/*
Крім того, необхідно додати console.log після коментаря, щоб він не видалявся як мертвого код.
Кінцевий результат буде виглядати так:
var str = multiline(function(){/*!@preserve
<!doctype html>
<html>
<body>
<h1>❤ unicorns</h1>
</body>
</html>
*/console.log});
258 2
GR: 4.458k
Коментарі: