P. *_*ore 4 ecmascript-6 template-literals
在python中,您可以像这样进行变量字符串插值:
song_context = { "adjective": "funny" }
ella_sings = "my {adjective} valentine".format(**song_context)
Run Code Online (Sandbox Code Playgroud)
在此,song_context对象格式化ella_sings字符串中的变量。
在ES6中,是否存在使用模板文字执行类似操作的内置方法?我正在寻找一种为给定字符串显式定义替换空间的快速方法。例如:
const song_context = { adjective: "funny" }
const ella_sings = `my ${adjective} valentine`.format(song_context)
Run Code Online (Sandbox Code Playgroud)
上下文:我知道执行此操作的其他方法,例如使用模板库或执行多次查找和替换,但是想知道ES6的任何部分是否开箱即用。我略读了ECMAScript 6.0标准的模板文字部分,并且很清楚地指出了"Let ctx be the running execution context"这一点,但是似乎很难相信它们不会在必要时不提供一种更明确地说明上下文的方法。
在ES6中,是否有内置的方法可以对模板文字进行类似的处理?
模板文字没有特殊逻辑。${..}方括号之间的代码只是一个正常表达式,该表达式被评估为一个值。
`my ${adjective} valentine`
Run Code Online (Sandbox Code Playgroud)
是总是要寻找一个命名变量adjective在局部范围内。您当然可以将其更改为
`my ${song_context.adjective} valentine`
Run Code Online (Sandbox Code Playgroud)
如果您不想更改其中的一部分,则可以始终使用解构,例如
const {adjective} = song_context;
const ella_sings = `my ${adjective} valentine`
Run Code Online (Sandbox Code Playgroud)
或使用IIFE:
const ella_sings = ({adjective}) => `my ${adjective} valentine`)(song_context);
Run Code Online (Sandbox Code Playgroud)
如果需要,您还可以围绕模板文字构建自己的模板系统,但是它开始变得很快,并且失去了使您首先要使用模板文字的大部分好处。
您可能想在Javascript MDN上阅读更多内容,并注意名为“标记模板文字”的部分,因为它展示了如何将模板文字转换为完整的模板。
出于存档目的,我将导入相关部分:
标记模板文字
模板文字的更高级形式是标记模板文字。标签允许您使用函数解析模板文字。标签函数的第一个参数包含一个字符串值数组。其余参数与表达式相关。最后,您的函数可以返回您操作的字符串(或者它可以返回完全不同的内容,如下一个示例中所述)。用于标记的函数名称可以任意命名。
var person = 'Mike';
var age = 28;
function myTag(strings, personExp, ageExp) {
var str0 = strings[0]; // "that "
var str1 = strings[1]; // " is a "
// There is technically a string after
// the final expression (in our example),
// but it is empty (""), so disregard.
// var str2 = strings[2];
var ageStr;
if (ageExp > 99){
ageStr = 'centenarian';
} else {
ageStr = 'youngster';
}
return str0 + personExp + str1 + ageStr;
}
var output = myTag`that ${ person } is a ${ age }`;
console.log(output);
// that Mike is a youngster
Run Code Online (Sandbox Code Playgroud)
标记函数不需要返回字符串,如以下示例所示。
function template(strings, ...keys) {
return (function(...values) {
var dict = values[values.length - 1] || {};
var result = [strings[0]];
keys.forEach(function(key, i) {
var value = Number.isInteger(key) ? values[key] : dict[key];
result.push(value, strings[i + 1]);
});
return result.join('');
});
}
var t1Closure = template`${0}${1}${0}!`;
t1Closure('Y', 'A'); // "YAY!"
var t2Closure = template`${0} ${'foo'}!`;
t2Closure('Hello', {foo: 'World'}); // "Hello World!"
Run Code Online (Sandbox Code Playgroud)
这些标记的模板文字似乎正是您想要的。