Question

我有一项任务是将字符串模式中的所有键替换为其值。输入是这样的：

[
  '{ "name": "John", "age": 13 }',
  "My name is #{name} and I am #{age}-years-old"
]

输出是这样的：'我叫约翰，我13岁'。
所以我想出了这个：

function FillTemplate() {
if (arguments.length < 2 || arguments.length > 7) {
    console.log('The input objects should be at least 1 and lesser than 7!');
}

for (let i = 0; i <= arguments.length - 2; i += 1) {
    JSON.parse(arguments[i]);

     for (let j = 0; j < Object.keys(arguments[i]).length; i += 1) {
         let currentKey = Object.keys(arguments[i])[j];
         console.log(currentKey);
     }
}
}

我有一个问题，当我的console.log（currentKey）我只有零但我的想法是在输入中取第一个对象然后json.parse它接下来取该对象中的所有键并用一个循环取每一个单独键，并用正则表达式模式替换模式字符串。但是这个Object.keys只返回给我零。问题在哪里？

Answer 1

你走了：

<script>
var foo = {
    "name" : "John",
    "age"  : 13
}
var string = "My name is #{name} and I am #{age}-years-old";

// Extract all templates (#{name}, #{age}, ...)
var matches = string.match(/#{[a-zA-Z]+?}/g);
if ( matches ) {
    matches.forEach(function(templateStringToReplace) {
        // Strip the special characters to dynamically get the indices of the object
        templateString = templateStringToReplace.replace(/#|{|}/g, "");
        string = string.replace(templateStringToReplace, foo[templateString])
    });
}

alert(string);

Answer 2

尝试相反的方法，先解析模板字符串，然后遍历所需的键，以便直接在对象中引用它们。另外，我不知道你试图用arguments对象做什么。

    // Our source array containing a data string and a template string
var source = [
        '{"name": "John", "age": 13 }',
        'My name is #{name} and I am #{age}-years-old'
    ],
    // helper function to grab all the parameters from a template string
    parseTemplate = function parseTemplate( template ) {
        var regex = /#\{(.+?)\}/g,
            parameters = [],
            nextParameter;
        do {
            // this regexp will grab the next series of characters surrounded by #{}
            nextParameter = regex.exec(template);
            if (nextParameter) parameters.push(nextParameter[1]);
        }
        // as long as there are parameters left, keep searching
        while (nextParameter);
        return parameters;
    },
    // population function, uses parseTemplate to get the parameters and then adds them to the template
    populateTemplate = function populate( template, data ) {
        var parametersToSaturate = parseTemplate(template);
        // for each parameter found, repalce that parameter in the string with the value from the data
        return parametersToSaturate.reduce(function( saturatedTemplate, parameter ) {
            return saturatedTemplate.replace('#{' + parameter + '}', data[parameter] || ('#{' + parameter + '}'));
        }, template);
    },
    result = populateTemplate( source[1], JSON.parse(source[0]) );
console.log(result);

只要保持从parseTemplate返回的数组是相同的顺序，就可以根据需要在字符串中重复使用任何参数。任何在数据中找不到的＃{val}参数都将保留。

如果你有多个对象，你可以循环遍历它们。

sources.forEach(function( source ) {
    console.log(populateTemplate( source[1], JSON.parse(source[0]) ));
});

如果您的浏览器支持它，您可以使用实际的JS模板字符串： https://developer.mozilla.org/nl/docs/Web/JavaScript/Reference/Template_literals

使用给定字符串模式

2 个答案: