标签: template-strings

在JavaScript中使用反引号字符(`)?

在JavaScript中,反引用似乎与单引号相同.例如,我可以使用反引号来定义这样的字符串:

var s = `abc`;
Run Code Online (Sandbox Code Playgroud)

有什么方法可以使反引号的行为实际上与单引号的行为不同?


†请注意,在程序员中,"反引号"是更常被称为重音符号的名称.程序员有时也使用替代名称 "反引号"和"反向".此外,在Stack Overflow和其他地方,"反击"的其他常见拼写是"后退"和"后退".

javascript backticks template-strings single-quotes backquote

229
推荐指数
7
解决办法
12万
查看次数

将字符串转换为模板字符串

是否可以将模板字符串创建为通常的字符串

let a="b:${b}";
Run Code Online (Sandbox Code Playgroud)

然后将其转换为模板字符串

let b=10;
console.log(a.template());//b:10
Run Code Online (Sandbox Code Playgroud)

没有eval,new Function以及动态代码生成的其他方法?

javascript eval ecmascript-6 template-strings

128
推荐指数
11
解决办法
5万
查看次数

反引号调用函数

我不知道如何解释这个,但是当我跑步时

console.log`1`
Run Code Online (Sandbox Code Playgroud)

在谷歌浏览器中,我得到的输出就像

console.log`1`
VM12380:2 ["1", raw: Array[1]]
Run Code Online (Sandbox Code Playgroud)

为什么反引号调用日志函数,为什么它的索引是raw: Array[1]

Catgocat在JS房间里提出了一个问题,但除了一些关于模板字符串的内容之外没有任何答案是有意义的,因为这些字符串并不真正适合发生这种情况的原因.

javascript ecmascript-6 template-strings template-literals tagged-templates

73
推荐指数
3
解决办法
1万
查看次数

ES6模板文字与串联字符串

我有以下Ecma-Script-6的代码 template literals

let person = {name: 'John Smith'};   
let tpl = `My name is ${person.name}.`;    
let MyVar="My name is "+ person.name+".";

console.log("template literal= "+tpl);  
console.log("my variable = "+MyVar);
Run Code Online (Sandbox Code Playgroud)

输出如下:

template literal= My name is John Smith.
my variable = My name is John Smith.
Run Code Online (Sandbox Code Playgroud)

是小提琴.我试着寻找确切的差异但找不到它,我的问题是这两个陈述有什么区别,

  let tpl = `My name is ${person.name}.`;    
Run Code Online (Sandbox Code Playgroud)

  let MyVar = "My name is "+ person.name+".";
Run Code Online (Sandbox Code Playgroud)

我已经能够在这里MyVar连接字符串person.name了,那么使用模板文字的场景是什么?

javascript node.js ecmascript-6 template-strings

64
推荐指数
4
解决办法
6万
查看次数

模板字符串作为对象属性名称

为什么JavaScript不允许模板字符串作为对象属性键?例如,当我输入:

foo = {`bar`: 'baz'}
Run Code Online (Sandbox Code Playgroud)

在NodeJS REPL中,它会抛出一个SyntaxError带有长堆栈跟踪的"Unexpected模板字符串".但是,属性值很好,这并不是意料之外的.在浏览器中发生类似的错误,例如,Firebug会抛出SyntaxError"无效的属性ID".

"计算属性名称"中允许使用模板字符串.例如,这在所有支持语法的浏览器中编译得非常好:

var foo = {
    [`bar` + 1]: `baz`
};
Run Code Online (Sandbox Code Playgroud)

并创建对象{"bar1": "baz"}.

为什么不允许模板字符串作为文字对象键?是出于性能原因吗?必须在运行时编译模板字符串(如果我错了,请纠正我),这意味着每次遇到此对象时,解释器都必须计算对象名称.考虑到"煮熟的"模板字符串之类的东西,这似乎可能会变慢,尽管我们从ES5开始就有吸气剂和固定器.Firefox没有提到这是一个错误,这就是我发现它意外的原因.将来某个时候会允许语法吗?

javascript object-literal node.js template-strings template-literals

59
推荐指数
3
解决办法
2万
查看次数

模板字符串ES6可防止换行

我有一个长字符串,我使用ES6模板字符串构建,但我希望它没有换行符:

var string = `As all string substitutions in Template Strings are JavaScript
              expressions, we can substitute a lot more than variable names.
              For example, below we can use expression interpolation to 
              embed for some readable inline math:`

console.log(string);
Run Code Online (Sandbox Code Playgroud)

结果:

As all string substitutions in Template Strings are JavaScript
expressions, we can substitute a lot more than variable names.
For example, below we can use expression interpolation to
embed for some readable inline math:
Run Code Online (Sandbox Code Playgroud)

我的期望:

As all string substitutions in …
Run Code Online (Sandbox Code Playgroud)

javascript ecmascript-6 template-strings

50
推荐指数
5
解决办法
2万
查看次数

多行字符串,不会破坏缩进

根据这个讨论,ECMAScript 6中可以定义多行字符串,而不必将字符串的后续行放在行的最开头.

Allen Wirfs-Brock的帖子包含一个代码示例:

var a = dontIndent
        `This is a template string.
         Even though each line is indented to keep the
         code neat and tidy, the white space used to indent
         is not in the resulting string`;
Run Code Online (Sandbox Code Playgroud)

有人可以解释一下如何实现这一目标吗?如何定义这个dontIndent东西以删除用于缩进的空格?

javascript ecmascript-6 template-strings

32
推荐指数
4
解决办法
6276
查看次数

ES6 Raw String Access的实际用途是什么?

String.rawECMAScript 6中引入的Raw String Access 的实际用途是什么?

// String.raw(callSite, ...substitutions)

function quux (strings, ...values) {
    strings[0] === "foo\n"
    strings[1] === "bar"
    strings.raw[0] === "foo\\n"
    strings.raw[1] === "bar"
    values[0] === 42
}

quux `foo\n${ 42 }bar`

String.raw `foo\n${ 42 }bar` === "foo\\n42bar"
Run Code Online (Sandbox Code Playgroud)

我浏览了下面的文档.

http://es6-features.org/#RawStringAccess

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/template_strings

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/raw

http://www.2ality.com/2015/01/es6-strings.html

https://msdn.microsoft.com/en-us/library/dn889830(v=vs.94).aspx

唯一能理解的是,它用于获取模板字符串的原始字符串形式,并用于调试模板字符串.

什么时候可以用于实时开发?他们称之为标签功能.那是什么意思?

我错过了哪些具体的用例?

javascript rawstring ecmascript-6 template-strings

27
推荐指数
2
解决办法
8503
查看次数

模板字符串中的数字格式(Javascript - ES6)

我想知道是否可以格式化Javascript模板字符串中的数字,例如:

var n = 5.1234;
console.log(`This is a number: $.2d{n}`);
// -> 5.12
Run Code Online (Sandbox Code Playgroud)

或者可能

var n = 5.1234;
console.log(`This is a number: ${n.toString('.2d')}`);
// -> 5.12
Run Code Online (Sandbox Code Playgroud)

这种语法显然不起作用,它只是我正在寻找的事物类型的一个例子.

我知道像sprintffrom underscore.string这样的工具,但这似乎是JS应该能够开箱即用的东西,特别是考虑到模板字符串的强大功能.

编辑

如上所述,我已经知道第三方工具(例如sprintf)和自定义功能.类似的问题(例如,相当于printf/String.Format的JavaScript)根本没有提到模板字符串,可能是因为在ES6模板字符串出现之前就被问过了.我的问题是针对ES6的,并且与实施无关.我很高兴接受一个答案"不,这是不可能的",如果是这样的话,但是最好的是有关提供此功能的新ES6功能的信息,或者是否有关于此功能是否在其上的一些信息办法.

javascript string-formatting ecmascript-6 template-strings

26
推荐指数
2
解决办法
2万
查看次数

为什么在使用模板字符串时可以在没有括号的情况下调用函数?

我有一个简单的日志功能:

function log(str) {
  console.log('logged: ', str);
}
Run Code Online (Sandbox Code Playgroud)

如果我在没有括号的情况下调用它(目前使用Chrome的开发工具)并传入模板字符串,如下所示:

log`foo`
Run Code Online (Sandbox Code Playgroud)

输出是: logged: ["foo", raw: Array[1]]

如果我用括号称呼它,

log(`foo`)
Run Code Online (Sandbox Code Playgroud)

输出是: logged: foo

为什么在Javascript中使用模板字符串调用函数没有括号?发生了什么导致结果与用括号调用结果不同?

javascript ecmascript-harmony ecmascript-6 template-strings ecmascript-2015

22
推荐指数
1
解决办法
2390
查看次数