HTMLの拡張言語作成について
Discussion
Closed
初めて質問するので、わかりにくい点があったらすみません。
やりたいこと
JavaScriptで、コンパイラもどきを作っています。
具体的な機能としては、HTMLの拡張言語的なもので、body
とかdiv
を本文
やコンテナ
というような、タグを日本語で書くというものです。この文法を、実際にHTMLに直せるようなコンパイラを作成したいです。
現状
正直に話すと、一応できました。
ただ、一介の高校生が作ったようなプログラムでは不安があったり、もっと良い方法があるのでは?と思ったので、皆さんならどう作るかなと思い質問させていただきました。
以下は、現在私が作成したプログラムです。
function compile(input) {
const tagMap = {
'見出し': 'h1',
'強調': 'strong'
};
const attrMap = {
'クラス': 'class',
'ソース': 'src'
};
let output = input.replace(/<\/?([^>]+)>/g, function (match, tag) {
let isClosingTag = match.startsWith('</');
let [tagName, ...attrs] = tag.split(' ');
tagName = tagMap[tagName] || tagName;
attrs = attrs.map(attr => {
let [attrName, attrValue] = attr.split('=');
attrName = attrMap[attrName] || attrName;
return `${attrName}=${attrValue}`;
});
return `<${isClosingTag ? '/' : ''}${[tagName, ...attrs].join(' ')}>`;
});
return output;
}
const input = `<見出し クラス="main">これは見出し<強調>ここは強調</強調></見出し>`;
const result = compile(input);
//result = <h1 class="main">これは見出し<strong>ここは強調</strong></h1>
オブジェクトに、日本語タグと、それに対応する英語(?)タグを入れておくことで、字句解析をした後、対応する部分があれば変換することで、HTMLを出力すると言った具合です。
もし何か質問がありましたら答えます。皆さんならどうするか、こうした方がいいかもとかありましたら、ぜひご教授いただきたいです。よろしくお願いします。