Question

我想创建一个JS预处理器，这只是显示来自js变量的数据，我目前得到了：

var ____Code = fs.readFileSync(__resources + '/help.txt').toString();
    ____Code.split('{%').forEach((i,ii) => {
      var _Code = i.split('%}')[0];
      ____Code.split('{%' + _Code + '%}').join(`${_Code}`);
    });

这段代码的重点基本上是如果我有一个看起来像这样的js文件：

var obj = {
  hello: 'world',
  language: 'javascript',
  filetype: 'text',
  test: {
    successfull: 'Yes!'
  }
}
var ____Code = fs.readFileSync(__resources + '/help.txt').toString();
    ____Code.split('{%').forEach((i,ii) => {
      var _Code = i.split('%}')[0];
      ____Code.split('{%' + _Code + '%}').join(`${_Code}`);
    });

help.txt看起来像这样：

Is this successfull? {%obj.test.successfull%}
I am a {%obj.filetype%} file, that is has been read by {%obj.language%}.
The default example for {%obj.language%} is: "Hello {%obj.hello%}"

然后我希望输出为：

Is this successfull? Yes!
I am a text file, that is has been read by javascript.
The default example for javascript is: "Hello world"

但实际结果与help.txt完全相同，我怎样才能将{%variable%}替换为实际的js变量？

Answer 1

您应该使用String#replace和Array#reduce的组合，而不是eval（通常性能较差且安全性较低）。

var data = {
  obj: {
    hello: 'world',
    language: 'javascript',
    filetype: 'text',
    test: {
      successful: 'Yes!'
    }
  }
}

var ____Code = // fs.readFileSync(__resources + '/help.txt').toString()
`
Is this successfull? {%obj.test.successful%}
I am a {%obj.filetype%} file, that is has been read by {%obj.language%}.
The default example for {%obj.language%} is: "Hello {%obj.hello%}"
`

var result = ____Code.replace(/\{%(.*?)%\}/g, function(_, path) {
  return path.split('.').reduce(function(o, k) {
    return o[k]
  }, data)
})

console.log(result)

Answer 2

试试这个：

var a = `
Is this successfull? {%obj.test.successfull%}
I am a {%obj.filetype%} file, that is has been read by {%obj.language%}.
The default example for {%obj.language%} is: "Hello {%obj.hello%}"
`;
var obj = {
  hello: 'world',
  language: 'javascript',
  filetype: 'text',
  test: {
    successfull: 'Yes!'
  }
}
var ____Code = a;
var b=____Code.split('{%').forEach((i, ii) => {
  if(ii===0)
  return;
  var _Code = i.split('%}')[0];
  var _text;
  eval(`_text=${_Code}`);
  console.log(_text);
  console.log(_Code)
  ____Code=____Code.replace('{%' + _Code + '%}',`${_text}`);
});
console.log(____Code)

为什么

“eval”功能是你想要的。

PS：这是用js写的很多模板引擎，如果你不介意的话，你可以找到一个并使用它。（例如下划线的模板）。

PPS：Why is using the JavaScript eval function a bad idea?

如何使像'object.object.variable'这样的字符串调用一个名称与字符串完全相同的变量？

2 个答案:

为什么