JS冷知识之不起眼但有用的String.raw方法

console.log(String.raw`Hi!\nAkira`);

console.log(`Hi!\\nAkira`);

const blockTags = 'address|article|aside|base|basefont|blockquote|body|caption'
+ '|center|col|colgroup|dd|details|dialog|dir|div|dl|dt|fieldset|figcaption'
+ '|figure|footer|form|frame|frameset|h[1-6]|head|header|hr|html|iframe'
+ '|legend|li|link|main|menu|menuitem|meta|nav|noframes|ol|optgroup|option'
+ '|p|param|section|source|summary|table|tbody|td|tfoot|th|thead|title|tr'
+ '|track|ul';

const blockReg = new RegExp(`(<\\s*(?:(?:\\/\\s*(?:${blockTags})\\s*)|(?:(?:${blockTags})\\s*\\/\\s*)|hr)>\\s*?)\\n`, 'ig');

const blockReg = new RegExp(String.raw`(<\s*(?:(?:\/\s*(?:${blockTags})\s*)|(?:(?:${blockTags})\s*\/\s*)|hr)>\s*?)\n`, 'ig');

const script = `
    console.log('test \n test');
`
execScript(script);

console.log('test 
 test');

const script = String.raw`
    console.log('test \n test');
`
execScript(script);

<Katex macros={{...}}>
    公式字符串
</Katex>

import katex from 'katex';
import React from 'react';
import ReactDOM from 'react-dom'; 

const Katex = ({children, ...props}) => {
  const code = katex.renderToString(children, {
    ...props,
    throwOnError: false
  })
  return (
    <span dangerouslySetInnerHTML={{__html: code}}/>
  )
}

<Katex>x^2+y^2=1</Katex>

<Katex macros={{"\\f": "#1f(#2)"}}>
% \f is defined as #1f(#2) using the macro
\f\relax{x} = \int_{-\infty}^\infty
    \f\hat\xi\,e^{2 \pi i \xi x}
    \,d\xi
</Katex>

<Katex macros={{"\\f": "#1f(#2)"}}>{String.raw`
% \f is defined as #1f(#2) using the macro
\f\relax{x} = \int_{-\infty}^\infty
    \f\hat\xi\,e^{2 \pi i \xi x}
    \,d\xi
`}</Katex>

function KaTeX(strings, macros) {
  return katex.renderToString(strings.raw.join(''), {
    macros,
    throwOnError: false
  });
}